Completed
00:00 Intro
Class Central Classrooms beta
YouTube videos curated by Class Central.
Classroom Contents
Your First Full-Stack Next.js Project - Server Components, Server Actions, Suspense, Kinde
Automatically move to the next video in the Classroom when playback concludes
- 1 00:00 Intro
- 2 02:59 Setup
- 3 04:31 Fresh Next.js app lookaround
- 4 08:57 Routing
- 5 10:25 Global styling with Tailwind CSS
- 6 12:58 Basic page content & styling
- 7 15:26 Header & Footer
- 8 18:37 Image component in Next.js
- 9 22:09 Nav with routes
- 10 23:22 Link component in Next.js
- 11 24:06 Finish header
- 12 25:30 Finish footer
- 13 27:40 Container
- 14 30:21 Metadata
- 15 31:12 Active nav link styling
- 16 32:11 Server components vs Client components
- 17 36:14 Data fetching
- 18 40:39 Next.js architecture overview
- 19 42:08 Dynamic routes post id
- 20 46:14 Params for data fetching
- 21 47:49 Suspense & Streaming loading.tsx
- 22 50:58 Suspense component more granular
- 23 54:31 Upvote Client component example
- 24 58:49 Next.js client-side features hooks, events, state
- 25 01:00:45 Create post page
- 26 01:04:36 Server action
- 27 01:13:37 Authentication to protect route Kinde
- 28 01:21:08 Middleware auth Kinde
- 29 01:23:14 Logout button
- 30 01:25:59 Finish create post page
- 31 01:30:04 Database & ORM in Next.js architecture
- 32 01:30:50 Prisma & SQLite setup
- 33 01:37:47 Add data to database
- 34 01:38:38 Getting data from database
- 35 01:41:10 Not found page
- 36 01:42:44 Caching & Revalidating revalidatePath
- 37 01:48:56 Auth for server actions Kinde
- 38 01:51:30 Static & Dynamic rendering
- 39 01:54:36 Deploy to Vercel pt. 1 Push to GitHub
- 40 01:56:15 Deploy to Vercel pt. 2
- 41 01:58:32 Vercel Postgres database
- 42 02:03:49 Kinde Auth for production