React Tutorial

Start learning React →

Course Contents

React Tutorial

• React Introduction
• React Get Started
• How React Works (Virtual DOM)
• React Render HTML
• React StrictMode

React JSX

• React JSX
• JSX Expressions and Curly Braces
• JSX Attributes
• JSX Fragments and Children

React Components

• React Components
• Function Components
• Class Components
• React Props
• Props and Children
• Importing and Exporting Components
• Composition over Inheritance

React Rendering

• Conditional Rendering
• Lists and Keys
• React Events
• Handling Events
• Keeping Components Pure

React State

• React State
• useState Hook
• Updating Objects in State
• Updating Arrays in State
• Lifting State Up

React Hooks

• React Hooks and the Rules of Hooks
• useEffect Hook
• useEffect Dependencies and Cleanup
• useRef Hook
• useContext Hook
• useReducer Hook
• useCallback Hook
• useMemo Hook
• useId Hook
• Custom Hooks

React Context and State Management

• React Context API
• Context with useReducer
• Prop Drilling
• State Management Overview

React Forms

• React Forms
• Controlled Components
• Uncontrolled Components
• Form Validation
• Handling Multiple Inputs

React Styling

• Styling React Components
• Inline Styling
• CSS Modules
• Styled Components
• Sass in React

React Data Fetching

• Fetching Data in React
• Using the Fetch API
• Loading and Error States
• Cancelling Requests with AbortController

React Performance

• React.memo
• Optimizing Performance
• Lazy Loading and Suspense
• Reconciliation and the Virtual DOM
• Avoiding Unnecessary Re-renders

React Router

• React Router Setup
• Defining Routes
• Navigation with Link and NavLink
• URL Parameters
• Nested Routes and Outlet
• Programmatic Navigation

React Advanced Patterns

• Refs and forwardRef
• React Portals
• Error Boundaries
• Higher-Order Components
• Render Props

React with Tools

• React with TypeScript
• Testing React Components
• Project Structure and Best Practices
• Building and Deploying
• Server Components and Frameworks

React Reference

• React Hooks Reference
• Built-in Components Reference
• React Next Steps