Course Outline

🔹 Day 1: Backend Fundamentals with Node.js, Express & MongoDB

Session 1: Introduction to the MERN Stack

• What is MERN? Architecture and component roles
• Project structure and workflow overview
• RESTful APIs and MVC pattern

Session 2: Node.js and Express Basics

• Setting up a Node.js project
• Creating Express routes, middleware, and controllers
• Environment variables and server setup

Session 3: MongoDB and Mongoose

• MongoDB concepts: collections, documents, CRUD
• Connecting MongoDB to Node using Mongoose
• Schema design and data validation

Lab Activities:

• Build a backend server with Express and connect to MongoDB
• Create CRUD APIs for a sample resource (e.g., Products, Users)
• Test API endpoints using Postman

🔹 Day 2: React Frontend with API Integration

Session 1: React Essentials

• React app structure (create-react-app)
• Components, props, state, and event handling
• React hooks: useState, useEffect, useContext

Session 2: Building Pages and Forms

• Routing with React Router
• Controlled components and form validation
• Axios or Fetch for calling APIs

Session 3: State Management and UI Enhancements

• Lifting state and component composition
• Context API for global state
• Styling with CSS modules or Tailwind (optional)

Lab Activities:

• Build a frontend for the backend API (e.g., User or Product CRUD)
• Use React Router to navigate between pages
• Connect forms to backend APIs with Axios

🔹 Day 3: Full Integration, Authentication & Deployment

Session 1: Full-Stack Integration

• CORS, JSON parsing, and connecting frontend to backend
• User login, registration, and protected routes
• JWT authentication and token handling

Session 2: Deployment and Hosting

• Prepare app for production
• Hosting frontend (Netlify, Vercel)
• Hosting backend (Render, Railway, Heroku)
• Environment variables and security practices

Session 3: Capstone Project & Review

• Build a mini MERN app (e.g., Task Tracker, Blog App, E-commerce Lite)
• Present app structure and features
• Feedback and deployment walkthrough

Lab Activities:

• Secure routes with JWT and token validation
• Deploy full-stack app to cloud platforms
• Final project presentations and code reviews