React - The Complete Guide (incl Hooks, React Router, Redux)
- Descripción
- Currículum
- Reseñas
This course is the most up-to-date, comprehensive and bestselling React course on Udemy!
It was completely updated and re-recorded from the ground up – it teaches the very latest version of React with all the core, modern features you need to know!
—
This course also comes with two paths which you can take: The “complete” path (full >40h course) and the “summary” 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 originally created this course in 2017 and I have kept it updated since that – redoing it from the ground up in 2021. And of course I’m dedicated to keeping this course up-to-date – so that you can rely on this course to learn React in the best possible 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!
-
1Welcome To The Course!Video lesson
-
2What is React.js?Video lesson
-
3Why React Instead Of "Just JavaScript"?Video lesson
-
4Building Single-Page Applications (SPAs) with ReactVideo lesson
-
5Exploring React.js Alternatives (Angular / Vue)Video lesson
-
6Join our Online Learning CommunityText lesson
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!
-
7About This Course & Course OutlineVideo lesson
-
8The Two Ways (Paths) Of Taking This CourseVideo lesson
-
9Getting The Most Out Of This CourseVideo lesson
-
10Setting Up The Course Dev Environment (Code Editor)Video lesson
-
11Module IntroductionVideo lesson
Let me introduce you to this module and to what you're going to learn in it.
-
12Understanding "let" and "const"Video lesson
One important next-gen feature you're going to see a lot is the usage of "const" and "let" instead of "var". What's up with these keywords? This lecture answers the question.
-
13Arrow FunctionsVideo lesson
Arrow functions are another key next-gen feature we'll heavily use in this course. Let's dive into how to write them and how to use them in this lecture.
-
14Exports and ImportsVideo lesson
We'll write modular code in this course. That means, that the code will be split up across multiple files. In order to connect these files correctly, we'll need imports and exports. So let's dive into that feature in this lecture.
-
15Understanding ClassesVideo lesson
The "class" keyword is another new feature you'll see quite a bit in this course. Learn what it's about in this lecture.
-
16Classes, Properties and MethodsVideo lesson
Classes may have properties and methods. There actually are different ways of defining these. Let's dive into the details in this lecture.
-
17The Spread & Rest OperatorVideo lesson
React also makes heavy usage of the "Spread" operator. Or React projects do, to be precise. Learn more about that new operator in this lecture.
-
18DestructuringVideo lesson
Time to destructure! It's a new JavaScript feature and it allows you to ... do what? Let's explore the feature in this lecture.
-
19Reference and Primitive Types RefresherVideo lesson
Not next-gen but super important: Knowing the difference between reference and primitive types. This lecture will explore both.
-
20Refreshing Array FunctionsVideo lesson
We'll use a lot of array functions in this course. They're not next-gen but you need to feel confident working with them. So let's explore them in this lecture.
-
21Wrap UpVideo lesson
Let me wrap this module up and summarize what we learned thus far.
-
22Next-Gen JavaScript - SummaryText lesson
Have a look at this lecture to get a good overview over the various next-gen JS features you'll encounter in this course.
-
23JS Array FunctionsText lesson
Here's something we'll also use quite a bit in this course: Some JavaScript array functions.
-
24Module IntroductionVideo lesson
-
25What Are Components? And Why Is React All About Them?Video lesson
-
26React Code Is Written In A "Declarative Way"!Video lesson
-
27A Note About New React Projects & NodeJSText lesson
-
28Creating a new React ProjectVideo lesson
-
29The Starting ProjectText lesson
-
30Analyzing a Standard React ProjectVideo lesson
-
31Introducing JSXVideo lesson
-
32How React WorksVideo lesson
-
33Building a First Custom ComponentVideo lesson
-
34Writing More Complex JSX CodeVideo lesson
-
35Adding Basic CSS StylingVideo lesson
-
36Outputting Dynamic Data & Working with Expressions in JSXVideo lesson
-
37Passing Data via "props"Video lesson
-
38Adding "normal" JavaScript Logic to ComponentsVideo lesson
-
39Splitting Components Into Multiple ComponentsVideo lesson
-
40Time to Practice: React & Component BasicsText lesson
-
41The Concept of "Composition" ("children props")Video lesson
-
42A First SummaryVideo lesson
-
43A Closer Look At JSXVideo lesson
-
44Organizing Component FilesVideo lesson
-
45An Alternative Function SyntaxVideo lesson
-
46Learning Check: React Basics, Components, Props & JSXCuestionario
In this course module, you learned about key React features which you must know for every React app you're going to build! Hence it's time to check what you learned and verify that we're all on the same page!
-
47Module ResourcesText lesson
-
48Module IntroductionVideo lesson
-
49Listening to Events & Working with Event HandlersVideo lesson
-
50How Component Functions Are ExecutedVideo lesson
-
51Working with "State"Video lesson
-
52A Closer Look at the "useState" HookVideo lesson
-
53State can be updated in many ways!Text lesson
-
54Adding Form InputsVideo lesson
-
55Listening to User InputVideo lesson
-
56Working with Multiple StatesVideo lesson
-
57Using One State Instead (And What's Better)Video lesson
-
58Updating State That Depends On The Previous StateVideo lesson
-
59Handling Form SubmissionVideo lesson
-
60Adding Two-Way BindingVideo lesson
-
61Child-to-Parent Component Communication (Bottom-up)Video lesson
-
62Lifting The State UpVideo lesson
-
63Time to Practice: Working with Events & StateText lesson
-
64Controlled vs Uncontrolled Components & Stateless vs Stateful ComponentsVideo lesson
-
65Learning Check: Working with Events & StateCuestionario
-
66Module ResourcesText lesson
-
67Module IntroductionVideo lesson
-
68Rendering Lists of DataVideo lesson
-
69Using Stateful ListsVideo lesson
-
70Understanding "Keys"Video lesson
-
71Time to Practice: Working with ListsText lesson
-
72Outputting Conditional ContentVideo lesson
-
73Adding Conditional Return StatementsVideo lesson
-
74Time to Practice: Conditional ContentText lesson
-
75Demo App: Adding a ChartVideo lesson
-
76Adding Dynamic StylesVideo lesson
-
77Wrap Up & Next StepsVideo lesson
-
78Fixing a Small BugText lesson
-
79Learning Check: Outputting Lists & Conditional ContentCuestionario
-
80Module ResourcesText lesson
-
81Module IntroductionVideo lesson
-
82Setting Dynamic Inline StylesVideo lesson
-
83Setting CSS Classes DynamicallyVideo lesson
-
84Introducing Styled ComponentsVideo lesson
-
85Styled Components & Dynamic PropsVideo lesson
-
86Styled Components & Media QueriesVideo lesson
-
87Using CSS ModulesVideo lesson
-
88Dynamic Styles with CSS ModulesVideo lesson
-
89Module ResourcesText lesson
