## Restaurant Site Project with GatsbyJS-1

I am starting a brand new project to built a restaurant site with GatsbyJS. This site will also hav...

An experienced fullstack JS dev

I am starting a brand new project to built a restaurant site with GatsbyJS. This site will also hav...

As many of my readers know from my previous post that, after investing in learning GatsbyJS for the p...

Welcome to part-30 of the series. I had one issue for the code styling, i did in the previous part. I...

Welcome to part-29 of the series. As i had added more blogs to my site, i found some more CSS issue...

Welcome to part-28 of the series. In this part i will start with adding the logic to show current c...

Welcome to part-27 of the series. As most of you know that i had completed my new blog site thewebd...

Welcome to part-26 of the series. In this part we will start to add the Mailchimp subscription to o...

Welcome to part-25 of the series. Since the site thewebdev.tech was deployed, i was able to check i...

Welcome to part-24 of the series. We have one thing left to do with the previous SEO plugin and it...

Welcome to part-23 of the series. I will start this part by creating the About page, which is curre...

Welcome to part-22 of the series. We will start by adding some Gatsby plugins to my newly created p...

Welcome to part-21 of the series. Now, that our site is live it’s time to add the good gatsby plugi...

Welcome to part-20 of the series. In the last part, i got an error while deploying to netlify. It w...

Welcome to part-19 of the series. I want to deploy the site in netlify, as almost everything is ove...

Welcome to part-18 of the series. Before moving forward, we need to do some CSS changes so that the...

Welcome to part-17 of the series. I want to have the concept of series in the site. Many of the blog...

Welcome to part-16 of the series. We need to add Side Menu on the right side also. It will open on...

As most of my readers know, i had invested heavily in GatsbyJS and writing blog in it for the past...

Welcome to part-26 of the series. In this part we will create a new addon called Website Sidenotes....

Welcome to part-25 of the series. In this part we will create a new addon called Mobile View Tester...

Welcome to part-24 of the series. In this part we will create a new addon called Read Mode. This ad...

Welcome to part-23 of the series. In this part we will create a new addon called List Tab Cookies....

In this part we will create a new addon called Search Tabs. This addon allows the user to search an...

Welcome to part-21 of the series. In this part we will create a new addon called Delete Everything....

Welcome to part-20 of the series. In this part we will create a new addon called Website History De...

Welcome to part-19 of the series. In this part we will create a new addon called Delete Last Downlo...

Welcome to part-18 of the series. We will complete our addon Tab Utility, which we had started buil...

Welcome to part-17 of the series. In this part we will create a new addon called Tab Utility. This...

Welcome to part-16 of the series. In this part we will create a new addon called Domain Blocker. Th...

Welcome to part-15 of the series. In this part we will create a new addon called Text Search. This...

Welcome to part-14 of the series. In this part we will create a new addon called Top Sites. It will...

Welcome to part-13 of the series. In this part we will create a new addon called Website Stats. It...

Welcome to part-12 of the series. In this part we will create a now addon called Simply Notes. It’s...

What I built For the Twilio Hackathon, I have built a very Simple Video app, which can b...

Welcome to the final part of the series. Our web-app is almost finish and only some CSS remains, so...

Welcome to part-7 of the series. We will now start showing the local web-cam video. So, open your v...

Welcome to part-6 of the series. In previous part we got our result back from twilio. Now, it’s tim...

Welcome to part-5 of the series. We need to do an api call to the twilio endpoint, which contains o...

Welcome to part-4 of the series. We will start from where we had left. We will do some coding now,...

Welcome to part-3 of the series. We will finally start creating twilio function in this part. First...

Welcome to part-2 of the series. We will continue our journey to build a simple video chat app with...

On Apr 02, 2020 one of my favourite dev community and site dev.to announced, a twilio hackathon. Th...

Welcome to part-11 of the series. I often go to unsplash.com for using royalty free images in all b...

Welcome to part-10 of the series. We will continue building extensions, which show some type of ima...

Welcome to part-9 of the series. We will continue building extensions, which show some type of imag...

Welcome to part-8 of the series. In this part we will make some more firefox extensions. We will cr...

Welcome to part-7 of the series. In this part i will mainly fix some small errors in the earlier su...

Welcome to part-6 of the series. As in the previous two parts, i will make one more firefox extensi...

Welcome to part-5 of the series. As in the previous part, i will make two more firefox extensions t...

