MERN Full Stack Development
Go from your first HTML page to a deployed full stack app with MongoDB, Express, React and Node.js. Built for complete beginners.
- Duration
- 60 hours
- Modules
- 11 modules
- Lessons
- 60 lessons
- Level
- Beginner
Instructor: The Parallel Code Faculty
- 60 video lessons across 11 modules
- Self-paced, with progress saved to your account
- Verifiable certificate on completion
- Placement assistance (career support)
What you'll learn
- Build responsive web pages with HTML5 and CSS (Flexbox, Grid, media queries)
- Write JavaScript confidently: logic, functions, arrays, objects, the DOM and async code
- Build React apps with components, props, state, effects, forms and routing
- Create REST APIs with Node.js and Express, and test them with Postman
- Store and query data in MongoDB with Mongoose
- Connect React, Express and MongoDB into one MERN application
- Add basic login with password hashing and JWT
- Deploy a full stack project and present it with a clean GitHub repo
Skills you'll gain
About this course
This course takes you from how the web works to building and deploying your own full stack application. You'll start with HTML, CSS and JavaScript, then build interactive interfaces with React, write a backend with Node.js and Express, and store data in MongoDB. Every module ends with something you can show, and three mini projects lead up to a final project that you design, build and put online. Each lesson is about an hour: a short recap, the concept, live coding together, then an exercise to try yourself.
Curriculum
11 modules · 60 lessons · 60 hr
Understand how a website works and build a complete HTML page by hand. Outcome: Personal profile page.
- 1.1 How the web worksPreview1 hr
- 1.2 Setup: VS Code, Live Server, Git and GitHub1 hr
- 1.3 HTML basics1 hr
- 1.4 HTML5 semantic tags, tables and forms1 hr
- 1.5 Lab: personal profile page1 hr
Style pages and make them work on phone and desktop. Outcome: Responsive portfolio page.
- 2.1 CSS basics1 hr
- 2.2 The box model1 hr
- 2.3 Flexbox1 hr
- 2.4 CSS Grid and responsive design1 hr
- 2.5 Lab: responsive portfolio page1 hr
The core of programming. Everything later in the course depends on this module, so take it slowly and practise every example. Outcome: Logic exercises.
- 3.1 What is programming? Variables and data types1 hr
- 3.2 Operators and conditions1 hr
- 3.3 Loops1 hr
- 3.4 Functions1 hr
- 3.5 Arrays and objects1 hr
Make pages interactive and fetch live data, then combine it all in the first mini project. Outcome: Mini Project 1: To-do or weather app.
- 4.1 The DOM1 hr
- 4.2 Events and forms1 hr
- 4.3 ES6 essentials and JSON1 hr
- 4.4 Async JavaScript and fetch1 hr
- 4.5 Mini Project 1: To-do or weather app1 hr
Learn to think in components instead of whole pages. Outcome: Reusable components.
- 5.1 Why React? Your first React app1 hr
- 5.2 JSX and components1 hr
- 5.3 Props1 hr
- 5.4 State with useState1 hr
- 5.5 Lab: lists and conditional rendering1 hr
Handle forms and live data in React and finish the second mini project. Outcome: Mini Project 2: Movie or quote finder.
- 6.1 Controlled forms1 hr
- 6.2 useEffect1 hr
- 6.3 Fetching an API in React1 hr
- 6.4 Lifting state up and React Router1 hr
- 6.5 Mini Project 2: Movie or quote finder1 hr
Move from the browser to the server and build your first backend. Outcome: Simple Express server.
- 7.1 What is Node.js?1 hr
- 7.2 Node core modules1 hr
- 7.3 Express.js routes1 hr
- 7.4 Middleware1 hr
- 7.5 Lab: environment variables and error handling1 hr
Design and test a proper CRUD API. Outcome: In-memory CRUD API.
- 8.1 What is an API? REST principles1 hr
- 8.2 HTTP methods and status codes1 hr
- 8.3 Testing with Postman or Thunder Client1 hr
- 8.4 Build a CRUD API1 hr
- 8.5 Validation, errors and CORS1 hr
Store data permanently in a database. Outcome: CRUD practice on MongoDB Atlas.
- 9.1 Databases and MongoDB concepts1 hr
- 9.2 MongoDB Atlas setup1 hr
- 9.3 Reading data1 hr
- 9.4 Updating and deleting data1 hr
- 9.5 Lab: CRUD practice1 hr
Join React, Express and MongoDB into one working application. Outcome: Mini Project 3: Notes or contacts app.
- 10.1 Mongoose1 hr
- 10.2 Full CRUD API with Mongoose1 hr
- 10.3 Connecting React to the API1 hr
- 10.4 The full MERN flow1 hr
- 10.5 Mini Project 3: Notes or contacts app1 hr
Build one real project from idea to deployment, ideally as a team. Suggested ideas: expense tracker, blog, student management app or task manager. The project should include CRUD, a database, and basic login if time allows. Outcome: Working full stack project, deployed.
- 11.1 Plan the project1 hr
- 11.2 Design screens, data and routes1 hr
- 11.3 Set up the project1 hr
- 11.4 Build the backend1 hr
- 11.5 Build the frontend1 hr
- 11.6 Connect frontend and backend1 hr
- 11.7 Authentication basics1 hr
- 11.8 Finish features1 hr
- 11.9 Bug fixing and polish1 hr
- 11.10 Deployment1 hr
Frequently asked questions
Do I need any coding experience?+
No. The course starts from how the web works and builds up step by step.
What will I build?+
A profile page, a responsive portfolio, three mini projects (a to-do or weather app, a movie or quote finder, and a full stack notes or contacts app) and a final full stack project that you deploy online.
What software do I need?+
All free: VS Code, Node.js, Git, a GitHub account, Postman or Thunder Client, and a MongoDB Atlas account. Setup is covered in the lessons.
How do I get the certificate?+
Complete every mandatory lesson, then press Apply for Certificate on the course page. Our team reviews your application, usually within a few working days.