Build a Fullstack App with Authentication & Rate-limiting in NextJs 14

Опубликовано: 17 Июль 2026
на канале: Hamed Bahram

6,568

233

In this video, we’ll build an AI blog generator powered by OpenAI GPT-4 and DALL.E 3, Supabase backend for database and storage, Clerk authentication, Zuplo for our API Gateway, and NextJs 14 as our frontend application.

👉🏼 The Ultimate NextJs 14 Course
→ https://www.hamedbahram.io/courses/ne...

👉🏼 Project source code, links, and notes
→ https://www.hamedbahram.io/notes/ai-b...

👉🏼 Work with me
→ https://www.hamedbahram.io/hire

Chapters
0:00 Intro
2:30 High-level architecture
4:00 Setting up supabase
6:20 Setting up NextJs
8:30 Connecting to supabase
11:00 Header, home page & form component
14:00 Adding form action
16:40 Adding server action
20:00 Using OpenAI SDK
23:45 Using supabase storage
26:25 Using supabase db
28:30 Add form pending state
30:00 Creating dynamic blog [id] page
34:50 Adding the Recent blog section
39:00 Adding Clerk authentication
45:10 Adding Clerk UI components
51:00 Adding API Gateway
1:01:00 Updating NextJs to use the API Gateway
1:03:10 Quick review
1:04:40 Server function timeout setting
1:06:24 Recap