Thapa Technical React 19 Tutorials: study plan and how long it takes
The Thapa Technical playlist is 156 videos and 48.4 hours long. Here's how long it takes at different paces, a week-by-week schedule built from the real videos, and a planner that turns it into your own daily plan.
156 videos · 48.4 hours · Thapa Technical
Thapa Technical's React 19 course in Hindi is one of the longest free React courses: the basics, error handling, mini projects, forms, custom hooks, global state, multi-page websites, React Query (TanStack) in a single long video, Redux Toolkit, and the latest React features and the React Compiler.
With over 150 videos, it's best planned in phases.
Who it's for: Hindi-speaking learners who want a complete, up-to-date React course with many small projects.
How long does it take?
The full playlist is 48.4 hours across 156 videos. Here's roughly how many days that is at different daily watch times and speeds, counting video time only:
| Daily time | At 1x | At 1.5x | At 2x |
|---|---|---|---|
| 30 min a day | 97 days | 65 days | 49 days |
| 1 h a day | 49 days | 33 days | 25 days |
| 2 h a day | 25 days | 17 days | 13 days |
Make your own schedule
The playlist link is already filled in. Press Plan, set how much time you have each day and your speed, and you'll get a day-by-day schedule with a finish date and a calendar file. It reads the live playlist, so new videos are included.
Week-by-week schedule
A sample plan at 2 hours a day and normal speed, using whole videos so none is split across days. That's 4 weeks in total. For a different pace, start date or speed, use the planner above.
Week 1Videos 1–50 · 12h 43m
Day 1 · 1h 49m
- 1React v19 Tutorial for Beginners in Hindi #1: What is React.js & Why Learn ReactJS in 202532m
- 2🚀 How to Install & Update React v19 in Vite – Full Guide (Stable Release!)9m
- 3🚀 Learn MERN Stack LIVE | 3-Day Diwali Special Offer 💥 | Limited Seats Available!4m
- 4#2: React Installation & Creating Our First Website with React JS v19 Tutorial in Hindi | 202423m
- 5[Solved] React JS v19 Tutorial #2.1 👉 Fixing React Installation Issue & Bun, npm, and pnpm Setup15m
- 6React JS v19 Tutorial #3: What to Learn Before React & 5 Tips to Maximize Your React Course (2024)10m
- 7React JS v19 Tutorial in Hindi #4: React Project Structure and Naming Conventions15m
Day 2 · 1h 50m
- 8React JS v19 Tutorial in Hindi #5: JSX (JavaScript XML) The Essential Building Block of React21m
- 9React JS v19 Tutorial #6: Components in React | Hindi16m
- 10#7: React Fragments: Remove unwanted Nodes & Speed Up Rendering | React v19 Tutorial in Hindi9m
- 11#8: Dynamic Values in JSX: Injecting JavaScript into HTML | React v19 Tutorial in Hindi13m
- 12#9: React Conditional rendering in JSX : React v19 Tutorial in Hindi17m
- 13#10: Our First React Interview Question & Answer | React Tutorial in Hindi 202417m
- 14#11: React Import and Export Explained | React Tutorial in Hindi 202417m
Day 3 · 1h 46m
- 15#12: Looping in JSX: Netflix Series Card Creation 🔥React Tutorial in Hindi18m
- 16#13: Props in React JS - Making Netflix Cards Reusable🔥React Tutorial in Hindi13m
- 17#14: React Destructuring Props in JSX | React Tutorial in Hindi8m
- 18#15: React JS Projects: How to Deal with Errors and Warnings - 3 Best Practices🔥7m
- 19#16: React Coding Challenge: Passing JSX as Props in React13m
- 20#17: Add CSS Styling in React: Class vs ClassName Explained in React JS15m
- 21#18: Inline CSS Styling in React.js: Essential Rules and Best Practices | React Tutorial in Hindi19m
- 22#19: Conditional Styling for Dynamic UIs in React.js | When and Why to Use It in React App14m
Day 4 · 1h 59m
- 23#20: CSS Modules in React: Scoped and Reusable Styles | React Tutorial in Hindi19m
- 24#21: Styled Components in React JS for Clean and Dynamic UI15m
- 25#22: Tailwind CSS in React v19: Installing and Using Tailwind CSS to Style Your React App🔥16m
- 26#23: Event Handling in React: Synthetic Events, Naming Conventions of Events & Functions & More23m
- 27#24: Passing Events as Props in React | Control Parent Function Using Child Component🔥13m
- 28#25: Event Propagation in React: Capturing, Bubbling, and Practical Implementation🔥12m
- 29#26: React States: What is useState Hook & Why we need it in React20m
Day 5 · 1h 31m
- 30#27: How React State Works: In-depth Guide with Theory, Animation, and Practical Examples17m
- 31#28: Why the state value does not reset to its initial value on re-render? Know the Real Reason🔥8m
- 32#29: React JS State Challenge: Master useState with Objects - Test Your Skills 🧑💻7m
- 33#30: Derived State in React.js: Improving State Management and Remove Redundancy & Dependency12m
- 34#31: Why You Need to Lifting State Up in React: A Complete Guide with Animation19m
- 35#31: React Mini Project🔥Toggle Switch Button Component19m
- 36#33: Best Website to Find Icons for Your React App: Complete Installation and Usage Guide9m
Day 6 · 1h 51m
- 37#34: React Project - Build a Complete Todo App from Scratch with Advanced Features37m
- 38#36: Create a Real-Time Digital Clock in React – Display Current Date and Time in Todo App15m
- 39#37: Delete Elements and Auto-Update Tasks in React: Add a Clear All Button to Your To-Do App16m
- 40#38: React Todo List: Creating and Sharing Reusable Components with Best Practices15m
- 41#39: Best Way to Store Todo Values in State & Adding Button to Check/Uncheck29m
Day 7 · 1h 57m
- 42#40: Keep Todo Data After Refresh: Adding Local Storage in React19m
- 43#41: Host Your React Todo App for Free in 20249m
- 44#42: Why Keys Are Important in React JS: Common Problems & Solutions Explained with Animation14m
- 45#43: Short Circuit Evaluation in React JS: Explained with Real-Life Examples13m
- 46#44: React Hook Rules! Every Dev Must Know to Master React JS8m
- 47#45: How to Use the useState Hook in React13m
- 48#46: React useState Hook Challenge: Advanced Counter App with Disable, Limits, Steps Counts & More13m
- 49#47: React Controlled vs Uncontrolled Components: Master React Forms with Notes and Code Examples14m
- 50#48: Registration Forms in React: Handling Multiple Input Fields with useState – The Hard Way14m
Week 2Videos 51–98 · 12h 33m
Day 8 · 1h 57m
- 51#49: React Form Handling: The Right Way to Manage Multiple Input Fields with One State Variable15m
- 52#50: Create a Login Form in React7m
- 53#51: Contact Forms in React: Get Contact Form Data in Two Ways13m
- 54#52: useEffect Hook with Dependency Array in React JS: Learn with 3 Practical Examples23m
- 55#53: React useEffect challenge ! Lets Solve it11m
- 56#54: useEffect Cleanup Function in React JS. Very Important14m
- 57#55: How NOT to Fetch API Data in React: Avoid Infinite Requests10m
- 58#56: Fetching API Data in React: A Step-by-Step Guide to Fetch Pokémon API15m
- 59#57: Handling Loading and Error States in React: Best Practices for Fetching Pokémon API Data10m
Day 9 · 1h 49m
- 60#58: Data Fetching in React: Using Async Await & Try Catch to Fetch Pokémon API6m
- 61Create Pokemon Website using React JS in Hindi1h 1m
- 62#60: Host Your React Website Live on Free and Paid Servers11m
- 63#61: useRef Hook in React to manage DOM elements and State easily15m
- 64#62: No More forwardRef in React 19: Get Ref Values with New React 19 Methods15m
Day 10 · 2h
- 65#63: useId Hook in React 19: Simplify Your Form Handling with Unique IDs15m
- 66#64: Prop Drilling in React 19 with Animation & Practical Example15m
- 67#64: Context API & useContext Hook in React v19 in Hindi18m
- 68#65: The Mistake 90% of Devs Will Make & Waste Time 😢 But Here's the Solution!9m
- 69#66: Create Custom Hooks in React 19: Step-by-Step Guide with Best Practices12m
- 70#67: New "use" Hook in React 19: Usage, and Advantages over useContext Hook11m
- 71Build a React Website with Tailwind CSS in Hindi24m
- 72#69: useReducer Hook in React 1915m
Day 11 · 1h 49m
- 73#70: Best Practices for Using the useReducer Hook in React 19: Optimize Your State Management17m
- 74React.memo(): Prevent Unnecessary Re-Renders with React Memo || #71:15m
- 75#72: useMemo Hook in React 19: Why, When & How to Use It with Practical Examples16m
- 76#73: React.memo vs useMemo: Stop the Confusion! Learn When & How to Use Them15m
- 77#74: useCallback Hook in React in Hindi15m
- 78#75: Introduction to React Router v6.4: Creating a Basic Routes in Our React App21m
- 79#76: React Router v6.4: Simplify Route Setup with createRoutesFromElements Helper Function9m
Day 12 · 1h 59m
- 80#77: React Router App Layout & Outlet Component: Render Nested Elements in Your React App11m
- 81#77: Building a Dynamic Navigation Bar with React Router12m
- 82#78: Active Links in React Navigation: Enhance User Experience with Clear Page Indicators14m
- 83#80: Handling Error Pages in React Router16m
- 84#81: useNavigate Hook in React Router: Seamless Page Redirection & Back Button Setup9m
- 85#82: Fetch API Data with React Router Loaders🔥 No useEffect Needed18m
- 86#84: Create Global Loading States in React Using React Router & useNavigation8m
- 87#85: Secure Your React App: Using ENV Variables to Protect Private Data10m
- 88#85: Dynamic Routing in React: Get Params Value and Fetch API Data for a Single Movie21m
Day 13 · 1h 59m
- 89#88: Handle Contact Form Data with React Router Form Component & Action16m
- 90Final UI Upgrades: Perfecting Your React Movie Website12m
- 91Host Your React Website on Netlify for Free10m
- 92Complete Axios in React for Beginners in Hindi25m
- 93Build a Full-Stack React App with Axios & Real APIs: Mastering CRUD Operations25m
- 94#91: CRUD in React: HTTP GET Method to Fetch & Display Data with Axios + Styling15m
- 95CRUD Operations in React Full Stack: DELETE Data with Axios17m
Day 14 · 1h
- 96#93: Add Data to Real API & React Full Stack App with Axios POST Method21m
- 97Update Data in React Full Stack App: Autofill Form with Axios and Edit Button14m
- 98CRUD in React: Update API Data & Reflect Changes with Axios PUT25m
Week 3Videos 99–128 · 15h 41m
Day 15 · 2h 6m
- 99React JS CRUD Operation with Rest API using Axios in One Video2h 6m
Day 16 · 1h 19m
- 100React Project🔥Dynamic Accordion in React 1930m
- 101Create a Responsive Navbar in React JS ❤️🔥35m
- 102Dynamic Contact Sections in React 🧑💻 Make 1000+ Lines of Codes in 10 Lines🔥14m
Day 17 · 3h 5m
- 103Build a Responsive Multi-Page React 19 Website | Dynamic Routes, Search Filters, Axios API & Deploy3h 5m
Day 18 · 1h 58m
- 104#1: TanStack Query Tutorial in Hindi: Introduction to React Query & it's Advantages Over React❤️🔥10m
- 105#2: TanStack Query v5 with React 19: Installations, Routing & Components13m
- 106#3: QueryClient & Provider in TanStack Query16m
- 107#4: React Query: The Only API Data Fetching Method You Need in React 1910m
- 108#5: Stop Wasting Time: Handle API Loading & Errors Easily with React Query8m
- 109TanStack Query DevTools: Master Your React Query Debugging11m
- 110#7: Garbage Collection Time in React Query: Control Your Data Caching12m
- 111#8: How to Stop Unwanted API Calls with Stale Time in React Query12m
- 112#9: Real-Time Polling in React Query: Constantly Fetch Fresh Data, Even in the Background8m
- 113#10: One Single Dynamic Detailed Page & Route for all 100+ API Cards in React Query 😀17m
Day 19 · 1h 50m
- 114How to Create Pagination in React Using React Query🔥23m
- 115#12: React Query useMutation Hook: Simplify CRUD & Delete Posts Easily22m
- 116#13: Update Post with React Query useMutation | Sync API and Local Cache16m
- 117Create Instagram-Like Infinite Scrolling with React Query🔥28m
- 118Infinite Scrolling in React Query with React Intersection Observer9m
- 119Host Your React Query Website Live for Free and Paid Server12m
Day 20 · 3h 39m
- 120React Query (TanStack) Full Course Tutorial in One Video3h 39m
Day 21 · 1h 44m
- 121React Redux Tutorial #1: Why, When, and How to Use Redux in React20m
- 122Redux Tutorial #2: Create Reducer Functions to Add & Delete Tasks in React22m
- 123Redux Store: Create, Dispatch & Get State in React16m
- 124Redux with Action Creators: How to Create and Dispatch Actions Easily8m
- 125Connect Redux with your React App | Redux Tutorial #59m
- 126Access Redux State in React: How to Read Data from the Redux Store using useSelector9m
- 127How to Dispatch Actions in React using Redux: Add and Delete Tasks with useDispatch10m
- 128Redux DevTools: Simplify State Management in React10m
Week 4Videos 129–156 · 7h 26m
Day 22 · 1h 55m
- 129Redux Thunk in React: Fetch and Add API Data to Your To-Do App18m
- 130Currency Converter App in React Using Axios – Convert Live Rates 💯30m
- 131Redux Toolkit Tutorial #1: Introduction & Advantages of RTK16m
- 132Redux Toolkit Store Setup #2: configureStore & useSelector in React Explained10m
- 133🔴Build a Live Currency Converter App in React with React Query & Axios41m
Day 23 · 1h 38m
- 134createSlice in Redux Toolkit: Simplifying Action Creators & Reducers12m
- 135Redux Toolkit Tutorial : Add & Delete Tasks with createSlice in React App12m
- 136How to Connect Redux Toolkit with React🔥Building a Simple Todo App UI7m
- 137Access Redux Toolkit Store Data in React | Displaying Tasks with useSelector11m
- 138useDispatch Hook in React to Handle RTK Actions | Add & Delete Tasks Easily13m
- 139Professional Redux Toolkit Folder Structure in React: Organize with Features & Slices9m
- 140React JS Series Finale: From Redux to TanStack Query - Key Takeaways & What's Next!12m
- 141React v19.2 Just Released — Here’s the ONLY New Hook & Why It Changes Everything9m
- 142React Just Changed Conditional Rendering! 🔥 Activity Explained | React 19.214m
Day 24 · 1h 42m
- 143React 19 useActionState Hook Explained 🔥 Old vs New Syntax + Real Project | React 19 in 202626m
- 144React Context Has Changed in React 19! use() vs useContext12m
- 145React Can Show UI Before Your Data Arrives! 🤯 How Suspense & Lazy Actually Works12m
- 146React 19 Changed Data Fetching 😳 No More useEffect? | use() + Suspense17m
- 147React Updates UI BEFORE the API Responds?! 😳 | React 19 useOptimistic22m
- 148The New React Hook You Need to Know: useEffectEvent Explained13m
Day 25 · 1h 57m
- 149React 19 Changed Context API Forever 😳 | .Provider Is No Longer Needed?22m
- 150React 19 Changed Refs Forever 😳 | No More forwardRef?14m
- 151React 19.3 Finally Released 🚀 | What Changed? ViewTransition + Installation + Demo23m
- 152This Is Unreal 😳 Host Your React Website With Just 1 AI Prompt!7m
- 153React Fragment Just Changed in React 19.3 🔥 | Fragment Refs Explained18m
- 154React 19.3 Changes SSR Forever? New browser() API Explained13m
- 155I Added React.memo. It Still Re-rendered.21m
Day 26 · 14m
- 156React Compiler is HERE 🔥 Delete useMemo, useCallback & memo?14m
Tips for finishing
- Split the React Query full course (video 120) over several days.
- Use the planner's From and To fields to schedule one block of the course at a time.