Log In
Join
for free
Log In
Join
for free
Back To Course Home
React Deep Dive: From Beginner to Advanced
0% completed
Introduction
Getting Started
General
When Should I Use React and When Is It Best to Avoid It?
How Did React Come into Existence?
Into the Deep End
React Elements
Tools and Setup
Zero Config Setup
Quiz
Introduction to ES2015+
The "New" Javascript
Variable Declarations with let and const
Arrow Functions
New String and Array Methods
Objects
Classes
Spread Operator
Destructuring
Rest Operator
Template Strings
Promises
Asynchronous Functions with async / await
Import Syntax and JavaScript Modules
Quiz
JSX – an Introduction
JSX as an Important Building Block in React Development
Expressions in JavaScript
What Else You Should Know
Quiz
Rendering of Elements and Components in React
Rendering of Elements
The Two Types of React Components
Component Composition: Multiple Components in One
Dividing Components - Keeping an Overview
Props - Receiving Data in a Component
Pure Functions in Detail
Quiz
State and Lifecycle Methods
Introduction
Our First Stateful Component
Changing State with this.setState()
Lifecycle Methods
Lifecycle Methods in Practice
The Combination of state and props
The Role of Lifecycle Methods in Combination with Components
Quiz
Event Handling
Introduction to Event Handling
Differences Between the React Event Handlers and the Native Event
Scopes in Event Handlers
The SyntheticEvent Object
Quiz
Forms
Introduction to Forms
Uncontrolled Components
Controlled Components
Changing of Values
Quiz
Lists, Fragments, and Conditional Rendering
Introduction
Lists
Fragments
Conditional Rendering
Custom render() Methods and Components
Quiz
CSS and Styling
Introduction
Styling with the Style Attribute
Using CSS Classes in JSX
Modular CSS with CSS Modules
CSS-in-JS - Moving Styles Into Javascript
Quiz
Higher Order Components
Introduction
Implementing a Higher Order Component
Exercise
Quiz
Functions as a Child and Render Props
Introduction
Functions as a child
Render Props
Render Props, Function as a Child, and Higher Order Components
Quiz
Context API
Introduction
API
Usage of Multiple Contexts
contextType
Performance Issues
Quiz
Refs
Introduction
String Refs
Callback Refs
Refs Via createRef()
Ref Forwarding
Quiz
Error Boundaries
Introduction
Implementing an Error Boundary
Error Boundaries in Practice
Quiz
Portals
Introduction
Creating Portals
Portals and Their Relationship to Their Parent Component
Quiz
Code Splitting
Introduction
Using Dynamic Imports
Display Fallbacks with React.Suspense
Quiz
Typechecking with PropTypes, Flow, and TypeScript
Introduction
PropTypes
Flow
TypeScript
Quiz
React Hooks – an Introduction
Introduction
Built-in Hooks
Managing State with useState()
Adding Side Effects with useEffect()
Accessing Context with useContext()
Quiz
Hooks in Action
Introduction
Implement Your Own Hooks
Working with Data in Hooks
Quiz
The Hooks API
Introduction
useState
useEffect
useContext
useReducer
Reducers in Practice
useCallback
useMemo
useRef
useLayoutEffect
useDebugValue
useImperativeHandle
Quiz
Routing in React
Introduction
Routing
Defining Routes
Limit Matching Between Path and the URL
Parameters in URLs
Controlling Redirects of Particular Routes
Using Router Props
Navigating Different Routes
Connecting Components with a Router Using Higher-order Component
React Router and Hooks
Quiz
State Management
Introduction to State Management
Introduction to Redux
Store, Actions, and Reducers
Creating a Store
Action Creators vs. Actions
Complex Reducers
Asynchronous Actions
Typical Asynchronous Action Example
Debugging Using the Redux DevTools
Using Redux with React
mapStateToProps
mapDispatchToProps
mergeProps
Fourth Parameter for connect()
Combining the Puzzle Pieces
Redux with React Hooks
Quiz
Internationalization
Introduction
Setup of i18next
withTranslation() Higher-order Component
useTranslation() Hook
Complex Translations Using the Trans Component
Quiz
Conclusion
What's Next?
Appendix
Tools and Frameworks
Introduction
Overview of CSS and styling.
We'll cover the following
Introduction to styling in React
Introduction to styling in React
Get hands-on with 1200+ tech skills courses.
Start Free Trial