Part 7: Finishing the Project

In the final part, we will be wrapping up our application by building out all the React components and using Stripe Checkout to accept payments.

Photo by Roberto Cortese on Unsplash

Hello friends! So, this is the final part of the MERN Stack series. In the first four parts, we discussed the backend part of our application in complete detail — from setting up the routes to accepting payments via stripe, we did all the backend work in those four parts. Then, in the fifth and sixth parts, we dealt with Redux actions, reducers, and stores and built out the authentication components.


Part 6: Building Redux Reducers and dealing with Auth Components

In the sixth part, we will be finishing up the Redux setup by building all the reducers files. We will also deal with components related to authentication in the React application.

Photo by Roberto Cortese on Unsplash

Hello friends! So, this is the sixth part of the MERN Stack series. In the first four parts, we discussed the backend part of our application in complete detail — from setting up the routes to accepting payments via stripe, we did all the backend work in those four parts. Then in the fifth part, we started building our frontend side, setting up the Redux actions and store.

If…


Part 5: Setting up Client and Redux

In the fifth part, we will set up the client-side for our application with React and will use Redux for the state management in our application.

Photo by Roberto Cortese on Unsplash

Hello friends! So, this is the fifth part of the MERN Stack series. In the first four parts, we discussed the backend part of our application in complete detail — from setting up the routes to accepting payments via stripe, we did all the backend work in those four parts.

If you have not read the first four parts yet, I am linking them here for you:-

So, from the fifth part onwards, we…


Part 4: Building the cart and orders routes and controllers

In the fourth part, we will build the REST APIs required for the handling cart and the orders in this project. We will be using Stripe Checkout to handle payments.

Photo by Roberto Cortese on Unsplash

Hello friends! So, this is the fourth part of the MERN Stack series we have recently started. In the first part, we all learnt how to set up the project and had explanations about various things we are going to use in the project and we developed all our models for the project in the second part with the help of Mongoose and MongoDB.

In the third part, we started to build the REST APIs which handles the authentication and items in our project. Now, in this fourth part, we will be wrapping up our backend part by building the…


Part 3: Building the authentication and items routes and controllers

In the third part, we will build the REST APIs required for the authentication and item handling in this project. We will also be building some custom middleware functions we would use in our project.

Photo by Roberto Cortese on Unsplash

Hello friends! So, this is the third part of the MERN Stack series we have recently started. In the first part, we all learnt how to set up the project and had explanations about various things we are going to use in the project and we developed all our models for the project in the second part with the help of Mongoose and MongoDB.

If…


Part 2: Designing the Models

In the second part, we will design all the required models using Mongoose to connect to the MongoDB database with our Express App.

Photo by Roberto Cortese on Unsplash

Hello friends! So, this is the second part of the MERN Stack series we have recently started. In the first part, we all learnt how to set up the project and had explanations about various things we are going to use in the project.

If you have not read the first part yet, here is the link to the first part:-

Now, in the second part, we will start building models for our application. We are using MongoDB as the database to store all our data. …


Part 1: Setting up the Project

Let’s build a simple E-Commerce website using MERN stack (MongoDB, Express, React and Node) where users can add items, pay and order.

Image by Roberto Cortese on Unsplash

Hello friends! So, I am starting a new article series based on MERN stack and this article is the first part of that series. This series will be completely focused on MERN stack (MongoDB, Express, React and Node). Previously, I have made two series which were a social media website and job search website but both of them were built on Django framework and we used Django templating engine to create the frontend for our applications at that time.

But, now we are using Full Stack Javascript to design and develop our applications. This means we would be using Node…


The ultimate guide to becoming a modern full-stack web developer.

Photo by James Harrison on Unsplash

Hello friends! So, as we all know, full-stack web development is quite popular and there are lots of jobs waiting for you in this domain. So, in this article, I will try to give a complete roadmap on how can you become a full stack developer.

I too had learnt full-stack development last year and you also can do the same. I am currently learning more and more and trying to do some projects to solidify my learnings. It is quite a good practice to make some projects once we learn something new.

So, who exactly are full stack developers?

There are backend developers who make APIs…


Let’s build a REST API which follows the CRUD principles using Node, Express and MongoDB and test it using Postman.

Photo by Greg Rakozy on Unsplash

APIs are a very common thing nowadays. They are used literally everywhere on the website. APIs serve as the connection between the database which stores all the data and the frontend with which the user interacts with to get access to the data.

API mean Application Programming Interface which is a set of clearly defined methods of communication between the frontend and the database.

REST which stands for Representational State Transfer is an architectural style for providing standards between computer systems on the web, making it easier for systems to communicate with each other.

REST APIs mostly use JSON as…


Let’s build a simple Todo App with React which teaches you the basic principles of CRUD (Create, Read, Update and Delete)

Photo by Markus Spiske on Unsplash

Hello readers! This is the first time I am writing an article on building something with React. So, I am also new to React and Frontend Frameworks. And the best way to make your first React project would be to make a simple Todo App.

Building a Todo App is easy and does not take much time but it teaches you some important concepts. It teaches you the principle of CRUD (Create, Read, Update and Delete) which are very important to understand for any developer.

Since this is our first project in the React world, we would keep things simple…

Kumar Shubham

Full Stack Web Development | Student@IIT BHU https://www.linkedin.com/in/shubham1710

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store