This site is powered by
course builder. Create your online course today.
Start now
Create your course
with
Autoplay
Autocomplete
Previous Lesson
Complete and Continue
MERN Stack
Intro
Useful Info
Overview (7:09)
Resources
Discord Server
Requirements (2:02)
Setup
VS Code (6:14)
Vite - Info (1:23)
Vite - Install (2:53)
Vite - Folder Structure (6:21)
Remove Boilerplate (0:55)
Obtain Assets (4:02)
Global CSS (3:18)
Title and Favicon (2:15)
Install All Libraries (optional) (2:04)
React Router
React Router - Info (2:30)
React Router - Initial Setup (3:59)
Create Pages (7:03)
Setup index.js (5:51)
Link Component (3:48)
Nested Routes (7:36)
Error Page (4:41)
Landing Page
Styled Components - Intro (5:11)
Wrapper (3:35)
Landing Page (8:03)
Landing Page - CSS (optional) (11:07)
Logo Component (3:01)
Logo and Images (1:38)
Error Page
Error Page - JSX (3:54)
Error Page - CSS (optional) (3:08)
Register Page
Register Page - Setup (7:47)
FormRow Component (7:18)
Login Page
Login Page (4:43)
Login and Register CSS (optional) (4:23)
Dashboard Page
Dashboard Setup (3:39)
Dashboard Structure (5:11)
Dashboard CSS (optional) (3:19)
Dashboard Context (9:14)
React Icons (2:22)
Navbar Structure (4:45)
Navbar CSS (optional) (8:03)
Links Data (4:34)
Sidebar Structure (5:07)
Sidebar Functionality (7:35)
Sidebar CSS (optional) (11:27)
NavLinks Component (2:50)
Big Sidebar (5:32)
Big Sidebar CSS (optional) (9:52)
Logout Container (7:53)
Logout Container CSS (optional) (5:54)
Theme Toggle (3:47)
Theme Toggle CSS (optional) (1:49)
Dark Theme Logic (10:14)
Dark Theme Logic - Bug Fix (1:33)
Dark Theme CSS (optional) (7:48)
Server
Folder Structure (5:43)
ES6 Modules (5:27)
Install Server Packages (3:25)
Express and Nodemon (5:23)
Thunder Client (3:24)
JSON Middleware (4:50)
Morgan and Dotenv (10:39)
New Node Features (optional) (7:30)
Get All Jobs (9:44)
Create Job (7:44)
Get Single Job (6:33)
Edit Job (4:37)
Delete Job (4:15)
NotFound and Error Route (4:22)
NotFound VS Error Route (4:34)
Controller and Router (11:52)
MongoDB (0:44)
Atlas Account (6:09)
Mongoose (1:05)
Connect DB (3:12)
Job Model (5:48)
Create Job Controller (6:59)
Async Errors (6:00)
Get All Jobs and Get Single Job (5:51)
Delete and Update Job (6:43)
Status Codes (2:30)
Custom Error (12:39)
More Custom Errors (1:48)
Validation Layer - Intro (3:10)
Express Validator - Setup (11:11)
Validation Middleware (8:15)
Constants (5:02)
Validate Job Input (9:54)
Validate ID Params (6:43)
Validate Job (10:28)
User Model (3:24)
User Controller and Router (4:54)
Create User (2:10)
Validate Register User (8:49)
Admin User (3:21)
Hash Password (6:13)
Hash Utils (2:57)
Validate Login (3:27)
Login Logic (7:03)
JWT (7:43)
JWT ENV (1:54)
HTTP Only Cookie (8:18)
Authenticate User Setup (6:16)
Verify Cookie (5:00)
Verify JWT (5:55)
Add User to Job Routes (4:45)
Validate Owner (7:12)
Logout Controller (3:26)
User Routes (8:27)
Get Current User (5:08)
Update User (7:16)
Get Application Stats (6:47)
Proxy Setup (9:16)
Concurrently (4:10)
Axios (7:05)
Register Page
React Router Action Intro (2:12)
First Action (7:31)
Register User Complete (14:27)
Navigation State (3:30)
React Toastify (5:40)
Dashboard and Login
Login User (7:50)
UseActionData Hook (5:48)
Loaders (4:28)
Get Current User (6:42)
Logout (3:00)
Jobs Pages
Add Job Structure (7:34)
Select Input (8:14)
Create Job Functionality (8:42)
Add Job CSS (optional) (5:51)
All Jobs Structure (6:29)
All Jobs Context (2:04)
Jobs Container JSX (3:41)
Jobs Container CSS (optional) (2:47)
Job Component (10:48)
Job Component CSS (optional) (11:34)
Edit Job - Setup (6:39)
Route Params (5:12)
Edit Job Loader (2:56)
Edit Job JSX (5:16)
Edit Job Action (3:02)
Delete Job (7:23)
Admin Page
Admin Page Setup (6:42)
Admin Page Complete (5:30)
Admin CSS (optional) (7:27)
Profile Page
Avatar Images (1:09)
Public Folder (5:13)
User Schema Update (2:07)
Profile Page Structure (9:46)
Profile Action (7:05)
Setup Multer (5:57)
Cloudinary (4:57)
Update User Functionality (12:16)
Submit Button Component (6:29)
Create Test User (4:53)
Restrict Access to Test User (7:20)
Mockaroo (4:37)
Populate DB (8:53)
Stats Page
Stats Route Setup (7:52)
Group by Job Status (9:40)
Group by Monthly Applications (9:43)
Stats Page Setup (6:32)
Stats Container (6:40)
BarChart Container (3:13)
Charts (8:05)
Charts Container CSS (optional) (1:36)
All Jobs Page
Query Params (5:45)
Search Param (6:18)
Job Status and Job Type (3:45)
Sort (5:40)
Pagination (10:59)
Search Form Setup (9:08)
Loader and Query Params (5:44)
Controlled Inputs (9:03)
Debounce (7:32)
Pagination Setup (7:28)
Render Buttons (7:10)
Pagination Logic - First Approach (8:31)
Pagination Logic - Complex Approach (13:56)
Button Container CSS (optional) (7:08)
Local Build
Local Build (7:51)
Render Intro (0:34)
Deploy (5:29)
React Query and Other Extra Features
Build Front-End Programmatically (8:50)
Update User - Fix (12:23)
Global Loading (4:45)
React Query - Install (7:02)
Page ErrorElement (7:52)
First Query with React Query (11:54)
React Query in Stats Loader (9:27)
React Query - Current User (4:40)
Invalidate Queries (5:29)
React Query - All Jobs (9:56)
React Query - Edit Job (4:12)
Axios Interceptors (6:01)
Security Packages (5:48)
React Query - All Jobs
Lesson content locked
If you're already enrolled,
you'll need to login
.
Enroll in Course to Unlock