ویو جی اس

Beginning React

Beginning React

React continues to be extremely popular in the front-end world. Whether you’re in the job market or are curious to explore React's massive ecosystem, learning it will help you become a better developer. In this series, we'll review the basics of using React. We’ll learn about JSX, state, events, hooks, extracting components, props, and more.

سطح متوسط 19 جلسه آموزشی 03:05:00 ساعت
01
قسمت 1

Introduction and Demo

To begin, let's take a look at the structure of a "Create React App" and build the obligatory counter example to get our feet wet.

02
قسمت 2

A Better Development Experience

Next, we'll install some tools to improve our development experience a bit when working with React.

03
قسمت 3

Make Use of State

Let's have a look at leveraging state in React using hooks. We'll also briefly review how it’s done using class-based components.

04
قسمت 4

Event Listeners

Next, we'll learn how to leverage events and event listeners in React. In the process, we'll implement the adding and removing functionality for our todo app.

05
قسمت 5

Editing Todos

In this episode, we continue to build out our todo app and work on completing and editing todos. We’ll continue to make use of new events, as well as conditional rendering in JSX.

06
قسمت 6

Extracting Components

In this lesson, we extract multiple components and learn how to pass state between them using props. We also take a look at the prop-types library to validate our props.

07
قسمت 7

More Todo Features

Let's continue adding more todo features as new components in our application.

08
قسمت 8

Other Built-in React Hooks

Let's have a look at some more React hooks that are available to you, including useRef, useEffect, and useMemo.

09
قسمت 9

Custom Hooks

Let's now review a few examples that make use of custom hooks to extract and clean up repeated logic.

10
قسمت 10

Context for State Management

Next, we'll use the Context API to provide global state to our application. This removes the need to pass props between components to manage state and can significantly clean up our code.

11
قسمت 11

CSS Transitions with React Transition Group

A few subtle transitions in your app can go a long way. Let's take a look at how to accomplish this using React Transition Group.

12
قسمت 12

React Router

Let’s take a look at basic routing with React Router. In this video, we'll add a few pages to our application and learn how to create routes and link between them.

13
قسمت 13

Fetching Data

Fetching data from an external server is something you’re going to have to do when building web apps. In this video, we’ll take a look at doing it the traditional way with basic state and the useEffect hook.

14
قسمت 14

Fetching Data with Custom Hooks

Let’s expand upon the code we wrote in the previous video and clean it up using custom hooks.

15
قسمت 15

Fetching Data with React Query

Let's review the extremely popular React Query library to fetch our data. We’ll discuss caching, error retrying, and background fetching.

16
قسمت 16

GitHub Issues Project: Part 1

Let’s reach for all the React knowledge we've learned so far to build a slimmed-down version of GitHub Issues that makes use of the GitHub REST API to fetch data.

17
قسمت 17

GitHub Issues Project: Part 2

Let’s finish up this mini-project and work on the details page to grab details about the issue as well as all of its comments.

18
قسمت 18

React With Laravel

Let’s finish up this series by taking a look at a few ways to use React within a Laravel project.

19
قسمت 19

Conclusion

Let’s wrap up by exploring some other interesting and useful topics in React's massive ecosystem. Thanks so much for joining me!