Working with Components in React 18

Focused View

Peter Kellner

2:58:55

60 View

1. Course Overview

1. Course Overview.mp4

01:43

2. Implementing Components in React Apps

1. Welcome.mp4

01:09

2. What Are Components.mp4

02:58

3. Deep Dive into a Single Component.mp4

04:15

4. Multiple Ways to Pass Parameters to Components.mp4

04:39

5. Adding Time Travel (State Changes) to a Component.mp4

05:08

6. Course Expectations.mp4

03:17

3. Exploring Our React Application

1. Introduction.mp4

01:35

2. The App Source in GitHub.mp4

01:38

3. Up and Running with Visual Studio Code.mp4

03:02

4. The Next.js Toolchain Basics.mp4

04:20

5. Review How the Todo App Works.mp4

01:34

6. Code Review of Our Todo App.mp4

03:08

7. Understanding the Todo Apps Data Layer.mp4

04:55

8. Takeaways.mp4

00:41

04. Global State Sharing and React Context

01. Introduction.mp4

02:47

02. Three Ways to Propagate State Between Components.mp4

01:43

03. Passing State as props Between Components.mp4

04:49

04. Sharing State with React Context.mp4

02:26

05. Implementing React Context in Our Layout Component.mp4

04:50

06. Move React Context into a Dedicated Component.mp4

04:17

07. Promote Context Creation to Where It Is Used.mp4

04:12

08. Enhance Components with HOCs (Higher Order Components).mp4

05:16

09. Code a Higher Order Component (HOC).mp4

03:58

10. Share Component State with HOCs.mp4

04:41

11. Comparing Ways to Share State Between Components.mp4

04:59

05. Handling Errors and Debugging Components

01. Introduction.mp4

01:38

02. Motivation for React Debug Tooling.mp4

02:39

03. Working with the React Dev Tools Component Tab.mp4

03:58

04. The useDebugValue Hook Basics.mp4

03:06

05. Integrating useDebugValue into Custom Theme Hook.mp4

05:20

06. An Advanced Use of useDebugValue.mp4

02:02

07. Working with the React Dev Tools Profiler Tab.mp4

05:29

08. Inspecting Component Renders with React Dev Tools.mp4

03:04

09. Adding Error Boundaries for Catching Errors in Production.mp4

05:52

10. Improving Our React Boundary Error UI.mp4

04:15

11. Takeaways.mp4

01:26

06. Improving Component UI Performance

01. Introduction.mp4

02:48

02. Fixing over Rendering Performance Problems.mp4

04:50

03. React.memo Can Solve over Rendering Problems.mp4

05:00

04. Implementing React.memo to Solve Our Re-rendering Problem.mp4

02:28

05. Advanced Usage of React.memo with a Custom Function.mp4

05:25

06. Deferring UI Updates with useDeferredValue.mp4

03:57

07. Implement useDeferredValue in the Todo App.mp4

02:05

08. Prioritizing State Updates in Components with useTransition.mp4

03:41

09. Implement useTransition in the Todo App.mp4

05:00

10. Verifying setTransition Is Working as Expected.mp4

02:23

11. Takeaways.mp4

01:21

7. Introducing Server Components

1. Introducing Server Components.mp4

03:18

2. Concurrent Rendering and Server Components.mp4

02:39

3. The Flow of Server Components.mp4

03:10

4. What, No Code.mp4

01:59

5. Going Forward with Server Components.mp4

00:40

8. Course Takeaways

1. Course Takeaways.mp4

01:22

Description

This course will teach you how to build React apps that use components in the best possible way while minimizing computer resources and maximizing browser UI experience.

What You'll Learn?

Creating UIs in React is all about creating independent components that seamlessly work together to present a consistent view across your React web app. In this course, Working with Components in React 18, you will gain the ability to architect and build high quality react apps. First, you will explore the various primitive methods for sharing props and state between components, as well as sharing data more globally with the Context API. Next, you’ll learn how to best handle errors in React components to make sure your users continue to have a great experience with your apps. Finally, you will discover how you can improve your app performance through minimizing over-rendering and other UI improvements. When you are finished with this course, you will have the skills and knowledge of React component design needed to leverage re-usability and ensure consistency in your apps and code with fewer bugs.

More details

User Reviews

Rating

average 0

Total votes0

Focused display

React

Peter Kellner

Instructor's Courses

Peter is an independent software consultant, specializing in .NET development from 1985 through 2001, as well as an MVP since 2006. He was founder and president of Tufden Inc, where he successfully delivered systems for clinic scheduling, insurance company management and medical claim processing. His solutions included delivering a turnkey medical office management system to over 500 customers nationwide. His passion for the computer dates back to elementary school when he joined his first computer club. He graduated from Cornell University in Ithaca, New York with a Bachelors and Masters in Mechanical and Aerospace Engineering.

Pluralsight

View courses Pluralsight

Pluralsight, LLC is an American privately held online education company that offers a variety of video training courses for software developers, IT administrators, and creative professionals through its website. Founded in 2004 by Aaron Skonnard, Keith Brown, Fritz Onion, and Bill Williams, the company has its headquarters in Farmington, Utah. As of July 2018, it uses more than 1,400 subject-matter experts as authors, and offers more than 7,000 courses in its catalog. Since first moving its courses online in 2007, the company has expanded, developing a full enterprise platform, and adding skills assessment modules.