Skip to content
UdemyWeb DevelopmentPaid courseBeginner levelCertificate

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

icon
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

icon
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.


icon
Udemy Discount

The discount is applied through our link. Open the course from here and Udemy's current promotional price is applied at checkout on most courses, no code to type.

Some courses are excluded from Udemy's promotions. If the price does not drop, clear your browser cookies and use the button again.

icon
Instructor Details

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.

icon
More courses by Brad Traversy

$16.99

$129.99

$84.99

$99.99

$119.99

$11.99

icon
More Web Development courses

$19.99

$89.99

$89.99

$79.99

$10.99

$84.99

icon
Reviews

4.7

1,271 ratings on Udemy

Select a bar to show only those reviews.Select the bar again to show every rating.

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

Showing all 10 reviews on CourseDuck

Read all 1,271 reviews on Udemy

icon
Quality Score

No CourseDuck member has rated this course yet. Taken it? Give each part a thumbs up or down.

Content Quality
/
Video Quality
/
Qualified Instructor
/
Course Pace
/
Course Depth & Coverage
/

Overall Score : 94 / 100