Introduction to Next.js and React

A hands-on introduction to the main Next.js and React concepts by building and deploying a real application.

0:00 – Introduction
0:29 – Requirements
2:24 – Package Managers
4:45 – Running Locally
6:33 – Fast Refresh
6:57 – Routers
7:57 – React
8:44 – JSX
10:14 – Components
11:15 – Props
12:25 – Composing
14:08 – Imports and Exports
15:36 – External Components
17:05 – Create Next App
19:09 – Directory Overview
21:57 – Layouts and Pages
26:36 – Routing
27:43 – Dynamic Routes
28:36 – next/link
30:34 – Reading Route Parameters
31:48 – Nested Layouts
33:51 – Installing Postgres
35:15 – Async Components (Data Fetching)
40:53 – Suspense + Caching
43:58 – Styling
48:16 – Quiz Pages
51:01 – Database Schema
51:49 – Displaying Quiz Answers
54:29 – Displaying Correct Answer (Server Action)
1:01:44 – Creating New Quizzes (Forms)
1:14:40 – Revalidating Data
1:17:04 – Deploying to Vercel
1:20:21 – Conclusion

Here are some additional resources:

- Next.js Courses: https://nextjs.org/learn
- React Course: https://react.dev
- Me: https://leerob.io