React Crash Course: Build Netflix in React from Scratch
Help me keep high-quality content free by supporting me on Patreon: / shrutikapoor
Add authentication to your apps easily and securely with Clerk: https://go.clerk.com/CYrvZF2
Learn React 19 in 2026 by building a professional Netflix Clone from scratch in this complete crash course. This hands-on project takes you from beginner to advanced React developer and gives you a portfolio-worthy project to showcase in interviews.
Video References
GitHub Repo: https://github.com/shrutikapoor08/you...
Full Course on O'Reilly: https://www.oreilly.com/library/view/...
Discord Community: https://bit.ly/shruti-discord
What You'll Build
✅ Fully responsive Netflix-style web app
✅ Search functionality with real-time results
✅ Infinite scroll for browsing movies
✅ Video player integration
✅ User authentication system
✅ Optimized performance and deployment-ready code
Technologies Covered
React 19 | TypeScript | Vite | Tailwind CSS | Zustand (State Management) | TanStack Router | TanStack Query | Clerk Authentication | Vitest & React Testing Library | TMDB API | Vercel/Netlify Deployment
Prerequisites
• Basic HTML, CSS, and JavaScript knowledge
• No prior React experience needed - we start from scratch!
Recommended Courses
1. React Course for Beginners by Shruti Kapoor: https://www.oreilly.com/library/view/...
2. Become a FullStack Developer (20% off): https://scrimba.com/fullstack-path-c0...
Interview Resources
1. Practice JavaScript Interviews: https://www.greatfrontend.com/questio...
2. FREE React Interview Questions Book: https://bit.ly/free-react-guide
Helpful Resources
1. Sign Up for React & AI Updates: https://bit.ly/shruti-newsletter
2. Stuck? Join Discord for Help: http://bit.ly/shruti-discord
Work With Me
1. Book 1:1 Technical Guidance: https://topmate.io/shrutikapoor08
2. Mock Interviews: Join our Discord community
🌐 Connect With Me
Twitter/X: / shrutikapoor08
Discord: https://bit.ly/shruti-discord
Website: https://shrutikapoor.dev/
Newsletter: https://bit.ly/shruti-newsletter
GitHub Sponsors: https://github.com/sponsors/shrutikap...
⏱️ Timestamps
00:00 Intro
01:00 Setup a Coding Ritual
02:30 Setup Coding Environment
03:19 Setup React & Code Organization
05:45 Data Walkthrough
06:38 Setting Up Foundational UI Components
11:40 Homework Challenge #1
12:15 Building Responsive UI
17:39 Debugging CSS Specificity Issue
19:08 Rendering Lists in React - MovieList Component
29:30 Adding Shadcn Components
39:20 Homework Challenge #2
44:15 Event Handling in React
47:23 Fragments in React
48:50 useState Hook
51:36 Homework Challenge #3
52:25 Implementing Search Function
1:00:15 Homework Challenge #4
1:00:43 State Management in React Using Zustand
1:09:35 Implementing Routes Using TanStack Router
1:28:57 useEffect Hook
1:32:00 Keeping Tokens Private Using .env and Environment Variables
1:36:59 Fetching Data from TMDB API
1:39:19 Error Boundaries and Error Component
1:45:28 Creating a Custom React Hook
1:55:05 Homework Challenge #5
1:55:14 Accessibility Best Practices
2:10:49 Homework Challenge #6
2:11:11 Testing Using Vitest and React Testing Library
2:17:01 Homework Challenge #7
2:17:15 Authentication Using Clerk
2:21:52 Homework Challenge #8
2:22:39 Using TanStack Router to Fix Data Loading Bugs
2:26:02 TanStack Query Deep Dive
2:27:44 Homework Challenge #9
2:29:19 Homework Challenge #10
2:30:44 Performance Optimization Techniques
2:41:16 Deployment to Vercel/Netlify
2:47:29 Course Recap & Next Steps
---
Like, share, and subscribe for more coding tutorials and full courses!
DISCLAIMER: Some links above may be affiliate links. If you purchase via these links, I may receive a small commission at no additional charge to you. This helps support the channel!
---
#react #webdevelopment #frontend #shrutikapoor
Sub: 21230