Getting Started

Overview

Building a simple e-commerce web app using React JS (with Create React App), Tailwind CSS, JSON-Server, React Router, and user login support:

• React JS (via create-react-app)
• Tailwind CSS for styling
• React Router for page navigation
• JSON-Server as a mock backend
• LocalStorage for basic login state management

E-Commerce Website Plan – 10 Episodes

Episode	Title	Description
1	Project Setup	Initialize with create-react-app, setup TailwindCSS, folder structure
2	Home Page UI	Design product card layout using dummy JSON, create reusable components
3	Add React Router	Setup React Router for Home, Cart, Login; create Navbar with links
4	JSON-Server Setup	Install & configure JSON-Server with /products, /users, /cart
5	Cart Page	Build Cart page, “Add to Cart” button, save cart to JSON-Server
6	Login Functionality	Create Login page, use JSON-Server /users, manage login with localStorage
7	Protected Routes	Restrict access to /cart if not logged in, redirect to /login
8	Cart Quantity Logic	Add item quantity controls, update total price calculation
9	Styling & Responsive Design	Polish UI using TailwindCSS, make layout responsive
10	Final Touches & Deployment	Add loading/error states, empty cart state, optional deploy (Vercel/etc.)