Next.js 2025 Full Stack Social App Tutorial
Learn to build a social app with Next.js & React in this 100-hour Udemy course. Try Clerk and Neon for free! π

Codesistency
133.8K views β’ Dec 31, 2024

About this video
My 100 Hours Udemy Course: https://dub.sh/udemy-discount
Try Clerk for FREE: https://go.clerk.com/zhRWtyq
Try Neon for FREE: https://fyi.neon.tech/1aap
Source Code: https://github.com/burakorkmez/nextjs-course
Join discord to ask your questions: https://discord.gg/yEyKQWYugG
Highlights:
- π Tech stack: Next.js App Router, Postgres, Prisma, Clerk & TypeScript
- π» Server Components, Layouts, Route Handlers, Server Actions
- π₯ Special Next.js files: loading.tsx, error.tsx, not-found.tsx
- π‘ API Integration using Route Handlers
- π Data Fetching, Caching & Revalidation
- π Client & Server Components
- π£οΈ Dynamic & Static Routes
- π¨ Styling with Tailwind & Shadcn
- π Authentication & Authorization
-π€ File Uploads with UploadThing
- ποΈ Database Integration with Prisma
- π Server Actions & Forms
-β‘ Optimistic Updates
Timestamps:
00:00:00 - Demo App
00:02:57 - Setup & Authentication
00:22:11 - Shadcn & Dark/Light Mode
00:29:38 - Building Navbar.tsx
00:44:46 - Postgres & Prisma
01:19:46 - Auth & DB Sync
01:32:13 - Building Sidebar
01:44:19 - Creating Posts
02:04:40 - Suggested Users
02:25:40 - Like & Comment & Delete Posts
03:03:19 - A Quick Recap & Route Handlers & Special Files
03:16:00 - Notifications Page
03:31:56 - Profile Page
04:02:40 - Image Uploads with UploadThing
04:15:02 - Deployment & Final Tests
Keywords:
React.js, Next.js, Next.js Crash Course
#reactjs #nextjs #programming
Try Clerk for FREE: https://go.clerk.com/zhRWtyq
Try Neon for FREE: https://fyi.neon.tech/1aap
Source Code: https://github.com/burakorkmez/nextjs-course
Join discord to ask your questions: https://discord.gg/yEyKQWYugG
Highlights:
- π Tech stack: Next.js App Router, Postgres, Prisma, Clerk & TypeScript
- π» Server Components, Layouts, Route Handlers, Server Actions
- π₯ Special Next.js files: loading.tsx, error.tsx, not-found.tsx
- π‘ API Integration using Route Handlers
- π Data Fetching, Caching & Revalidation
- π Client & Server Components
- π£οΈ Dynamic & Static Routes
- π¨ Styling with Tailwind & Shadcn
- π Authentication & Authorization
-π€ File Uploads with UploadThing
- ποΈ Database Integration with Prisma
- π Server Actions & Forms
-β‘ Optimistic Updates
Timestamps:
00:00:00 - Demo App
00:02:57 - Setup & Authentication
00:22:11 - Shadcn & Dark/Light Mode
00:29:38 - Building Navbar.tsx
00:44:46 - Postgres & Prisma
01:19:46 - Auth & DB Sync
01:32:13 - Building Sidebar
01:44:19 - Creating Posts
02:04:40 - Suggested Users
02:25:40 - Like & Comment & Delete Posts
03:03:19 - A Quick Recap & Route Handlers & Special Files
03:16:00 - Notifications Page
03:31:56 - Profile Page
04:02:40 - Image Uploads with UploadThing
04:15:02 - Deployment & Final Tests
Keywords:
React.js, Next.js, Next.js Crash Course
#reactjs #nextjs #programming
Video Information
Views
133.8K
Likes
3.3K
Duration
04:22:33
Published
Dec 31, 2024
User Reviews
4.7
(26) Related Trending Topics
LIVE TRENDSRelated trending topics. Click any trend to explore more videos.
No specific trending topics match this video yet.
Explore All Trends