Welcome to part-4 of the series. As, the title tells i will be creating some firefox extensions to...

Welcome to part-3 of the series. This part we will start by creating a simple firefox extension, wh...

Welcome to part-2 of the series. In this part we will start by submitting the firefox extension, wh...

Two years back i created a lot of firefox extensions(23 in total), also known as add-ons. Slowly, i...

Welcome to part-15 of the series. First let’s fix a small bug as the tags was not centring properly...

Welcome to part-14 of the series. In the last part we created menu for the Mobile view and in this p...

Welcome to part-13 of the series. We will start by adding the same box-shadow that we created for Se...

Welcome to part-12 of the series. We will start to add the Search functionality in our blog. There...

Welcome to part-11 of the series. We will first add one thing in TagList.js file, which we missed in...

Welcome to part-10 of the series. The first thing which we will do is to add the author details, wh...

Welcome to part-9 of the series. We will start to create our post-template.js file now. Let’s first...

Welcome to part-8 of the series. Now, it’s time to generate those pages programatically, when we cl...

Welcome to part-7 of the series. Let’s start from where we left. We will update our PostList.js to u...

Welcome to part-6 of the series. In this part we will, first start with our GraphQL queries. So, hea...

Welcome to part-5 of the series. In this part we will start with the adding gatsby-plugin-mdx in ou...

Welcome to part-4 of the series. In this part we will start with the footer component first. But i w...

Welcome to part-3 of the series. We will start where we had left and will first add a layout.css in...

Welcome to part-2 of the series. I will be using mdx for the Gatsby site and taken the initial lear...

As many of my wonderful readers might know, that i really got success in with by blog post with the...

Welcome to part-21 of the series. I had decided to put Advertisement in my site https://amazinghamp...

Welcome to part-6 of the series. As, you might know from earlier part that i am upgrading by person...

Welcome to part-5 of the series. As, you might know from earlier part that i am upgrading by person...

Welcome to part-4 of the series. As you might know that i build my personal site with Stackbit, w...

Welcome to part-2 of the series. You can find part-1 here , in which i completed first 10 videos of...

As i had told in my earlier series, that i had started working on React, Graphql and Apollo client...

Welcome to part-6 of the series.This series is based on the youtube series by Brad Traversy and you...

Welcome to part-5 of the series. This series is based on the youtube series by Brad Traversy and y...

Welcome to part-4 of the series. This series is based on the youtube series by Brad Traversy and...

Welcome to part-3 of the series. This series is based on the youtube series by Brad Traversy and y...

Welcome to part-2 of the series. This series is based on the youtube series by Brad Traversy and...

I had recently started working on a new project at work, which have GraphQL with React and it queri...

Welcome to part-20 of the series. As told in the earlier post, this series is based on the learni...

Welcome to part-19 of the series. As told in the earlier post, this series is based on the learni...

Welcome to part-18 of the series. As told in the earlier post, this series is based on the learnin...

Welcome to part-17 of the series. As told in the earlier post, this series is based on the learni...

Welcome to part-16 of the series. As told in the earlier post, this series is based on the learni...

Welcome to part-15 of the series. As told in the earlier post, this series is based on the learni...

Welcome to part-14 of the series. As told in the earlier post, this series is based on the learni...

Welcome to part-13 of the series. As told in the earlier post, this series is based on the learni...

Welcome to part-12 of the series. As told in the earlier post, this series is based on the learni...

Welcome to part-11 of the series. As told in the earlier post, this series is based on the learni...

Welcome to part-10 of the series. As told in the earlier post, this series is based on the learni...

Welcome to part-9 of the series. As told in the earlier post, this series is based on the learnin...

Welcome to part-8 of the series. As told in the earlier post, this series is based on the learnin...

Welcome to part-7 of the series. As told in the earlier post, this series is based on the learnin...

Welcome to part-6 of the series. As told in the earlier post, this series is based on the learning...

Welcome to part-5 of the series. As told in the earlier post, this series is based on the learnin...

Welcome to part-4 of the series. As told in the earlier post, this series is based on the learnin...

Welcome to part-3 of the series. As told in the earlier post, this series is based on the learning...

Welcome to part-2 of the series. As told in the earlier post, this series is based on the learning...

After creating two series with GatsbyJS — Agency site and Blog Site, i wanted to learn more about thi...

I have my personal portfolio site hosted on Github pages for sometime now. But i didn’t updated it fo...

