NEW! Curricular Projects β’ Test Your Skills and Get Expert Feedback
We independently test and review every course that we recommend.
Please support us by joining our mailing list, and recommending this guide to others.
Updated: December 27, 2023
Scrimba
By Bob Ziroll
The best overall combination of topic coverage, learning experience, instructor quality, and delivery of outcomes. And you can take it for FREE, though we recommend subscribing to get the full benefits.
If you like learning by building projects and want lots of hands-on practice, youβll love this course. Scrimbaβs methodical approach to teaching concepts means youβre practicing something right after learning it, and then putting everything together into a project. Over the span of the course's four parts, you build 8 projects - 4 of them entirely on your own.
Fullstack Open
By Various Authors
An impressive free, text-based course developed in partnership with tech companies, that offers feedback on coding exercises. Part of a larger full-stack curriculum, so a great option for novice coders.
The curriculum is text-based with hands-on exercises. The explanations are thorough and well-designed to progress from topic to topic. As a result, the course feels like an extension of the official React documentation with some added hands-on application.
To get really good at React, we recommend completing through Part 7 of the course. Part 1 introduces React, Part 2 covers how to integrate a React app with the server, Part 5 includes in depth coverage of React testing, Part 6 covers advanced state management, and Part 7 covers custom hooks and styling. If you complete all these parts, you will be well versed in the React skills needed to start working professional.
In addition to well-written material, the authors curate some valuable free resources. Be sure to check these out, as they're essential to rounding out your knowledge of React.
You can also submit exercises for grading and feedback, which is incredibly valuable for learning.
One of our favorite aspects of the course is the authors also include some spaced repetition to reiterate key concepts, and hammer home best practices like logging everything to the console as youβre building. You'll come away from this course a better all-around developer, not just knowledgeable with React.
Our initial research involved spending hours reading hundreds of reviews of various course options, and perusing forums for recommendations and user preferences. From this research, we narrowed down to a list of 12 highly-rated candidate courses.
We graded the candidate courses against the following criteria:
From this thorough research and testing, we're confident this is the single best guide to React courses available.
UI.dev
By Tyler McGinnis, Lynn Fisher, Ben Adam, Alex Brown
Highly polished deep dive into React essentials, with lots of hands-on practice and a special emphasis on hooks.
React.gg is one of the most ambitious React courses on the market, teaching the essentials of React through a series of in-depth tutorials, knowledge check quizzes, and hands-on challenges. And thereβs more content coming, including technical interview preparation.
The production value is top-notch. From the polished videos and well-written articles to the in-browser coding exercises, everything works crisply and looks super professional. You can be confident that you're learning from folks who can actually build the kinds of polished professional-grade apps that you're hoping to build.
Learners can choose to go learn each concept using written tutorials or videos, so itβs suitable to multiple learning styles. The tutorials take it one step at a time, which is helpful for ensuring you understand each concept at a deep fundamental level.
The standout section of the course is the series of useHooks exercises. In this section, you build over 30 hooks from scratch.
Frontend Masters
By Brian Holt
This 6 hour workshop teaches 85% of the real-world React footprint. A great option for seasoned JavaScript developers.
Taught by one of the world's leading React experts, this workshop is one of the best starting points for learning React the way itβs actually used in top organizations like Reddit, Netflix, and Stripe.
Beyond a tutorial on components, state, and hooks, this teaches you how real world developers utlilize React - and what features you shouldn't bother with. In this course, you'll join Brian to code through the development of a pet adoption site. While not the deepest dive into React's core concepts, itβs enough to get you started with some meaty React projects or to learn advanced topics.
Frontend Masters has a complete React Path with an additional 15 hours of core React content and electives. If you're serious about working with React professionally, we recommend subscribing and taking the full path - at least the core content.
Pluralsight
By Various
A solid choice for screencast training by expert authors, but you should supplement with independent practice and projects.
This series of video courses covers everything from the basics to advanced React features. The courses are concise and scoped well to cover the core topics without too much overlap.
Pluralsight's authors are the main draw here, as experts Cory House and others guide you through real-world React usage.
Pluralsight's React path includes an adaptive assessment that will measure your proficiency with the library. The assessment can give you a good idea for how your React knowledge stacks up against other Pluralsight users and areas to target for additional study.
React is a popular JavaScript library used for building dynamic and interactive user interfaces. It is commonly used for single-page applications (SPAs) and works fairly seamlessly with other libraries and frameworks.
React follows a component-based architecture, where each component manages its state and renders the UI based on changes to that state. It efficiently updates the DOM using a virtual DOM, minimizing direct manipulation of the actual DOM and optimizing performance.
Components: Understand the concept of components in React, which are building blocks for user interfaces. Learn how to create functional components and class components and understand their differences.
JSX: Get familiar with JSX, a syntax extension for JavaScript used in React to describe the user interface. Learn how to write JSX code to create and render React elements.
State and Props: Understand how to manage state within React components to enable dynamic and interactive user interfaces. Learn about props, which allow you to pass data from parent components to child components.
Virtual DOM: Grasp the concept of the virtual DOM, an in-memory representation of the actual DOM used by React for efficient rendering and updating of components.
Lifecycle Methods: Learn about React's lifecycle methods (for class components) and their order of execution. Understand how to utilize lifecycle methods for component initialization, updating, and cleanup.
React Hooks: Explore React Hooks, which allow you to use state and other React features in functional components. Learn about useState, useEffect, useContext, and other hooks for managing state and performing side effects.
Forms and Events: Learn how to handle form submissions and user interactions using React's event system. Understand how to use controlled components to manage form state.
React Router: Familiarize yourself with React Router, a library for handling navigation and routing in React applications. Learn how to set up routing, create route configurations, and handle dynamic routes.
State Management: Explore state management solutions like Redux or the React Context API for managing global state and sharing data across components.
Build Tools and Package Managers: Get to know build tools like Webpack and bundlers like Parcel, which are commonly used with React projects. Learn how to use npm or Yarn as package managers to manage dependencies.
By focusing on these key concepts, you will build a strong foundation in React development and be well-equipped to create interactive and dynamic user interfaces for web applications.
React is a JavaScript library, and a large part of working with React is writing JavaScript.
As a result, if you're not already well-versed in JavaScript and with the features of ES6, you should brush up on those before jumping into React. Most React courses will assume you already know JavaScript; stay away from the ones that don't assume any JavaScript knowledge, or that also teach you the core JavaScript concepts, as they're either teaching to the wrong target audience or trying to cover too much.
Help us out by joining our email list to get notified when we release new guides, and recommending this guide to others.
Thanks for reading!