How to build & deploy a MERN stack web application (typescript, mongo, express, react, node)

Deploy your websites with Hostinger: https://hostinger.com/webdevjunkie (get 10% off with code WEBDEVJUNKIE)

project code: https://github.com/codyseibert/flashc...

Learn how to build a full stack web application using vite to create and bundle our react single page application (spa). We will also be building a node rest api that will persist our data to a mongodb atlas cluster.

00:00 - Intro
01:37 - Hostinger Overview
14:56 - Vite React Setup
17:18 - Express Setup
32:09 - Mongo Atlas Setup
35:16 - Mongoose Setup
43:34 - API - Create Deck Endpoint
55:10 - .env file
01:01:56 - UI - Create Deck Page
01:16:32 - Fix Cors Error
01:21:58 - Fix Content Type
01:26:03 - API - GET Decks Endpoint
01:30:22 - UI - Fetch Decks
01:49:45 - API - Delete Deck Endpoint
01:52:59 - UI - Delete Deck Button
01:59:42 - UI - Setup React Router
02:03:21 - UI - Refactor Code
02:10:55 - API - Refactor Code
02:15:10 - API - Create Card Endpoint
02:20:02 - UI - Create Card
02:26:07 - API - Get Deck
02:27:50 - UI - Get Deck Code
02:30:42 - API - Delete Card
02:32:37 - UI - Delete Card
02:38:00 - UI changes and add Header
02:54:36 - Setting up API on VPS
03:03:07 - Setting up A Record
03:03:40 - Setup Caddy for HTTPS
03:06:28 - Build & Deploy React SPA


💬 Discord   / discord  
🔔 Newsletter http://eepurl.com/hnderP
📁. GitHub https://github.com/codyseibert

My VSCode Extensions:
- theme: material community high contrast
- fonts: Menlo, Monaco, 'Courier New', monospace
- errors: Error Lens
- extra git help: Git Lens
- tailwind css intellisense
- indent rainbow
- material icon theme
- prettier & eslint
- ES7+ React Snippets