Welcome to part-3 of the series. We will start by adding some Gatsby plugins to my newly created bl...

Welcome to part 2 of the series and my 100th blog :) After completing my blogging site in part-1, it...

I started my blogging journey 1.5 years back on medium and had written 98 blogs till date. It had soo...

Welcome to part 4 of the series. This series is inspired by this awesome YouTube series by The Net...

Welcome to part 3 of the series. This series is inspired by this awesome YouTube series by The Net...

Welcome to part 2 of the series. This series is inspired by this awesome YouTube series by The Net...

Welcome to a brand new series on CSS animation. While creating my earlier series CSS3 in 10 days, i d...

Welcome to Day 10 of learning CSS. As i have told earlier, this series is inspired by this awesome...

Welcome to Day 9 of learning CSS. As i have told earlier, this series is inspired by this awesome y...

Welcome to Day 8 of learning CSS. As i have told earlier, this series is inspired by this awesome y...

Welcome to Day 7 of learning CSS. As i have told earlier, this series is inspired by this awesome yo...

Welcome to Day 6 of learning CSS. As i have told earlier, this series is inspired by this awesome y...

Welcome to Day 5 of learning CSS. As i have told earlier, this series is inspired by this awesome y...

Welcome to Day 4 of learning CSS. As i have told earlier, this series is inspired by this awesome y...

Welcome to Day 3 of learning CSS. As i have told earlier, this series is inspired by this awesome y...

Welcome to Day 2 of learning CSS. As i have told earlier, this series is inspired by this awesome y...

Most of the time, we developers struggle with CSS and take the help of some CSS framework like bootst...

Continuing with React Native the next app i am making is a simple iPhone calculator. This post is ins...

Continuing my React Native journey, i found a great site https://learn.handlebarlabs.com/ by Spencer...

For the past one month, i have been doing development in React Native. I am using the expo-cli to cre...

I had delayed learning React Native for some time now. After working with React for quite sometime, i...

Welcome to part-3 of the series. In the previous part we have created a common footer in the layout c...

Welcome to part-2 of the series. We will start with Section Four here. We will have the usual Headin...

I have done quite a bit freelance WordPress development around 9 years back(2011). Three things which...

I was going through an article and found 10 cool web-apps for JS developer to make. Out of them one w...

Now that we have completed our Restaurant Billing app, it’s time to deploy it to the web. You can fin...

I had completed building the Indian Restaurant Billing App , which i started from the learning of Adv...

I am building a demo Indian Restaurant Billing App , after completing Advanced React course by Wes Bo...

I am building a demo Indian Restaurant Billing App , after completing Advanced React course by Wes Bo...

I recently started building Indian Restaurant Billing App as a part of applying my learning's , after...

I have recently completed the amazing Advanced React course by Wes Bos. In the course he taught to bu...

Welcome to part-4 of the series. This series have been inspired by this youtube tutorial from freecod...

Welcome to part-3 of the series. This series have been inspired by this youtube tutorial from freecod...

Welcome to part-2 of the series. This series have been inspired by this youtube tutorial from freecod...

We are starting a new series and it’s about the latest GraphQL. Here we built an App, with React in t...

We are going to build a simple app using the latest React feature of hooks, which lets us use Class c...

Welcome to the brand new series. Here, we will create an small translation app using the new Context...

Welcome to Part-7 of the series. We will create the StreamShow component first. So, whenever the user...

Welcome to Part-6 of the series. Let’s start where we left. We will next create our Delete component....

Welcome to Part-5 of the series. Let’s start where we left. We would like to associate users, to our...

Welcome to Part-4 of the series. We will start implementing streams in our project. Our Structure...

Welcome to Part-3 of the series. We will start implementing forms in our project. We will use Redux-f...

Welcome to Part-2 of the series. In this part , we will create Authentication to login to our App. W...

Welcome to the brand new series. Here, we will create a clone of the popular streaming service https:...

Welcome to part-4 of the series. In part-3 we had completed the version-1 of the app. Here, we will s...

Welcome to part-3 to the series. We will start from where we left in part-2. The network request in...

Welcome to part-2 to the series. We will start from where we left in part-1. We will work on SearchB...

Welcome to the brand new series to build an web app from scratch using ReactJS. We will be using the...

Welcome to Part-3 of the series. Most of the things in this series are from the great Photoshop cours...

Welcome to Part-2 of the series. Change Color using Hue We will next learn to change col...

