Build a Full Stack Book Store App Using React, Node, MongoDB

Estimated read time 2 min read

Post Content

​ Learn to build a comprehensive fullstack MERN stack bookstore website from @mdalmamunit427. This project will cover both frontend and backend development from the ground up.

As a MERN stack project, we’ll be using React for the frontend, Node.js and Express.js for the
backend, and MongoDB as our database. We’ll also leverage technologies like Tailwind CSS,
Redux, RTK Query Toolkit, Mongoose, and JWT (JSON Web Tokens) to enhance our project.

Our bookstore will feature an admin dashboard for managing books, a cash-on-delivery system, and a robust inventory management system. Users can easily add or remove products from their carts, proceed to checkout, and place orders. For admins, we’ll create a secure admin dashboard accessible with a username and password. Admins will have the power to upload new books, manage and update existing book
information, and delete books as needed.

πŸ’» Starter Files: https://github.com/mdalmamunit427/book-store-app-ui-assets.git
πŸ’» Full Source code: https://github.com/mdalmamunit427/build-full-stack-book-store-mern-app.git

⭐️ Chapters ⭐️
0:00:00 Introduction
0:01:39 Project Overview
0:12:41 Setup Project
0:22:04 Install Tailwind CSS
0:28:46 Setup React Router DOM
0:43:36 Customize Your Project
0:54:57 Create a Responsive Navbar
1:30:35 Banner Section
1:39:33 Top Sellers Section
2:11:55 Recommend Books
2:15:15 News Section
2:29:01 Footer Section
2:35:21 Login and Register Page
3:03:42 Install Redux Toolkit & Add to Cart
3:31:41 Cart Page, Remove from Cart, Clear Cart
3:43:57 Create Checkout Page
3:54:45 Server Setup, Mongoose & MongoDB
4:19:22 Create Blog Schema & Model
4:24:09 Book Routes & Controllers
5:07:53 Create bookApi using RTK Query & Display Books
5:36:56 Firebase Setup, Implement Login & Register
6:26:39 Private Routes
6:33:13 Create Order Endpoint & Place Order
7:16:58 Create Admin & Verify Token
7:45:30 Admin Router & Dashboard Login
8:07:20 Admin Dashboard: Add, Edit & Delete Books
8:55:58 How to Deploy Your MERN Project

πŸŽ‰ Thanks to our Champion and Sponsor supporters:
πŸ‘Ύ Drake Milly
πŸ‘Ύ Ulises Moralez
πŸ‘Ύ Goddard Tan
πŸ‘Ύ David MG
πŸ‘Ύ Matthew Springman
πŸ‘Ύ Claudio
πŸ‘Ύ Oscar R.
πŸ‘Ύ jedi-or-sith
πŸ‘Ύ Nattira Maneerat
πŸ‘Ύ Justin Hual

Learn to code for free and get a developer job: https://www.freecodecamp.org

Read hundreds of articles on programming: https://freecodecamp.org/newsΒ Β Β Read MoreΒ freeCodeCamp.orgΒ 

#programming #freecodecamp #learn #learncode #learncoding

You May Also Like

More From Author