React Context Has Changed (v19 Full Tutorial)

Coding in Flow · Beginner ·🌐 Frontend Engineering ·11mo ago
Skills: React90%

Key Takeaways

Explains context in React 19 with the new syntax and use() hook

Original Description

Learn context in React 19 with the new syntax and new use() hook. Understand when and why to use context to avoid prop drilling. Including industry best practices and sample code to practice on. Starting code: https://github.com/codinginflow/react-19-context Final code: https://github.com/codinginflow/react-19-context/tree/Final-code ⭐ Get my full-stack Next.js with Express & TypeScript course: https://codinginflow.com/nextjs ✅ Get my free React Best Practices course: https://www.codinginflow.com/reactbestpractices 💌 Join my newsletter for regular web dev tips: https://codinginflow.com/newsletter 💬 Join our developer community on Discord: https://codinginflow.com/discord 📣 Follow Coding in Flow on social media: Twitter: https://twitter.com/codinginflow Instagram: https://instagram.com/codinginflow TikTok: https://tiktok.com/@codinginflow Facebook: https://facebook.com/codinginflow Timestamps: 0:00 - Intro 0:48 - Starting code setup 1:30 - The problem with prop drilling 5:22 - Basic context provider 11:23 - Nested context providers 14:01 - Auth provider 25:19 - Custom context hook 29:02 - Default value/SSR 33:05 - Conditionally calling use hook 37:38 - Outro & more resources
Watch on YouTube ↗ (saves to browser)
Sign in to unlock AI tutor explanation · ⚡30

Related Reads

📰
copilot browser tools make the frontend reviewable
Learn how GitHub Copilot browser tools make frontend reviewable, enhancing collaboration and code quality
Dev.to · Paulo Victor Leite Lima Gomes
 📰
Why Your React App Freezes Even With Zero API Calls (And How Web Workers Fix It)
Learn how to prevent UI freezing in React apps even with no API calls, using Web Workers
Dev.to · ARAFAT AMAN ALIM
 📰
React 19 Features — What Actually Changed and What I Use
Learn about the new features in React 19 and how to use them in your projects, with a focus on practical applications and real-world examples.
Dev.to · Safdar Ali
 📰
The Share Button Is the Product: Engineering a Viral Loop in Vanilla JS
Learn to engineer a viral loop using a share button in Vanilla JS to increase user engagement and retention
Dev.to · yunjie

Chapters (10)

Intro
0:48 Starting code setup
1:30 The problem with prop drilling
5:22 Basic context provider
11:23 Nested context providers
14:01 Auth provider
25:19 Custom context hook
29:02 Default value/SSR
33:05 Conditionally calling use hook
37:38 Outro & more resources
Up next
How to Speed Up Your WordPress Website with WP Rocket ⚡Tutorial 2026
Matt Tutorials
Watch →