Develop Threads, Next.js 14 app that skyrocketed to 100 million sign-ups in less than 5 days, and dethroned giants like Twitter, ChatGPT, and TikTok to become the fastest-growing app ever!
Ultimate Next 14 Course is now live: https://www.jsmastery.pro/next15
Next.js 14 eBook: https://resource.jsmastery.pro/nextjs-guide
Quick heads up: This tutorial covers Next.js 13, but don't let that number fool you. Next.js 14 is essentially a performance-focused update of version 13. That means every concept, technique, and feature we dive into here is just as applicable and relevant in Next.js 14
⭐ Clerk - https://clerk.com/?utm_source=js_mastery&utm_medium=youtube&utm_campaign=sponsorship&utm_content=8_4_23
💼 Land your dream job with expert mentor guidance or get your money back. To find out more, apply here: https://jsmastery.pro/masterclass
If you’re experiencing Error: ClerkInstanceContext not found, apply the following Fix: Wrap your app with ClerkProvider in both /auth/layout.tsx and root/layout.tsx files.
📚 Materials/References:
GitHub Code (give it a star ⭐): https://github.com/adrianhajdin/threads
Public folder (assets): https://drive.google.com/file/d/1lg7MMKgXwFabymHi1qxRYMxWVXiZPM9l/view?usp=sharing
GitHub Gist Code: https://gist.github.com/adrianhajdin/060e4c9d3d8d4274b7669e260dbbcc8e
In this video, you'll:
- Master Next.js 14 with Server Side Rendering
- Learn MongoDB handling of complex schemas, multiple data population
- Create beautiful layouts with TailwindCSS
- Use Clerk for authentication
- Handle file uploads with UploadThing
- Explore Shadcn components
- Listen to real-time events with webhooks
- Understand middleware, API actions, and authorization
- Explore & integrate new Next.js layout route groups
- Validate data with Zod
- Manage forms with react hook form
- Create reusable components
- Build a solid application architecture
- Deploy the application and more!
💻 Join our Discord Community - https://discord.gg/n6EdbFJ
🐦 Follow us on Twitter: https://twitter.com/jsmasterypro
🖼️ Follow us on Instagram: https://instagram.com/javascriptmastery
💼 Business Inquiries: [email protected]
Time Stamps 👇
00:00:00 Intro
00:12:35 Auth
00:27:31 HomePage
01:03:35 Onboarding
01:58:17 Back-end
02:51:42 fetchPosts Homepage
03:01:06 Thread Card Structure
03:25:33 Reply/Comment
03:45:40 Profile Page
04:16:15 Search Page
04:33:55 Activity Page
04:50:15 Community Page
05:03:27 Expose API’s Route Deployment
05:45:27 Task
05:46:50 Final Deployment