Complete MERN Beginner Course (TypeScript, Authentication, Deployment…)
Learn how to build a full-stack MERN app with React, Node, Express, MongoDB Atlas, and TypeScript. This course is beginner-friendly and teaches you everything you need to know along the way.
Code for this course: https://github.com/codinginflow/MERN-course
Deployment tutorial for this app: https://www.youtube.com/watch?v=svEs1TafR7E
Sign up for Linode and get a $100 60day free credit for new Linode accounts: https://linode.com/codinginflow
⭐ Get my full-stack Next.js with Express & TypeScript course: https://codinginflow.com/nextjs
✅ Get my free React Best Practices course: https://www.codinginflow.com/reactbestpractices
💌 Join my newsletter for regular web dev tips: https://codinginflow.com/newsletter
💬 Join our developer community on Discord: https://codinginflow.com/discord
📣 Follow Coding in Flow on social media:
Twitter: https://twitter.com/codinginflow
Instagram: https://instagram.com/codinginflow
TikTok: https://tiktok.com/@codinginflow
Facebook: https://facebook.com/codinginflow
Timestamps:
0:00 – Course content + prerequisites
13:40 – NodeJS + Express + TypeScript + ESLint setup (Hello World)
49:11 – MongoDB Atlas + Mongoose setup + Envalid
1:16:08 – MongoDB model setup + Express error handling (+ what is middleware)
1:40:09 – Creating notes + routers + controllers
2:03:22 – Express HTTP error handling
2:21:40 – Update + delete notes (backend)
2:37:57 – React setup with TypeScript / What is declarative UI?
2:58:03 – Fetching notes + proxy
3:13:46 – React components & CSS modules
3:30:50 – Finishing notes styling
3:50:06 – Creating notes from the frontend
4:33:50 – Update + delete notes (frontend)
5:00:24 – Loading/error/empty states
5:10:44 – User authentication with express-session & cookies
5:54:54 – Frontend authentication + extracting form field components
7:00:52 – Protecting user notes with auth middleware
7:21:33 – Routing with react-router-dom
7:37:00 – Handling different HTTP errors in React