All Levels
16 hours
Java Tutorial for Complete Beginners
Learn to program using the Java programming language
John Purcell
What you'll learn:
- ✓Learn to program in Java
16 hours
73 lectures
Access on mobile and TV
Certificate
DevelopmentJava
All LevelsDevelopmentReact JS
React - The Complete Guide 2025 (incl. Next.js, Redux)
Dive in and learn React.js from scratch! Learn React, Hooks, Redux, React Router, Next.js, Best Practices and way more!
Created by Academind by Maximilian Schwarzmüller, Maximilian Schwarzmüller
71 hours
Video Content
726
Lectures
969,647
Students
4.6
Rating
4.6
(969,647 students enrolled)What you'll learn
✓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 900,000 students in this course & more than 3,000,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
Course Content
40 sections • 726 lectures • 71:22:05 total length
Getting Started
11 lectures • 41:54
Getting Started
11 lectures • 41:54
Welcome To The Course!01:07
What is React.js? And Why Would You Use It?02:58
ReactJS vs "Vanilla JavaScript": Why Use React?10:57
Editing Our First React App04:22
About This Course & Course Outline02:55
+6 more lectures
JavaScript Refresher
23 lectures • 01:42:29
JavaScript Refresher
23 lectures • 01:42:29
Module Introduction01:49
Starting Project01:00
Adding JavaScript To A Page & How React Projects Differ06:57
React Projects Use a Build Process08:04
"import" & "export"12:04
+20 more lectures
React Essentials - Components, JSX, Props, State & More
25 lectures • 02:26:58
React Essentials - Components, JSX, Props, State & More
25 lectures • 02:26:58
Module Introduction01:48
It's All About Components! [Core Concept]06:07
Setting Up The Starting Project03:06
JSX & React Components [Core Concept]04:42
Creating & Using a First Custom Component05:52
+35 more lectures
React Essentials - Deep Dive
37 lectures • 03:16:24
React Essentials - Deep Dive
37 lectures • 03:16:24
Module Introduction01:26
You Don't Have To Use JSX!04:37
Working with Fragments05:40
Using Fragments1 question
When Should You Split Components?03:14
+36 more lectures
React Essentials - Practice Project
8 lectures • 53:37
React Essentials - Practice Project
8 lectures • 53:37
Module Introduction & A Challenge For You!05:09
Adding a Header Component04:48
Getting Started with a User Input Component05:07
Handling Events & Using Two-Way-Binding10:28
Lifting State Up08:59
+3 more lectures
Styling React Components
20 lectures • 01:55:11
Styling React Components
20 lectures • 01:55:11
Module Introduction & Starting Project03:57
Splitting CSS Code Across Multiple Files03:22
Styling React Apps with Vanilla CSS - Pros & Cons02:32
Vanilla CSS Styles Are NOT Scoped To Components!03:31
Styling React Apps with Inline Styles06:24
+18 more lectures
Debugging React Apps
6 lectures • 28:52
Debugging React Apps
6 lectures • 28:52
Module Introduction01:26
The Starting Project01:16
Understanding React Error Messages08:31
Using the Browser Debugger & Breakpoints07:23
Understanding React's "Strict Mode"06:19
+2 more lectures
Working with Refs & Portals
17 lectures • 01:25:51
Working with Refs & Portals
17 lectures • 01:25:51
Module Introduction & Starting Project03:19
Repetition: Managing User Input with State (Two-Way-Binding)05:17
Repetition: Fragments01:12
Introducing Refs: Connecting & Accessing HTML Elements via Refs06:04
Manipulating the DOM via Refs02:14
+17 more lectures
Practice Project: Project Management App (with Components, State, Refs & More)
16 lectures • 02:03:32
Practice Project: Project Management App (with Components, State, Refs & More)
16 lectures • 02:03:32
Module Introduction & Starting Project03:11
Adding a "Projects Sidebar" Component02:29
Styling the Sidebar & Button with Tailwind CSS05:00
Adding the "New Project" Component & A Reusable "Input" Component05:58
Styling Buttons & Inputs with Tailwind CSS07:03
+11 more lectures
React's Context API & useReducer - Advanced State Management
13 lectures • 01:19:17
React's Context API & useReducer - Advanced State Management
13 lectures • 01:19:17
Module Introduction01:54
Understanding Prop Drilling & Project Overview05:58
Prop Drilling: Component Composition as a Solution05:17
Introducing the Context API02:17
Creating & Providing The Context08:30
+10 more lectures
Handling Side Effects & Working with the useEffect() Hook
16 lectures • 01:21:11
Handling Side Effects & Working with the useEffect() Hook
16 lectures • 01:21:11
Module Introduction & Starting Project04:02
What's a "Side Effect"? A Thorough Example07:22
A Potential Problem with Side Effects: An Infinite Loop02:48
Using useEffect for Handling (Some) Side Effects05:31
Not All Side Effects Need useEffect07:58
+11 more lectures
Practice Project: Building a Quiz App
12 lectures • 02:01:20
Practice Project: Building a Quiz App
12 lectures • 02:01:20
Module Introduction & Starting Project02:21
A First Component & Some State07:03
Deriving Values, Outputting Questions & Registering Answers12:53
Shuffling Answers & Adding Quiz Logic06:57
Adding Question Timers11:40
+7 more lectures
A Look Behind The Scenes Of React & Optimization Techniques
13 lectures • 01:21:07
A Look Behind The Scenes Of React & Optimization Techniques
13 lectures • 01:21:07
Module Introduction01:16
React Builds A Component Tree / How React Works Behind The Scenes08:41
Analyzing Component Function Executions via React's DevTools Profiler05:57
Avoiding Component Function Executions with memo()08:03
Avoiding Component Function Executions with Clever Structuring06:06
+8 more lectures
An Alternative Way Of Building Components: Class-based Components
10 lectures • 01:00:26
An Alternative Way Of Building Components: Class-based Components
10 lectures • 01:00:26
Module Introduction02:10
What & Why04:52
Adding a First Class-based Component06:54
Working with State & Events11:38
The Component Lifecycle (Class-based Components Only!)05:20
+5 more lectures
Sending Http Requests (e.g. Connecting to a Database)
16 lectures • 01:25:08
Sending Http Requests (e.g. Connecting to a Database)
16 lectures • 01:25:08
Module Introduction02:53
How (Not) To Connect To A Database06:20
Starting Project & Dummy Backend API03:25
Preparing the App For Data Fetching05:47
How NOT To Send HTTP Requests (And Why It's Wrong)06:24
+11 more lectures
Building Custom React Hooks
7 lectures • 40:07
Building Custom React Hooks
7 lectures • 40:07
Module Introduction & Starting Project02:07
Revisiting the "Rules of Hooks" & Why To Use Hooks06:11
Creating a Custom Hook05:32
Custom Hook: Managing State & Returning State Values10:50
Exposing Nested Functions From The Custom Hook06:03
+2 more lectures
Working with Forms & User Input
16 lectures • 01:49:23
Working with Forms & User Input
16 lectures • 01:49:23
Module Introduction & Starting Project02:04
What Are Forms & What's Tricky About Them?03:59
Handling Form Submission11:31
Managing & Getting User Input via State & Generic Handlers11:12
Getting User Input via Refs04:35
+11 more lectures
Handling Forms via Form Actions
15 lectures • 01:33:28
Handling Forms via Form Actions
15 lectures • 01:33:28
Module Introduction02:48
What are Form Actions?06:47
Adding Validation Checks07:50
Managing Form-dependent State with useActionState()12:21
Using User Input10:04
+10 more lectures
Practice Project: Building a Food Order App
19 lectures • 03:20:47
Practice Project: Building a Food Order App
19 lectures • 03:20:47
Module Introduction & Starting Project04:14
Planning the App & Adding a First Component06:40
Fetching Meals Data (GET HTTP Request)12:00
Adding a "MealItem" Component07:39
Formatting & Outputting Numbers as Currency02:51
+14 more lectures
Diving into Redux (An Alternative To The Context API)
24 lectures • 02:14:34
Diving into Redux (An Alternative To The Context API)
24 lectures • 02:14:34
Module Introduction01:05
Another Look At State In React Apps05:14
Redux vs React Context06:19
How Redux Works05:48
MUST READ: Redux createStore() is (not) deprecated00:36
+19 more lectures
Advanced Redux
16 lectures • 01:54:10
Advanced Redux
16 lectures • 01:54:10
Module Introduction00:39
Redux & Side Effects (and Asynchronous Code)03:27
Refresher / Practice: Part 1/220:12
Refresher / Practice: Part 2/218:00
Using Firebase as a Backend00:30
+11 more lectures
Building a Multi-Page SPA with React Router
44 lectures • 03:45:35
Building a Multi-Page SPA with React Router
44 lectures • 03:45:35
Module Introduction03:21
Routing: Multiple Pages in Single-Page Applications03:15
Project Setup & Installing React Router03:05
Defining Routes07:42
Adding a Second Route02:07
+39 more lectures
Adding Authentication To React Apps
15 lectures • 01:12:41
Adding Authentication To React Apps
15 lectures • 01:12:41
Module Introduction01:10
How Authentication Works09:07
Project Setup & Route Setup03:46
Working with Query Parameters07:35
Implementing the Auth Action11:40
+10 more lectures
Deploying React Apps
7 lectures • 32:24
Deploying React Apps
7 lectures • 32:24
Module Introduction01:39
Deployment Steps03:35
Understanding Lazy Loading04:47
Adding Lazy Loading09:11
Building the Code For Production02:22
+2 more lectures
React Query / Tanstack Query: Handling HTTP Requests With Ease
20 lectures • 02:54:28
React Query / Tanstack Query: Handling HTTP Requests With Ease
20 lectures • 02:54:28
Module Introduction01:46
Project Setup & Overview04:08
React Query: What & Why?05:59
Installing & Using Tanstack Query - And Seeing Why It's Great!16:32
Understanding & Configuring Query Behaviors - Cache & Stale Data07:43
+15 more lectures
A (Pretty Deep Dive) Introduction to Next.js
79 lectures • 06:59:18
A (Pretty Deep Dive) Introduction to Next.js
79 lectures • 06:59:18
Module Introduction02:00
Creating a NextJS Project04:16
Understanding File-based Routing & React Server Components02:45
Adding Another Route via the Filesystem03:06
Navigating Between Pages04:12
+74 more lectures
React Server Components (RSC) & Server Actions - A Closer Look
11 lectures • 53:21
React Server Components (RSC) & Server Actions - A Closer Look
11 lectures • 53:21
Module Introduction01:48
Why We Need A Special Project Setup04:14
Understanding React Server Components07:16
Changing Server to Client Components05:46
Combining Server and Client Components05:52
+6 more lectures
Animating React Apps
21 lectures • 01:56:45
Animating React Apps
21 lectures • 01:56:45
Module Introduction03:05
Project Setup & Overview01:42
Animating with CSS Transitions07:40
Animating with CSS Animations05:38
Introducing Framer Motion03:48
+16 more lectures
React Patterns & Best Practices
12 lectures • 01:09:39
React Patterns & Best Practices
12 lectures • 01:09:39
Module Introduction00:55
Project Overview00:50
Introducing Compound Components11:04
Managing Multi-Component State with the Context API10:57
Grouping Compound Components06:29
+7 more lectures
Replacing Redux with React Hooks
15 lectures • 54:55
Replacing Redux with React Hooks
15 lectures • 54:55
Module Introduction01:01
React 18 & This Section00:25
Starting Project & Why You Would Replace Redux04:19
Alternative: Using the Context API07:13
Toggling Favorites with the Context API05:43
+10 more lectures
Testing React Apps (Unit Tests)
13 lectures • 01:11:29
Testing React Apps (Unit Tests)
13 lectures • 01:11:29
Module Introduction01:23
What & Why?03:23
Understanding Different Kinds Of Tests04:04
What To Test & How To Test01:29
Understanding the Technical Setup & Involved Tools02:39
+8 more lectures
React + TypeScript
25 lectures • 02:34:30
React + TypeScript
25 lectures • 02:34:30
Module Introduction01:26
What & Why?06:34
Installing & Using TypeScript06:38
Exploring the Base Types03:55
Working with Array & Object Types05:33
+20 more lectures
Optional: React Summary & Core Feature Walkthrough
37 lectures • 03:47:37
Optional: React Summary & Core Feature Walkthrough
37 lectures • 03:47:37
Module Introduction01:08
What Is React & Why Would You Use It?05:37
React Projects - Requirements02:09
Creating React Projects03:27
Out Starting Project03:28
+32 more lectures
Course Roundup
2 lectures • 01:35
Course Roundup
2 lectures • 01:35
Course Roundup01:10
Bonus!00:25
Course Update & Old Course Content
2 lectures • 16:05
Course Update & Old Course Content
2 lectures • 16:05
Course Update Overview, Explanation & Migration Guide15:48
Old Course Content Download00:17
[BONUS / OPTIONAL] React Basics & Working With Components
23 lectures • 02:16:47
[BONUS / OPTIONAL] React Basics & Working With Components
23 lectures • 02:16:47
About these [BONUS / OPTIONAL] sections00:27
Module Introduction03:46
What Are Components? And Why Is React All About Them?07:19
React Code Is Written In A "Declarative Way"!03:45
Creating a new React Project02:08
+24 more lectures
[BONUS / OPTIONAL] Time to Practice: Component Basics
8 lectures • 25:32
[BONUS / OPTIONAL] Time to Practice: Component Basics
8 lectures • 25:32
Module Introduction01:33
The Starting Project & Your Tasks04:47
Exercise Hints01:00
Outputting Key Concepts Data05:51
Identifying Possible Components02:02
+3 more lectures
[BONUS / OPTIONAL] React State & Working with Events
19 lectures • 01:58:51
[BONUS / OPTIONAL] React State & Working with Events
19 lectures • 01:58:51
Module Introduction02:30
Listening to Events & Working with Event Handlers10:01
Exercise: Listening to Events1 question
How Component Functions Are Executed05:51
Working with "State"11:17
+20 more lectures
[BONUS / OPTIONAL] Rendering Lists & Conditional Content
11 lectures • 01:00:31
[BONUS / OPTIONAL] Rendering Lists & Conditional Content
11 lectures • 01:00:31
Module Introduction00:46
Rendering Lists of Data07:29
Exercise: Rendering Lists of Data1 question
Using Stateful Lists04:45
Understanding "Keys"07:12
+9 more lectures
[BONUS / OPTIONAL] Time to Practice: A Complete Practice Project
22 lectures • 02:12:55
[BONUS / OPTIONAL] Time to Practice: A Complete Practice Project
22 lectures • 02:12:55
Module Introduction02:36
The First Practice Project & Your Tasks06:28
Exercise Hints00:58
Splitting the App Into Components07:24
Handling Events09:39
+17 more lectures
Description
This bestselling course by the author of "React Key Concepts" has turned more students into ReactJS developers than any other courses - more than 900,000 and counting!
-
Updated December 2024:
Fully updated for React 19!
- Added brand-new section on "Form Actions" (introduced by React 19)
- Added brand-new section on React Server Components (stable with React 19)
- Updated multiple lectures to adjust for smaller changes due to React 19
Updated earlier 2024:
Added brand-new content (~3h) on the NextJS App Router
Added a brand-new "Best Practices & Patterns" section
Updated 2023:
Updated the entire first half of the course (re-recorded lectures, other half was updated at beginning of year already)!
Improved explanations & demo projects. Course now covers even more key concepts & best practices.
Added brand-new section on React Query (Tanstack Query)
Added brand-new section on animating React apps with Framer Motion
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!
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 covers EVERYTHING you need to know and learn to become a React.js 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)
Using React Form Actions
Redux & Redux Toolkit
Routing with React Router
Understanding React Server Components
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!
Who this course is for:
- Students who want to learn how to build reactive and fast web apps
- Anyone who's interested in learning an extremely popular technology used by leading tech companies like Netflix
- Students who want to take their web development skills to the next level and learn a future-proof technology
This course includes:
- 71 hours on-demand video
- 48 articles
- 62 downloadable resources
- Access on mobile and TV
- ∞Full lifetime access
- Certificate of completion
Instructors
Academind by Maximilian Schwarzmüller
Maximilian Schwarzmüller
Students also download
Explore related courses to expand your learning journey.
All Levels
22 hours
The Complete Python Bootcamp From Zero to Hero in Python
Learn Python like a Professional Start from the basics and go all the way to creating your own applications and games
Jose Portilla
What you'll learn:
- ✓You will learn how to leverage the power of Python to solve tasks.
- ✓You will build games and programs that use Python libraries.
- ✓You will be able to use Python for your own work problems or personal projects.
- +9 more skills
22 hours
156 lectures
Access on mobile and TV
Certificate
DevelopmentPython
All Levels
52 hours
100 Days of Code: The Complete Python Pro Bootcamp
Master Python by building 100 projects in 100 days. Learn data science, automation, build websites, games and apps!
Dr. Angela Yu, Developer and Lead Instructor
What you'll learn:
- ✓You will master the Python programming language by building 100 unique projects over 100 days.
- ✓You will learn automation, game, app and web development, data science and machine learning all using Python.
- ✓You will be able to program in Python professionally
- +6 more skills
56.5 hours
592 lectures
Access on mobile and TV
Certificate
DevelopmentPython