For i a long time i postponed learning PhotoShop and instead learnt the other skills in programming....

Once you have studied HTML and CSS, the best way to learn it is to build some websites. But you also...

I had recently moved to Angular at work after working in React for quite sometime. Unlike React where...

Welcome to part-17 of the series and the final part of Interview Preparation. Below questions can be...

Welcome to part-16 of the series and the second part in Tricky questions. Question 109- What is the...

Welcome to part-15 of the series and the first part in Tricky questions. Now, the interviewer can a...

Welcome to part-14 of the series and the second part in CSS questions. Question 86- What is specifi...

Welcome to part-13 of the series and the first part in CSS questions. Question 79- What is the diffe...

Welcome to part-12 of the series and the part on Algorithm running time questions. A lot of time, th...

Welcome to part-11 of the series and the second part in Object Oriented JavaScript questions. Questi...

Welcome to part-10 of the series and the first part in Object Oriented JavaScript questions. In this...

Welcome to part-9 of the series and third part in React & Redux questions. Question 53- How to p...

Welcome to part-8 of the series and second part in React & Redux questions. Question 48- Explain...

Welcome to part-7 of the series. Most of the time companies asks to create a React/Redux project, or...

Welcome to part-6 of the series. We will continue with our ES6 questions here. Question 34- Explain...

Welcome to part-5 of the series. We will start new question regarding new features which were release...

Welcome to part-4 of the series. Let’s start with where we left. Question 16- Explain the concept of...

Welcome to part-3 of the series. Let’s start with where we left. Question 12- What is the difference...

Welcome to part-2 of the series. Let’s start with where we left. Question 4- What is the difference...

We all know that JavaScript interviews(especially FrontEnd interviews) can be pretty hard, because in...

Welcome to the final part of the series. We will use this codepen for the album layout page. The ba...

Welcome to part-7 of the series. We will learn the important concept of CSS Grid alignment and cent...

Welcome to Part-6 of the series. In part-4 of the series, we used grid-column and grid-row concept t...

Welcome to part-5 of the series. We will first learn about the auto-fill and auto-fit property in th...

Welcome to part-4 of the series. We will first learn about Sizing Grid Items in this tutorial. In Gr...

Welcome to part-3 of the series. We will look into Sizing Tracks in CSS Grid how. For this we will u...

Welcome to part-2 of the series. Let me start with the dev tools which are really beneficial for dev...

As i have written in my previous blog on flexbox, that it helped me get out of the bootstrap trap. I...

The this keyword can sometime be one of the most confusing things of JavaScript, as it is different t...

Welcome to part-4 of the series. This series is all from the learnings of Kyle Simpson and also from...

Welcome to part-3 of the series. This series is all from the learnings of Kyle Simpson and also fro...

Welcome to part-2 of the series. This series is all from the learnings of Kyle Simpson and also fro...

Welcome to the second series of You don’t know JS. Part one of the series was regarding Scopes and Cl...

Welcome to the Part5 of YDKJS series. As told in part1 this series is based on my learnings from lege...

Welcome to the Part4 of YDKJS series. As told in part1 this series is based on my learnings from lege...

Welcome to part3 of the series. The traditional languages like Java and C++ are compiled languages,...

Welcome to the Part2 of YDKJS series. As told in part1 this series is based on my learnings from lege...

Every Javascript developer knows one thing that they don’t know enough Javascript. On the top level,...

I generally use styled components, most of the new CSS which I do at work. One of the main benefit of...

We will start looking at the flex items property from here onwards. We will use this codepen for our...

You can find the codepen used in this part here. We will start with flex container property align-co...

Alignment & Centring We will learn alignment and centring here. We will use this basi...

I have been developing sites for quite sometime now. First using Javascript, then React. Always have...

The youtube player which we have created so far uses the usual bootstrap. Now i have learnt the hard...

Many times in UI development we get request from client/user to highlighted item from a list once cli...

Welcome to Part 3 and here we will add the functionality to click on a video, in the list to select i...

Welcome to Part 2 of the Flux series. Now we will add the SearchBar functionality. It is pretty much...

I have written a three part series to create a youtube player. It used only React and heavily depends...

We now have three main tasks remaining. First showing the Video player, second the option to click...

Welcome to part 2. Let’s start from where we left, but first add bootstrap to our project so that i...

My journey with react started more then a year back. I was already doing some web-development with...