React - The Complete Guide 2024 (incl. React Router & Redux) from Udemy

This bestselling course has turned more than 800,000 students into ReactJS developers (more than any other React course on Udemy).

Updated January 2024:

Added brand-new content (~3h) on the NextJS App Router

Added a brand-new "Best Practices & Patterns" section

BIG

Improved explanations & demo projects. Course now covers even more key concepts & best practices.

Updated August 2023:

Added brand-new section on React Query (Tanstack Query)

Added brand-new section on animating React apps with Framer Motion

Updated June 2023:

Add two new practice projects

Added more coding exercises

Added brand-new JS Refresher section

Tons of minor improvements & fixes

This course is completely up-to-date with the very latest version of React with all the core, modern features you need to know & teaches you React in a practical, hands-on way.

Updated February 2023:

Completely re-recorded majority of second half of course (incl. routing, authentication)

A Course For Busy Customers & Business Professionals.

This course also comes with two paths which you can take: The "complete" path (full >40h course) and the "summary" (fast-track) path (~4h summary module) - you can choose the path that best fits your time requirements.

React.js is THE most popular JavaScript library you can use and learn these days to build modern, reactive user interfaces for the web.

This course teaches you React in-depth, from the ground up, step by step by diving into all the core basics, exploring tons of examples and also introducing you to advanced concepts as well.

You'll get all the theory, tons of examples and demos, assignments and exercises and tons of important knowledge that is skipped by most other resources - after all, there is a reason why this course is that huge. :)

And in case you don't even know why you would want to learn React and you're just here because of some ad or "the algorithm" - no worries: ReactJS is a key technology as a web developer and in this course I will also explain WHY it's that important.

Welcome to "React - The Complete Guide".

This course will teach you React.js in a practice-oriented way, using all the latest patterns and best practices you need. You will learn all the key fundamentals as well as advanced concepts and related topics to turn you into a React.js developer.

This is a huge course because it really coversjs developer.

No matter if you know nothing about React or if you already got some basic React knowledge (not required but also not a problem), you will get tons of useful information and knowledge out of this course.

My goal with this course is to ensure that you feel confident working with React, so that you can apply for React jobs, use it in your own projects or simply enhance your portfolio as a developer - whatever your goal is: This course gets you there.

I kept this course updated since its initial launch to ensure that you always learn React in the best possible and up-do-date way.

What's in this course?

A thorough introduction to React.js (What is it and why would you use it?)
All the core basics: How React works, building components with React & building UIs with React
Components, props & dynamic data binding
Working with user events and state to create interactive applications
A (thorough) look behind the scenes to understand how React works under the hood
Detailed explanations on how to work with lists and conditional content
React Hooks (in-depth).
Working with built-in Hooks and building custom Hooks
How to debug React apps
Styling React apps with "Styled Components" and "CSS Modules"
Working with "Fragments" & "Portals"
Dealing with side effects
Class-based components and functional components
Sending Http requests & handling transitional states + responses
Handling forms and user input (incl. validation)
Redux & Redux Toolkit
Routing with React Router
An in-depth introduction into Next.js
Deploying React Apps
Implementing Authentication
Unit Tests
Combining React with TypeScript
Adding Animations
Tons of examples and demo projects so that you can apply all the things you learned in real projects
And so much more - check out the full curriculum on this page.

This really is the "Complete Guide" - promised.

And best of all?

You don't need any prior React knowledge.

