The Road to React: The One with Hooks

Gain insights into React fundamentals and Hooks. Delve into styling, app maintenance, and performance optimization. Discover hands-on experience by building a Hacker News app for your portfolio.

Beginner

63 Lessons

25h

Certificate of Completion

Gain insights into React fundamentals and Hooks. Delve into styling, app maintenance, and performance optimization. Discover hands-on experience by building a Hacker News app for your portfolio.

AI-POWERED

Explanations

AI-POWERED

Explanations

This course includes

74 Playgrounds

13 Quizzes

This course includes

74 Playgrounds

13 Quizzes

Course Overview

This is a relaunch of my existing course, The Road to Learn React. A lot has changed in React since I first created this course, and so here I am to give you all the information you need to work with modern React. (If you’re looking for content on legacy React, the old course is still available as well.) In this course you will take a deep dive into React fundamentals, covering all new React concepts including Hooks. I do address some legacy features in case you’re working with an older codebase, but the m...Show More

Course Content

Introduction

Get familiar with React fundamentals, practical applications, and building functional React apps.

Who Is This Course For?

Simple React App

Fundamentals of React

Walk through React fundamentals, JSX, state management, hooks, data fetching, and async handling.

React Legacy

Examine the evolution and current state of React class components and imperative ref handling.

React Class Components React Class Components: State Imperative React

Styling in React

Grasp the fundamentals of CSS methods, CSS Modules, and SVGs in React applications for styling.

CSS in React CSS Modules in React SVGs in React

React Maintenance

Map out the steps for maintaining React applications with performance optimization, TypeScript, testing, and project structure.

Performance - Avoiding First Render Computation Performance - Avoiding Heavy Computation Typescript in React Unit Testing to Integration Testing React Project Structure

React World (Advanced)

10 Lessons

Follow the process of advanced sorting, reverse order, memory of searches, avoiding duplicates, and paginated fetch in React.

Deploying a React Application

2 Lessons

Master the steps to deploy a React application using create-react-app and Firebase Hosting.

Get Live Weather Information Using React

Project

Final Words

1 Lesson

Step through advanced React concepts, from state management to React Native.

Appendix

3 Lessons

Get started with the author's background, vital FAQs, and setting up a local React project.

Course Author

Part of the React Learning Path

Learn React for Front-End Developers

Take your front-end skills to the next level. Build and deploy stunning, professional-quality apps using React.

4 Modules

Trusted by 1.4 million developers working at companies

Anthony Walker

@_webarchitect_

Emma Bostian 🐞

@EmmaBostian

Evan Dunbar

ML Engineer

Carlos Matias La Borde

Software Developer

Souvik Kundu

Front-end Developer

Vinay Krishnaiah

Software Developer

Eric Downs

Musician/Entrepeneur

Kenan Eyvazov

DevOps Engineer

Anthony Walker

@_webarchitect_

Emma Bostian 🐞

@EmmaBostian

Hands-on Learning Powered by AI

See how Educative uses AI to make your learning more immersive than ever before.

Instant Code Feedback

Evaluate and debug your code with the click of a button. Get real-time feedback on test cases, including time and space complexity of your solutions.

AI-Powered Mock Interviews

Put your skills to the test in a simulated interview setting. Receive personalized feedback based on your performance. Available in Premium & Premium Plus plans.

Adaptive Learning

At various checkpoints throughout Educative courses, you will be prompted to take a quick assessment. Receive a condensed curriculum tailored to your strengths and skill gaps.

Explain with AI

Select any text within any Educative course, and get an instant explanation — without ever leaving your browser.

AI Code Mentor

AI Code Mentor helps you quickly identify errors in your code, learn from your mistakes, and nudge you in the right direction — just like a 1:1 tutor!