Welcome to Full-Stack Development with the MERN Stack

Introduction to MERN Stack • Quick overview of MongoDB, Express.js, React.js, and Node.js. • How the MERN stack enables full-stack development. • Tools setup: Node.js, npm, MongoDB, and Visual Studio Code.

React Basics • React components, JSX, and the virtual DOM. • Managing state with useState and useEffect.

Practical Exercise: React Basics • Build a simple dynamic app (e.g., a to-do list).

React Router for Multi-Page Apps & React and External APIs • Setting up navigation with React Router. • Dynamic routing and passing data between routes. • Fetching data using Axios or Fetch API. • Practical exercise: Build an app to display data from a public API.

Building RESTful APIs with Node.js and Express • Setting up an Express server. • Creating API endpoints with CRUD operations.

Database Operations with MongoDB • Connecting Node.js to MongoDB using Mongoose. • Schema creation and database operations

Practical Exercise: Backend API • Build an API for a user management system.

Securing the Backend • Authentication with JWT. • Middleware for role-based access control.

Connecting Frontend and Backend • Implementing API calls in React to fetch and post data. • Displaying backend data dynamically in the React app.

Project Overview and Team Setup • Explanation of the project requirements and objectives. • Forming teams and assigning roles.

Development Phase I • Backend API development and database setup.

Development Phase II • Frontend development and integration with the backend.

Development Phase III • Completing the project features and debugging.

Project Presentation and Closing Ceremony • Teams present their projects (e.g., task manager, e-commerce app, or blog). • Feedback from facilitators and peers.

General discussions, Closing, Certification and Evaluation