This course starts with zero knowledge assumed. All you need is basic web development and JavaScript knowledge (though the course even includes a brief JavaScript refresher to ensure that we're all on the same page. ).

Check out the full curriculum, the free preview videos and join the course risk-free thanks to the 30-day money-back guarantee.

What's inside

Learning objectives

Learn react from the ground up and finish the course as an advanced react developer
Build multiple high-quality demo apps, including a fullstack app built with nextjs
Join more than 800,000 students in this course & more than 2,500,000 students i taught across all my courses
Build fullstack react apps with nextjs 14+
Follow along locally or in a cloud development environment
Learn all about react hooks and react components
Manage complex state efficiently with react's context api & react redux

Build standalone react apps & applications connected to a backend via http
Learn about routing & route-related data fetching with react router
Implement user authentication in react apps
Get started with react unit testing
Show more
Show less

Learn react from the ground up and finish the course as an advanced react developer
Build multiple high-quality demo apps, including a fullstack app built with nextjs
Join more than 800,000 students in this course & more than 2,500,000 students i taught across all my courses
Build fullstack react apps with nextjs 14+
Follow along locally or in a cloud development environment
Learn all about react hooks and react components
Manage complex state efficiently with react's context api & react redux
Build standalone react apps & applications connected to a backend via http
Learn about routing & route-related data fetching with react router
Implement user authentication in react apps
Get started with react unit testing
Show more
Show less

Syllabus

Get started with React.js, learn what React actually is, why you would use React over vanilla JavaScript and how React code actually looks like!

Welcome To The Course!

What is React.js? And Why Would You Use It?

ReactJS vs "Vanilla JavaScript": Why Use React?

Editing Our First React App

About This Course & Course Outline

The Two Ways (Paths) Of Taking This Course

Getting The Most Out Of This Course

Learning alone is absolutely fine but finding learning partners might be a nice thing, too. Our learning community is a great place to learn and grow together - of course it's 100% free and optional!

Creating React Projects

Why Do You Need A Special Project Setup?

You need to know JavaScript to learn React.js. To ensure that we're all on the same page, this course section will walk you through all key modern JS features you need to know!

Let me introduce you to this module and to what you're going to learn in it.

Starting Project

Adding JavaScript To A Page & How React Projects Differ

React Projects Use a Build Process

"import" & "export"

Revisiting Variables & Values

Revisiting Operators

Revisiting Functions & Parameters

Exercise: Working with Functions

Arrow Functions

Highly recommended react course

Learners say this highly recommended React course covers everything there is to learn about React. According to one review, the course is worth the time value for money.

Course found to be worth investment

"Worth the time value for money."

Course sufficiently covers all things React

"Max covered everything there is to learn about react."

Activities

Be better prepared before your course. Deepen your understanding during and after it. Supplement your coursework and achieve mastery of the topics covered in React - The Complete Guide 2024 (incl. React Router & Redux) with these activities:

Review JavaScript Fundamentals

Show steps

Reviewing JavaScript fundamentals will help you build a stronger foundation for learning React.

Browse courses on JavaScript Fundamentals

Show steps

Go over the course syllabus and identify topics you need to review.
Find online resources or tutorials to refresh your knowledge.
Practice writing JavaScript code to reinforce your understanding.

Read 'Eloquent JavaScript'

Show steps

Reading Eloquent JavaScript will provide you with a comprehensive introduction to JavaScript, which is essential for understanding React.

View Eloquent JavaScript, 4th Edition on Amazon

Show steps

Find a copy of the book online or in a library.
Read through the book at your own pace.
Work through the exercises and examples in the book to reinforce your understanding.

Collect React Resources

Show steps

Collecting React resources will provide you with a valuable set of materials to support your learning.

Show steps

Find online resources, tutorials, and articles on React.
Organize the resources in a folder or bookmark them for easy access.
Review the resources regularly to refresh your knowledge and discover new content.

Five other activities

Expand to see all activities and additional details

Show all eight activities

Follow Along with Maximilian Schwarzmüller's React Tutorial Series

Show steps

Following along with Maximilian Schwarzmüller's React tutorial series will introduce you to the basics of React and help you build a foundation for this course.

Show steps

Watch the first few videos in the series to get an overview of React.
Follow along with the code examples to build your own React apps.
Use the discussion forums to ask questions and get help from other learners.

Create a React Cheat Sheet

Show steps

Creating a React cheat sheet will help you summarize and reinforce the key concepts you learn in this course.

Show steps

Identify the most important React concepts you want to include.
Create a visual representation of the concepts using diagrams, tables, or code snippets.
Review and update your cheat sheet regularly as you progress through the course.

Join a React Study Group

Show steps

Joining a React study group will provide you with a supportive environment to learn and collaborate with other students.

Show steps

Find a study group online or in person.
Meet regularly to discuss course material and work on projects together.
Use the group as a resource to ask questions and get help.

Build a React App from Scratch

Show steps

Building a React app from scratch will help solidify your understanding of the core React concepts.

Show steps

Create a new React project using create-react-app.
Build a simple UI using React components.
Add state to your app to handle user interactions.
Use props to pass data between components.
Use React Hooks to manage state and side effects.

Solve React Coding Challenges

Show steps

Solving React coding challenges will help you improve your problem-solving skills and reinforce your understanding of React concepts.

Show steps

Find React coding challenges online or in books.
Try to solve the challenges on your own.
Compare your solutions to others to learn different approaches.

Career center

Learners who complete React - The Complete Guide 2024 (incl. React Router & Redux) will develop knowledge and skills that may be useful to these careers:

React Developer

As a React Developer, you will be responsible for developing and maintaining React-based web applications. This course can help you develop the skills necessary to succeed in this role by providing a comprehensive overview of React, including how to use it with Redux and React Router for state management and routing. Additionally, you will learn about deploying React applications, which is an essential skill for any React Developer.

See salaries and explore the career path for React Developer

Full-Stack Developer

As a Full-Stack Developer, you will be responsible for both the front-end and back-end of web applications. This course can help you develop the skills necessary to succeed in this role by providing a comprehensive overview of React, including how to use it with Redux and React Router for state management and routing. Additionally, you will learn about deploying React applications, which is an essential skill for any Full-Stack Developer.

See salaries and explore the career path for Full-Stack Developer

Web Developer

As a Web Developer, you will be responsible for the design, development, and maintenance of websites. This course can help you gain the skills necessary to succeed in this role by teaching you the fundamentals of React, including how to create components, handle events, and manage state. Additionally, you will learn about advanced concepts such as routing and Redux, which are essential for building complex web applications.

See salaries and explore the career path for Web Developer

Front-End Developer

As a Front-End Developer, you will be responsible for the design and implementation of the user interface, ensuring that it is both visually appealing and functional. This course can help build a foundation for success in this role by teaching you the fundamentals of React, including how to create components, handle events, and manage state. Additionally, you will learn about advanced concepts such as routing and Redux, which are essential for building complex web applications.

See salaries and explore the career path for Front-End Developer

JavaScript Developer

As a JavaScript Developer, you will be responsible for developing and maintaining JavaScript-based web applications. This course can help build a foundation for success in this role by teaching you the fundamentals of React, including how to create components, handle events, and manage state. Additionally, you will learn about advanced concepts such as routing and Redux, which are essential for building complex web applications.

See salaries and explore the career path for JavaScript Developer

Technical Writer

As a Technical Writer, you will be responsible for writing and maintaining technical documentation. This course can help build a foundation for success in this role by teaching you the fundamentals of React, including how to create components, handle events, and manage state. Additionally, you will learn about advanced concepts such as routing and Redux, which are essential for building complex web applications.

See salaries and explore the career path for Technical Writer

User Interface (UI) Designer

As a User Interface (UI) Designer, you will be responsible for designing the user interface of web applications. This course can help build a foundation for success in this role by teaching you the fundamentals of React, including how to create components, handle events, and manage state. Additionally, you will learn about advanced concepts such as routing and Redux, which are essential for building complex web applications.

See salaries and explore the career path for User Interface (UI) Designer

Project Manager

As a Project Manager, you will be responsible for planning, executing, and closing projects. This course may be useful in helping you develop the skills necessary to succeed in this role by providing a comprehensive overview of React, including how to use it with Redux and React Router for state management and routing. Additionally, you will learn about deploying React applications, which is an essential skill for any Project Manager.

See salaries and explore the career path for Project Manager

UX Designer

As a UX Designer, you will be responsible for designing the user experience of web applications. This course may be useful in helping you develop the skills necessary to succeed in this role by providing a comprehensive overview of React, including how to use it with Redux and React Router for state management and routing. Additionally, you will learn about deploying React applications, which is an essential skill for any UX Designer.

See salaries and explore the career path for UX Designer

Data Analyst

As a Data Analyst, you will be responsible for collecting, analyzing, and interpreting data to extract meaningful insights. This course may be useful in helping you develop the skills necessary to succeed in this role by providing a comprehensive overview of React, including how to use it with Redux and React Router for state management and routing. Additionally, you will learn about deploying React applications, which is an essential skill for any Data Analyst.

See salaries and explore the career path for Data Analyst

Software Engineer

As a Software Engineer, you will be responsible for designing, developing, and testing software applications. This course may be useful in helping you develop the skills necessary to succeed in this role by providing a comprehensive overview of React, including how to use it with Redux and React Router for state management and routing. Additionally, you will learn about deploying React applications, which is an essential skill for any Software Engineer.

See salaries and explore the career path for Software Engineer

Information Technology (IT) Consultant

As an Information Technology (IT) Consultant, you will be responsible for providing consulting services to businesses on how to use technology to improve their operations. This course may be useful in helping you develop the skills necessary to succeed in this role by providing a comprehensive overview of React, including how to use it with Redux and React Router for state management and routing. Additionally, you will learn about deploying React applications, which is an essential skill for any IT Consultant.

See salaries and explore the career path for Information Technology (IT) Consultant

Quality Assurance (QA) Analyst

As a Quality Assurance (QA) Analyst, you will be responsible for testing and ensuring the quality of software applications. This course may be useful in helping you develop the skills necessary to succeed in this role by providing a comprehensive overview of React, including how to use it with Redux and React Router for state management and routing. Additionally, you will learn about deploying React applications, which is an essential skill for any QA Analyst.

See salaries and explore the career path for Quality Assurance (QA) Analyst

Business Analyst

As a Business Analyst, you will be responsible for analyzing business processes and identifying opportunities for improvement. This course may be useful in helping you develop the skills necessary to succeed in this role by providing a comprehensive overview of React, including how to use it with Redux and React Router for state management and routing. Additionally, you will learn about deploying React applications, which is an essential skill for any Business Analyst.

See salaries and explore the career path for Business Analyst

Product Manager

As a Product Manager, you will be responsible for the overall planning and execution of a product. This course may be useful in helping you develop the skills necessary to succeed in this role by providing a comprehensive overview of React, including how to use it with Redux and React Router for state management and routing. Additionally, you will learn about deploying React applications, which is an essential skill for any Product Manager.

See salaries and explore the career path for Product Manager