React Essential Training

Course details

In this course, software developer and instructor Eve Porcello highlights the latest techniques for building a React app from scratch. Learn how to create elements, write components, and use React hooks. Get familiar with libraries like Next and Vite, and discover the differences between React Server Components and Client Components. Find out how to use the latest tools, techniques, and patterns that will help futureproof applications and make them more scalable and performant. After watching the course, you will be able to start your own project from scratch, and you will also be able to jump into an existing React codebase and make an impact.

Concepts

Introduction

Building modern user interfaces with React
How to use Codespaces and what you should know

React Fundamentals

What is React
How React works
Understanding the React compiler
Setting up Chrome tools for React
Working with VS Code

Creating React Elements

Initializing a project with Vite
Creating React elements
Working with JSX syntax
Creating a React component
Adding component properties
Destructuring component properties

Writing React Components

Working with lists
Adding keys to list items
Displaying images with React
Using Fragments

Handling State in a React Project

Destructuring arrays
Understanding the useState hook
Toggling state with a button
Handling state with nested components
Managing state with useReducer
Working with the useEffect hook

React Server Components

Creating a project with Next.js
Using the App Router
Building a server component
Challenge - Creating a route
Solution - Creating a route

Asynchronous React in Next.js

Fetching data in React applications
Passing data as props
Creating a client component
Building a form
Creating a server action

Conclusion

Designing performant apps with React Server Components