MERN Stack Project: Build & Deploy a Multi Election Voting App using MongoDB Express React Node

Fri, 05 Sep 2025 11:18:45 +0000

MERN Stack Projects: Build & Deploy a Multi Election Voting App using MongoDB Express React Node JS
Hostinger Discount: https://www.hostg.xyz/SH8cs

In this complete MERN stack project tutorial, we're going to build a full stack voting application that comes with Authentication with JWT, light-dark theme, full mobile responsiveness, multi-election voting functionality, and more! We will start by building and designing the frontend part of the project using React JS. Before we move on to the Backend, where we'll create the API using Node JS and Express JS, together with other pacakges like JWT for authentication, cloudinary for cloud file storage, Postman for testing our API endpoints, Mongo DB as our databse, and a lot more!
I will walk you through the entire project from scratch and make sure you understand everything step-by-step! In this first part of 3, we will build and design the frontend (all pages and components needed for the application). In the next video, we will work on the API or backend of the project.
This is the most practical MERN Stack project you can find on the internet.

Completed Project SOURCE CODE: https://buymeacoffee.com/egator/e/340214
Become a Patron: https://patreon.com/egator

Timestamps
00:00 Project Demo
17:13 Hosting and FREE Domain
21:00 Project Folder Structure
27:40 Routing
36:15 Error Page
39:00 General CSS Styles
52:50 Navbar
1:09:47 Theme Toggle
1:17:40 Register Page
1:29:35 Login Page
1:32:20 Results Page
2:01:00 Candidates Page
2:13:40 Redux Toolkit
2:20:50 Confirm Vote Modal
2:42:20 Congrats Page
2:45:53 vote-slice
2:54:04 Elections Page
3:07:15 Add Election Modal
3:18:00 Election Details
4:03:06 Backend (NodeJS ExpressJS API)
7:07:20 Connecting Client (React App) to Backend (Node Express API)
9:32:30 How to Deploy a MERN Stack Application

Assets: https://github.com/egattor/voting-app-assets