Даже если вы используете React уже несколько лет, ваша ментальная модель, вероятно, неточна. Это потому, что лучшая ментальная модель - это понимание того, как что-то действительно работает.
React чрезвычайно популярен и хорошо зарекомендовал себя на рынке труда для веб-разработчиков. Однако, чтобы эффективно использовать и отлаживать его, необходимо понимать, как он действительно работает.
В этом курсе, предназначенном как для начинающих, так и для опытных разработчиков на React, вы глубоко поймете, как React работает под капотом, погружаясь во внутреннюю структуру React: в сам исходный код React.
Большинство курсов учат вас использовать React. В этом курсе вы полностью поймете, как React работает, что позволит вам эффективно использовать и отлаживать его.
Вы получите знания о внутренней работе таких тем, как Дерево Элементов React, Дерево Fiber, JSX, Рендеринг, Реконсиляция, Состояние, Хуки, Эффекты, Suspense, React Server Components и многое другое.
Эти знания дадут вам ясность, которая будет служить вам каждый день при работе с React или такими фреймворками, основанными на React, как Next.js или Remix.
Посмотреть больше
Это пробный урок. Оформите подписку, чтобы получить доступ ко всем материалам курса. Премиум
Ограничение времени просмотра
Вы можете просматривать пробный урок только 10 минут. Получите полный доступ, чтобы смотреть без ограничений.
Conceptual Aside: Imperative vs. Declarative Programming
Урок 10.
00:03:13
The DOM and Imperative Programming
Урок 11.
00:04:09
The DOM and Declarative Programming
Урок 12.
00:00:27
React Elements
Урок 13.
00:04:18
Conceptual Aside: Recursion
Урок 14.
00:12:53
Conceptual Aside: POJOs
Урок 15.
00:11:37
Creating React Elements
Урок 16.
00:05:26
React Element Trees
Урок 17.
00:01:32
Conceptual Aside: DOM Element References
Урок 18.
00:06:04
React Elements and DOM Elements
Урок 19.
00:12:12
React DOM Updates
Урок 20.
00:06:02
Components
Урок 21.
00:11:08
Components and Reusability
Урок 22.
00:05:19
Conceptual Aside: Pure Functions
Урок 23.
00:12:25
Props
Урок 24.
00:14:12
Template Logic
Урок 25.
00:07:19
Element Properties
Урок 26.
00:00:22
JSX
Урок 27.
00:01:57
Conceptual Aside: Markup and Tree Creation Shorthand
Урок 28.
00:01:49
Conceptual Aside: Transformation
Урок 29.
00:19:41
React Elements and JSX
Урок 30.
00:12:01
JSX and Thinking In Elements
Урок 31.
00:02:48
Conceptual Aside: HTML Authoring
Урок 32.
00:10:04
Fragment and HTML Authoring
Урок 33.
00:00:42
Fiber and Reconciliation
Урок 34.
00:08:58
Root Creation and render
Урок 35.
00:04:23
Conceptual Aside: Trees and Linked Lists
Урок 36.
00:06:58
Fiber, Fiber Nodes, and Fiber Trees
Урок 37.
00:03:45
Conceptual Aside: Tree Reconciliation and the Tree Edit Distance Problem
Урок 38.
00:09:29
Work-In-Progress Nodes
Урок 39.
00:05:49
Reconciliation and Work
Урок 40.
00:00:22
Execution Contexts
Урок 41.
00:03:43
Conceptual Aside: Execution Contexts and the Event Loop
Урок 42.
00:04:15
Fiber and Custom Execution Contexts
Урок 43.
00:03:01
Units of Work and The Work Loop
Урок 44.
00:03:35
Conceptual Aside: Equality
Урок 45.
00:07:02
Beginning, Completing, Bailing Out and Pausing Work
Урок 46.
00:02:36
Lanes and Priority
Урок 47.
00:00:15
React DOM and Rendering
Урок 48.
00:02:56
Committing Work and The Renderer
Урок 49.
00:04:49
Mounting, Updating, and Unmounting
Урок 50.
00:00:24
Events
Урок 51.
00:11:37
DOM Events
Урок 52.
00:07:53
React Event Objects
Урок 53.
00:05:44
Synthetic Event Properties and Methods
Урок 54.
00:00:17
State
Урок 55.
00:06:37
Conceptual Aside: State Machines
Урок 56.
00:02:42
Conceptual Aside: Pure Functions (again)
Урок 57.
00:02:47
UI: A Function of State
Урок 58.
00:06:32
Conceptual Aside: Reducers
Урок 59.
00:08:57
Actions and State
Урок 60.
00:00:25
Hooks and State
Урок 61.
00:04:05
Fibers, Hooks, and State
Урок 62.
00:03:55
Conceptual Aside: Queues
Урок 63.
00:02:47
Update Queues
Урок 64.
00:02:39
State and Re-renders
Урок 65.
00:07:49
useReducer (Part 1)
Урок 66.
00:06:05
useReducer (Part 2)
Урок 67.
00:04:17
useState (Part 1)
Урок 68.
00:10:48
useState (Part 2)
Урок 69.
00:07:44
Rules of Hooks
Урок 70.
00:10:38
useState (Part 3)
Урок 71.
00:08:11
Conceptual Aside: Shallow Equality and Object.is
Урок 72.
00:07:47
Immutable State
Урок 73.
00:00:16
Adding Your Own Side Effects: useEffect
Урок 74.
00:01:32
Conceptual Aside: Pure Functions and Side Effects
Урок 75.
00:11:47
Adding Your Own Effects
Урок 76.
00:08:07
Dependencies
Урок 77.
00:02:35
A Game of Ping Pong
Урок 78.
00:09:55
Unmounting and Effects
Урок 79.
00:10:27
Fetching Data...or not
Урок 80.
00:04:09
Conceptual Aside: Stale Closures
Урок 81.
00:09:52
useEffect and Stale Closures
Урок 82.
00:10:26
What Not to Do
Урок 83.
00:00:24
useRef and forwardRef
Урок 84.
00:04:27
useRef
Урок 85.
00:05:16
useRef and the DOM
Урок 86.
00:04:16
forwardRef
Урок 87.
00:00:25
Custom Hooks
Урок 88.
00:12:31
Extracting Custom Hooks
Урок 89.
00:00:22
Component Design
Урок 90.
00:18:31
Real World Complexity and Loops
Урок 91.
00:28:52
Lifting State Up
Урок 92.
00:12:28
&&, 0, and Ternary Operators
Урок 93.
00:06:02
Children
Урок 94.
00:00:51
useContext
Урок 95.
00:04:29
Prop Drilling
Урок 96.
00:39:23
Context
Урок 97.
00:02:21
Context with Caution
Урок 98.
00:00:31
useId and Key
Урок 99.
00:08:49
useId
Урок 100.
00:15:29
Key
Урок 101.
00:00:19
memo, useMemo, and useCallback
Урок 102.
00:07:32
Conceptual Aside: Memoization
Урок 103.
00:16:01
memo
Урок 104.
00:20:16
useMemo
Урок 105.
00:10:33
useCallback
Урок 106.
00:01:38
React Forget
Урок 107.
00:00:22
useContext and Reducer
Урок 108.
00:27:23
useContext + Reducer
Урок 109.
00:06:15
3rd Party State Management
Урок 110.
00:00:50
Toolchains
Урок 111.
00:03:50
Conceptual Aside: Toolchains
Урок 112.
00:06:02
Conceptual Aside: ES Modules
Урок 113.
00:01:53
Create React App
Урок 114.
00:18:46
Vite
Урок 115.
00:03:51
Frameworks
Урок 116.
00:00:33
Strict Mode
Урок 117.
00:03:34
Adding Strict Mode
Урок 118.
00:10:28
Extra Re-render
Урок 119.
00:09:14
Extra Effect Re-run
Урок 120.
00:00:18
Forms
Урок 121.
00:15:05
Reorganizing Our App
Урок 122.
00:05:29
Uncontrolled Inputs
Урок 123.
00:13:44
Controlled Inputs
Урок 124.
00:08:00
form
Урок 125.
00:11:17
textarea, select, and More
Урок 126.
00:01:58
3rd Party Form Help
Урок 127.
00:02:13
Future Form Features
Урок 128.
00:00:17
React Dev Tools
Урок 129.
00:03:22
Using Dev Tools
Урок 130.
00:01:47
useDebugValue
Урок 131.
00:00:24
CSS and Components
Урок 132.
00:03:16
CSS and React
Урок 133.
00:04:11
Toolchains and CSS
Урок 134.
00:04:12
CSS Modules and more
Урок 135.
00:00:24
Class Project
Урок 136.
00:01:59
Spelling Bee
Урок 137.
00:03:22
HTML Authoring
Урок 138.
00:06:22
Getting the Data
Урок 139.
00:08:49
Header
Урок 140.
00:14:34
Honeycomb
Урок 141.
00:09:30
Shuffle
Урок 142.
00:12:10
Words and Letters
Урок 143.
00:14:50
Word List
Урок 144.
00:06:07
Score
Урок 145.
00:06:09
Highlighted Letter
Урок 146.
00:03:30
Final Thoughts
Урок 147.
00:00:21
Meta-Frameworks
Урок 148.
00:03:42
NextJS
Урок 149.
00:02:26
Remix
Урок 150.
00:00:31
Suspense
Урок 151.
00:03:45
Suspense and Frameworks
Урок 152.
00:10:16
Suspense and Remix
Урок 153.
00:00:53
React Server Components
Урок 154.
00:11:55
Server Components
Урок 155.
00:05:29
Client Components and 'use client'
Урок 156.
00:07:59
RSC Payload
Урок 157.
00:07:30
Composing Client and Server Components
Урок 158.
00:01:37
Conclusion
Урок 159.
00:00:26
UPDATE - 001 - use and Fetching Data (React 19+)
Урок 160.
00:08:58
UPDATE - 002 - use and Fetching Data (Part 1)
Урок 161.
00:07:26
UPDATE - 003 - use and Fetching Data (Part 2)
Урок 162.
00:02:24
UPDATE - 004 - ref as a prop (React 19+)
Урок 163.
00:05:11
UPDATE - 005 - use and Context (React 19+)
Урок 164.
00:01:31
UPDATE - 006 - use, Reducer, and Context (React 19+)
Автор - Anthony Alicea
Anthony Alicea
Anthony Alicea – высококвалифицированный разработчик программного обеспечения, архитектор и дизайнер пользовательского интерфейса. Он начал программировать в возрасте 12 лет и занялся разработкой веб-сайтов и веб-приложений в 16 лет. Энтони имеет степень в области компьютерных наук от Университета Case Western Reserve и является сертифицированным разработчиком приложений Microsoft. Его опыт охватывает множество технологий, включая HTML5, CSS3, Ja
Команда внимательно читает ваши комментарии и оперативно на них реагирует. Вы можете спокойно оставлять запросы на обновления или задавать любые вопросы о курсе здесь.
Не ограничивайте использование TypeScript в Angular! Изучите основы, его функции, рабочие процессы и способы их использования! Большинство людей знают TypeScript от Angular 2. Это язык, который вы должны использовать там, верно? Но он не ограничивается Angular! Узнайте, что такое TypeScript, почему он действительно является мощным дополнением к JavaScript, каковы его особенности и как его использовать! И при этом также понимайте, что вы на самом
Добро пожаловать на мой курс по Next.js. Этот курс немного интересен тем, как он структурирован, потому что он на самом деле разделен на две основные части. Это потому, что в Next.js есть два основных способа рендеринга и использования. Эти два способа в корне отличаются друг от друга в своей работе, поэтому курс разделен на две разные части.Первая основная часть будет посвящена маршрутизатору приложений. Вы заметите, что в этом курсе есть нескол
Усильте свой путь во фронтенд с 100+ информативными инфографиками для создания исключительных веб-приложений! Инфографики по React и видео-анимации научат вас за несколько минут тому, чему большинство книг научат вас несколько дней! Вы получите более 40 видео-анимаций в высоком разрешении, а также красивый PDF с более чем 100 невероятно наглядными инфографиками.
Совершенно новый интерактивный опыт обучения, который учит вас создавать богатые и динамичные веб-приложения с использованием React.Давайте будем честными. Учить React - это сложно.За последние несколько лет React стал неотъемлемым навыком для фронтенд-разработчиков. Почти каждая вакансия указывает его как предпосылку!Однако, если вы пытались изучить React, то знаете, что это может быть запутанным и ошеломляющим процессом. Столько всего нужно узн
Could this course please be updated, there are some new lessons
New modules:
1) Module 14 - use and Fetching Data (React 19+)
-- whole module
2) Module 15
-- ref as a Prop (React 19+)
3) Module 18 - useContext and use
-- use and Context (React 19+)
4) Module 20
-- Lesson 106 React Forget replaced with React Compiler
5) Module 21
-- use, Reducer, and Context (React 19+)
6) Module 28
-- Things to try
7) Module 31
-- RSCs In Depth
Module 20
-- React Compiler
Module 28
-- Things to try
Module 31
-- RSCs In Depth
Team Dynamics and
Soft Skills for Developers
The Missing Piece of Your Software Dev Education
https://dontimitateunderstand.com/p/team-dynamics-and-soft-skills-for-developers