Modern React From The Beginning (Udemy.com)
Learn React from the ground up along with modern environments such as React Router v7, TanStack, MERN, etc
Created by: Brad Traversy
Last updated August 2025
What you will learn
- Learn The Fundamentals Of React (Components, state, hooks, context API & more)
- Build Projects (Portfolio website, notes app, shopping cart UI, idea sharing app & more)
- React Router v7 - Declarative & Framework Mode With SSR
- TanStack Router & TanStack Query For Working With APIs
- Portfolio Website WIth Strapi Headless CMS Integration
- Full Stack MERN App With Refresh Tokens For Authentication
- Learn hooks like useState, useEffect, useRef, useContext
- Suitable For Beginners & Intermediates
Course Description
Unlock the full potential of React in 2025 with this comprehensive, beginner-friendly course that goes beyond the basics. Whether you're brand new to React or want to deepen your understanding of its modern features, this course will give you the practical skills you need to build real-world applications using today’s best practices.
You'll start by learning React fundamentals in a highly structured, easy-to-digest format. We will be building projects as you learn.
Here are some of the concepts you will learn:
The fundamentals: JSX, components, props, state, and events
The entire lifecycle of a React component
All the core React hooks – useState, useEffect, useRef, useContext and more
Best practices for functional components in modern React
Conditional rendering patterns (ternary vs &&)
Organizing files, reusable components, and clean architecture
Advanced routing with React Router v7 including declarative and framework mode with SSR
Data fetching and caching with TanStack Query
Real-world debugging using React DevTools, network tab, and logging
Secure authentication with access & refresh tokens using HTTP-only cookies
Full stack MERN development
Deployment using Vercel (frontend) and Render (backend)
Premium Docs:
You will have access to the premium docs, which is basically the entire course in text/Markdown format.
Projects:
This course has a bunch of small to medium-sized projects to build for your portfolio:
- Rating/Feedback UI - Simple star rating UI to learn the basics with. Events, props, state, etc
- Notes App - Create and delete notes from local storage. Learn about forms and state.
- Lifecycle Playground - Sandbox to learn about component lifecycle and the useEffect hook
- Simple Timer - Learn about the useRef hook and persisting data across page reloads.
- GitHub Finder - Use TanStack Query to get and send data to and from the Github API
- Crypto Dash - Use the CoinGecko API to create a dashboard for getting prices and other info from Crypto coins.
- IdeaDrop - Full stack MERN app with TanStack Router on the frontend.
- The Friendly Dev - Portfolio website and blog built with React Router v7 and Strapi headless CMS.
Instructor Details
- 4.7 Rating
1,271 Reviews
Brad Traversy
Brad Traversy has been programming for around 12 years and teaching for almost 5 years. He is the owner of Traversy Media which is a successful web development YouTube channel and specializes in everything from HTML5 to front end frameworks like Angular as well as server side technologies like Node.js, PHP and Python. Brad has mastered explaining very complex topics in a simple manner that is very understandable. Invest in your knowledge by watching Brad's courses.
More courses by Brad Traversy
Modern JavaScript From The Beginning 2.0 (Just Updated) (2025)
4.6 (36,520 Reviews)
Provider: Udemy
Time: 40.2h
$16.99
Modern HTML & CSS From The Beginning 2.0 (2025)
4.8 (28,669 Reviews)
Provider: Udemy
Time: 24.3h
$129.99
Bootstrap 4 From Scratch With 5 Projects (2018)
4.6 (17,122 Reviews)
Provider: Udemy
Time: 11.3h
$84.99
MERN Stack Front To Back: Full Stack React, Redux & Node.js (2019)
4.4 (15,750 Reviews)
Provider: Udemy
Time: 11.9h
$99.99
50 Projects In 50 Days - HTML, CSS & JavaScript (2025)
4.6 (12,876 Reviews)
Provider: Udemy
Time: 19.4h
$119.99
More Web Development courses
Python Fullstack Mastery: Build Modern Web Apps with Django (2025)
5.0 (165 Reviews)
Provider: Udemy
Time: 35h
$19.99
NgRx Signal store for Angular - The missing guide (2026)
4.9 (436 Reviews)
Provider: Udemy
Time: 11.3h
$89.99
Vue 3: Create a Mobile & Desktop App (with Quasar 2 & Pinia) (2024)
4.9 (177 Reviews)
Provider: Udemy
Time: 7.6h
$79.99
Build a URL Shortener App with ASP.NET: Step by Step (2026)
4.9 (100 Reviews)
Provider: Udemy
Time: 9.6h
$10.99
The Complete Elixir and Phoenix Bootcamp (2021)
4.8 (7,773 Reviews)
Provider: Udemy
Time: 17.4h
$84.99
Reviews
By Nicole Maria do Nascimento Pereira on 6/16/2026
This course truly exceeded my expectations. Brad is an outstanding instructor who reignited my passion for development. His teaching approach (walking you through every step and the more tedious parts before revealing a tool that simplifies exactly what you just did) is so clever and engaging that I'm leaving this course ready to enroll in more of his content. Highly recommend. Learning React through this course was an absolute pleasure.
By Jing Huang on 5/24/2026
I really enjoy the course and all the projects in the course. I liked the last project Idea Drop the most because it includes all the crucial parts of the web application. Brad is an excellent instructor. His explanations are clear and easy to follow. He breaks down the concepts step by step with practical examples. I recommend the course.
By Kenneth Lewis on 5/23/2026
Overall, excellent. I really appreciate Brad's teaching style and pace. You end the course with many practical examples using the various react hooks, state management strategies, popular routers, vanilla JS & TypeScript, 3rd party services for hosting frontend/backend/image/db hosting, content management systems, tons of popular libraries, etc... He even goes into the full MERN stack covering backend APIs with modern, secure fullstack auth. I had a few issues following along with the course content, but most were already addressed in the Q&A. The one outstanding issue I had was quickly addressed after posting a question. Can't recommend the course enough. Brad's courses are always excellent.
By Matt McGovern on 5/1/2026
It was excellent, although the last third of the course I found it very difficult when things didn't work on my machine like it did on the instructor's. I had a lot of troubleshooting to do - which actually makes me better so that's a plus. Two points of help for you to consider: 1. You may find it helpful to know that I needed to do a nslookup on the server name given to me by the error message when trying to connect to mongodb. The one they give you is a mongodb+srv which fails in vscode. Compass works fine but that's their product. I had to use the server names and ports given in the nslookup. 2. Also, my windows box didn't have openssl so I just copied your JWT token. I wished you would add a npm install something so we can do it from our boxes. Thank you!
By Ivan Huddleston on 4/7/2026
I bought this course just to dig a little deeper into passing props and data. I have a project I'm working on that for the last two weeks has had me stuck while passing id's from fetched data coming from multiple sources. The way Brad showed many different scenarios it's absolutely helped wrap my head around it. I appreciate the way this course has been structured, as in breaking concepts down instead of just building a big project while glossing over the details.
By Kateryna Bludova on 3/11/2026
The course only seems to be quick to complete at first glance. If you are a beginner, you will really spend a long time and carefully going through this course. The explanations are quite clear and there is really a lot of new and interesting information here if you were only familiar with the basics of React
By Poonam Shah on 1/5/2026
I recently completed the React Beginner course, and it was an excellent learning experience. The lessons clearly explained fundamental concepts such as JSX, components, props, state management, and basic hooks. The hands-on examples helped me understand how to build simple, reusable UI components. This course has given me a strong foundation to move on to more advanced React topics.
By Adam Rempter on 12/19/2025
Very good course in general. I found it a bit difficult and boring to watch class styling with tailwind without a proper explanation of what those classes do. It would be nice to have a document with a short explanation for the most frequently used ones. Just one page cheat sheet for this... I was also hoping to jump directly to the auth section, but here it looks like I have to watch over 90 minutes of the previous section.
By Sekti Wicaksono on 11/28/2025
The idea-drop part was great but missing some config during deployment, so I got an error for hard refresh. And the fullpath of error on the console should be mitigated when the user is authenticated. It would be bad showing the fullpath like that publicly for authenticated user. If Brad telling me how to hide the error this course would be 5 stars already
By Hamza on 10/26/2025
Au top comme toujours avec Brad Je fais du React depuis des années mais j'ai repris à 0 avec cette formation et cela m'a clairement permis de comprendre des choses qui étaient floues et d'apprendre de nouvelles notions. Merci pour tout et à bientôt pour la prochaine formation
Quality Score
No CourseDuck member has rated this course yet. Taken it? Give each part a thumbs up or down.
Overall Score : 94 / 100












