Содержание курса
1. Подготовка
6 уроков
2 300
2 300
33м
116
Открытый
1.1
Добро пожаловать на курс!
↗
493
493
1м 32с
23
Закрытый
1.2
Скачиваем материалы к курсу
↗
398
398
0м 19с
20
Открытый
1.3
Подготовка и проверка ПО
↗
386
386
7м 29с
24
Открытый
1.4
Настройка VS Code для курса
↗
376
376
12м 40с
19
Открытый
1.5
Как проходить курс
↗
347
347
13м 43с
23
Открытый
1.6
Оставайтесь со мной на связи!
↗
300
300
0м 15с
7
2. Вспоминаем основное из JS (Опционально)
15 уроков
3 887
3 863
113м
229
Закрытый
2.1
Как работают функции. Типы функций в JS
↗
331
331
13м 20с
20
Закрытый
2.2
Вспоминаем метод find()
↗
298
298
4м 26с
15
Закрытый
2.3
Деструктуризация массивов и объектов
↗
283
283
9м 7с
16
Закрытый
2.4
Операторы Rest & Spread
↗
270
270
15м 58с
12
Закрытый
2.5
`${Template Literals} - шаблонные строки`
↗
256
256
4м 2с
15
Закрытый
2.6
If \ else \ Тернарный оператор ? :
↗
251
251
7м 54с
13
Закрытый
2.7
Логические операторы &&, ||, ??
↗
245
245
7м 29с
11
Закрытый
2.8
Опциональная цепочка?.
↗
249
249
5м 15с
16
Закрытый
2.9
Метод Map()
↗
246
246
8м 59с
15
Закрытый
2.10
Метод filter()
↗
231
231
6м 35с
16
Закрытый
2.11
Метод reduce()
↗
231
231
3м 24с
19
Закрытый
2.12
Метод sort()
↗
230
230
8м 6с
16
Закрытый
2.13
Асинхронность в JS Промисы
↗
253
253
11м 59с
15
Закрытый
2.14
Асинхронность в JS Async / Await
↗
247
247
9м 13с
19
Закрытый
2.15
Тест по JS (Опционально. Для самопроверки)
↗
266
242
3м 37с
11
3. Мини-курс по ChatGPT для обучения и работы (Опционально)
12 уроков
2 075
2 075
71м
103
Закрытый
3.1
Обзор нейросетей
↗
250
250
11м 25с
10
Закрытый
3.2
Лучшие модели искусственного интеллекта на сегодня
↗
186
186
5м 57с
8
Закрытый
3.3
Как оплатить подписку на Chat GPT
↗
182
182
5м 39с
8
Закрытый
3.4
Обзор тарифов Chat GPT
↗
167
167
6м 49с
8
Закрытый
3.5
Программа Chat GPT на разные операционные системы
↗
162
162
3м 57с
7
Закрытый
3.6
Используем Chat GPT для обучения
↗
168
168
7м 10с
7
Закрытый
3.7
Используем Chat GPT для программирования
↗
168
168
10м 53с
11
Закрытый
3.8
Где еще полезен Chat GPT
↗
157
157
3м 4с
8
Закрытый
3.9
Как показывать экран чату GPT
↗
161
161
5м 52с
6
Закрытый
3.10
Генерация изображений с помощью Chat GPT и не только
↗
153
153
6м 4с
8
Закрытый
3.11
Advanced Voice mode в Chat GPT
↗
153
153
4м 58с
10
Закрытый
3.12
Как работает Copilot от GitHub
↗
168
168
7м 31с
12
4. Введение в Реакт. (Props / Components / JSX)
19 уроков
4 822
4 806
160м
372
Закрытый
4.1
Как создать новый проект React
↗
302
302
14м 57с
27
Закрытый
4.2
Hello React! Структура приложения React
↗
287
287
9м 16с
22
Закрытый
4.3
Знакомство с компонентами
↗
281
281
10м 18с
20
Закрытый
4.4
Как создается компонент "под капотом" (CreateReactElemt)
↗
272
272
4м 13с
22
Закрытый
4.5
Как работает JSX
↗
269
269
9м 28с
22
Закрытый
4.6
Условный рендеринг JSX. Отображение части компонента
↗
262
262
10м 9с
23
Закрытый
4.7
Как работает CSS в React
↗
257
257
9м 39с
19
Закрытый
4.8
Как работают пути к файлам и папкам в проекте vite
↗
254
254
15м 34с
26
Закрытый
4.9
Правила JSX. Промежуточный итог
↗
251
251
6м 14с
16
Закрытый
4.10
Что такое Props
↗
248
248
9м 19с
19
Закрытый
4.11
#1-PRACTICE. Работа с Props - (Level 2)
↗
251
251
16м 6с
22
Закрытый
4.12
Подводим итоги. Работа с Props
↗
241
241
4м 11с
15
Закрытый
4.13
Рендеринг компонентов с помощью метода map()
↗
242
242
9м 2с
22
Закрытый
4.14
Деструктуризация Props
↗
238
238
4м 2с
15
Закрытый
4.15
Что такое <> React Fragment
↗
234
234
3м 54с
17
Закрытый
4.16
3 типа условного рендеринга
↗
238
238
10м 56с
21
Закрытый
4.17
Доп практика с тернарным оператором ? :
↗
232
232
5м 43с
16
Закрытый
4.18
#2-PRACTICE. Работа с Props часть 2 - (Level 2)
↗
229
229
9м 18с
18
Закрытый
4.19
Тест по блоку "Введение в React" - (Level 2)
↗
234
218
3м 23с
10
5. Углубление в основы React (useState & Events)
11 уроков
2 386
2 374
89м
172
Закрытый
5.1
Как работают события в React
↗
244
244
9м 34с
15
Закрытый
5.2
Первый Хук - useState()
↗
230
230
6м 31с
14
Закрытый
5.3
Обновление состояния на основе прошлого состояния
↗
223
223
9м 7с
17
Закрытый
5.4
Разница state и переменных
↗
222
222
3м 50с
13
Закрытый
5.5
Что значат декларативный и императивный подход
↗
217
217
3м 45с
15
Закрытый
5.6
Условный рендеринг с useState()
↗
216
216
12м 8с
17
Закрытый
5.7
onMouseEnter c useState. Наведение на элемент
↗
213
213
8м 50с
18
Закрытый
5.8
Устанавливаем React DevTools
↗
210
210
4м 33с
15
Закрытый
5.9
#3-PRACTICE - StateTabs (Level 2)
↗
209
209
19м 31с
16
Закрытый
5.10
#4-PRACTICE - StateCalculator (Level 2)
↗
200
200
14м 34с
22
Закрытый
5.11
Тест по блоку "Углубление в основы React" - (Level 2)
↗
202
190
4м 9с
10
6. #01-PROJECT - TaskList - (Level 3)
7 уроков
1 278
1 278
104м
107
Закрытый
6.1
Обзор проекта
↗
219
219
4м 18с
16
Закрытый
6.2
Создаем структуру приложения
↗
200
200
21м 4с
16
Закрытый
6.3
Условный рендеринг для открытия и закрытия окон
↗
182
182
11м 8с
17
Закрытый
6.4
Создаем массив с задачами
↗
185
185
19м 38с
16
Закрытый
6.5
Делим массив задач на активные и выполненные
↗
166
166
11м 4с
12
Закрытый
6.6
Добавляем функциональность и логику приложению
↗
164
164
14м 2с
12
Закрытый
6.7
Настраиваем кнопки сортировки задач
↗
162
162
24м 32с
18
7. Важные возможности Props
11 уроков
1 891
1 878
119м
144
Закрытый
7.1
Структура файлов React приложения
↗
189
189
17м 45с
16
Закрытый
7.2
Как создать универсальный компонент
↗
182
182
13м 54с
15
Закрытый
7.3
Что такое PropTypes и как их использовать
↗
179
179
8м 30с
13
Закрытый
7.4
Как работает {children} prop
↗
174
174
7м 17с
11
Закрытый
7.5
Что такое проброс Props (Props drilling)
↗
172
172
7м 51с
15
Закрытый
7.6
Что такое композиция компонентов
↗
170
170
10м 18с
14
Закрытый
7.7
Завершаем создание UI Библиотеки
↗
165
165
8м 30с
13
Закрытый
7.8
Явная передача компонента через Props
↗
166
166
6м 7с
13
Закрытый
7.9
Подводим итоги секции курса
↗
166
166
7м 47с
11
Закрытый
7.10
#5-PRACTICE - Универсальное модальное окно - (Level-2)
↗
170
170
33м 22с
14
Закрытый
7.11
Тест по блоку "Важные возможности Props" - (Level-2)
↗
158
145
3м 39с
9
8. UseEffect хук
18 уроков
2 800
2 794
158м
183
Закрытый
8.1
Подключаемся к Weather API
↗
173
173
5м 50с
12
Закрытый
8.2
Используем useState в логике рендера функции
↗
168
168
9м 47с
9
Закрытый
8.3
Знакомство с useEffect() хуком
↗
163
163
12м 22с
10
Закрытый
8.4
Подробнее про useEffect()
↗
161
161
10м 42с
10
Закрытый
8.5
Обработка ошибок часть 1
↗
161
161
13м 9с
13
Закрытый
8.6
Обработка ошибок часть 2
↗
159
159
8м 42с
10
Закрытый
8.7
Используем данные полученные от API
↗
160
160
5м 22с
10
Закрытый
8.8
Как работает массив зависимостей в useEffect()
↗
161
161
8м 0с
11
Закрытый
8.9
Что будет если не использовать массив зависимостей в useEffect
↗
157
157
5м 36с
10
Закрытый
8.10
Добавляем условную логику
↗
157
157
8м 53с
10
Закрытый
8.11
Добавляем функциональность геолокации
↗
155
155
13м 19с
11
Закрытый
8.12
Что такое Side Effects? Примеры Side Effects
↗
155
155
8м 11с
8
Закрытый
8.13
Как работает функция отчистки в useEffect()
↗
154
154
8м 24с
10
Закрытый
8.14
Что такое гонка состояний?
↗
154
154
6м 8с
9
Закрытый
8.15
Как с помощью обработчиков событий работать с Side Effects
↗
153
153
12м 4с
11
Закрытый
8.16
#6-PRACTICE-Калькулятор обмена валют (Level-2)
↗
143
143
13м 5с
13
Закрытый
8.17
#7-PRACTICE-Добавляем таймер в проект Task List (Level-2)
↗
131
131
12м 32с
12
Закрытый
8.18
Тест по блоку "useEffect" - (Level-2)
↗
135
129
3м 46с
4
9. #02-PROJECT-Калькулятор обмена валют
4 урока
461
461
28м
23
Закрытый
9.1
Обзор проекта
↗
141
141
5м 50с
8
Закрытый
9.2
Создаем калькулятор валют часть 1
↗
112
112
10м 47с
6
Закрытый
9.3
Создаем калькулятор валют часть 2
↗
102
102
6м 59с
5
Закрытый
9.4
Создаем калькулятор валют часть 3
↗
106
106
8м 47с
4
10. Необходимая теория работы React
14 уроков
1 915
1 908
82м
124
Закрытый
10.1
Обзор секции
↗
147
147
2м 11с
11
Закрытый
10.2
Классовые VS Функциональные компоненты
↗
145
145
5м 14с
10
Закрытый
10.3
Компоненты, копии компонентов, элементы
↗
142
142
6м 48с
8
Закрытый
10.4
Что такое "Рендеринг" на самом деле
↗
142
142
6м 18с
8
Закрытый
10.5
Что такое виртуальный DOM
↗
141
141
5м 18с
12
Закрытый
10.6
Что такое Fiber Tree
↗
139
139
9м 11с
11
Закрытый
10.7
Разбираем схему рендеринга
↗
133
133
6м 39с
13
Закрытый
10.8
Что такое мемоизация и зачем она нужна
↗
137
137
9м 45с
6
Закрытый
10.9
Разбираем фазу коммита.
↗
134
134
4м 19с
7
Закрытый
10.10
Почему необходимо использовать key prop
↗
131
131
9м 20с
10
Закрытый
10.11
Как работает пакетное обновление в реакт
↗
131
131
7м 9с
9
Закрытый
10.12
Про Монтирование и Размонтирование компонентов
↗
132
132
4м 17с
9
Закрытый
10.13
Различия Frameworks VS Libraries
↗
132
132
5м 14с
8
Закрытый
10.14
Тест по блоку "Необходимая теория" - (Level-2)
↗
129
122
3м 9с
2
11. useRef хук и создание своего хука
5 уроков
702
693
39м
51
Закрытый
11.1
Переменные vs useState vs useRef
↗
145
145
9м 46с
9
Закрытый
11.2
Используем useRef для доступа к элементам
↗
143
143
9м 54с
11
Закрытый
11.3
Итого: useRef
↗
142
142
3м 8с
11
Закрытый
11.4
Как создать свой собственный хук
↗
139
139
15м 12с
13
Закрытый
11.5
Тест по блоку useRef хук и создание своего хука - (Level 2)
↗
133
124
3м 38с
7
12. React Router 6.4+ (Без подгрузки данных)
21 урок
2 760
2 755
177м
224
Закрытый
12.1
Настраиваем проект
↗
154
154
4м 2с
13
Закрытый
12.2
Создаем страницы с помощью React Router
↗
145
145
13м 38с
12
Закрытый
12.3
Как создать ссылки в React Router с помощью
↗
145
145
5м 13с
9
Закрытый
12.4
Как создать навигационное меню с помощью NavLink
↗
140
140
4м 35с
6
Закрытый
12.5
Разница между компонентами и страницами
↗
138
138
6м 51с
11
Закрытый
12.6
Абсолютный vs относительный путь в ссылках
↗
139
139
2м 24с
11
Закрытый
12.7
Второй вариант использования компонента на странице
↗
138
138
5м 22с
10
Закрытый
12.8
Как работает компонент Outlet
↗
138
138
10м 3с
17
Закрытый
12.9
Что такое атрибут index в параметрах маршрута
↗
137
137
2м 12с
13
Закрытый
12.10
Как работает useParams хук
↗
137
137
24м 19с
17
Закрытый
12.11
Условный рендеринг продуктов
↗
134
134
9м 32с
9
Закрытый
12.12
Как работает useSearchParams хук
↗
129
129
11м 41с
8
Закрытый
12.13
Используем Query string в проекте
↗
128
128
10м 20с
12
Закрытый
12.14
Как работает useLocation хук
↗
127
127
12м 21с
11
Закрытый
12.15
Как работает useNavigate хук
↗
122
122
12м 5с
8
Закрытый
12.16
Как работает компонент Navigate
↗
121
121
4м 10с
12
Закрытый
12.17
Дополнительные атрибуты ссылок
↗
119
119
4м 48с
12
Закрытый
12.18
Итог: Link vs Navigate vs useNavigate
↗
120
120
4м 31с
11
Закрытый
12.19
Сравнение старого и нового синтаксиса React Router
↗
120
120
3м 38с
10
Закрытый
12.20
#8-PRACTICE-React Router (Level-2)
↗
115
115
30м 31с
9
Закрытый
12.21
Тест по блоку React Router 6.4+ - (Level 2)
↗
114
109
4м 0с
3
13. Tailwind course & CSS Modules (Опциональный блок)
24 урока
2 604
2 604
155м
152
Закрытый
13.1
Обзор блока курса
↗
148
148
1м 19с
8
Закрытый
13.2
Как работают CSS модули
↗
136
136
10м 46с
9
Закрытый
13.3
Настраиваем Tailwind
↗
133
133
15м 52с
11
Закрытый
13.4
Работа с цветами в Tailwind
↗
125
125
5м 34с
7
Закрытый
13.5
Как создавать собственные палитры цветов
↗
120
120
4м 56с
9
Закрытый
13.6
Работа с текстовыми стилями в Tailwind
↗
114
114
6м 52с
7
Закрытый
13.7
Padding & Margin & Height & Weight в Tailwind
↗
114
114
5м 26с
6
Закрытый
13.8
Свойство Display и отступы у дочерних элементов
↗
107
107
3м 49с
6
Закрытый
13.9
FlexBox в Tailwind
↗
107
107
4м 18с
7
Закрытый
13.10
CSS Grid в Tailwind
↗
106
106
3м 22с
5
Закрытый
13.11
Абсолютное позиционирование в Tailwind
↗
103
103
8м 58с
8
Закрытый
13.12
Работа с градиентом и кастомизация темы Tailwind
↗
103
103
11м 40с
7
Закрытый
13.13
Объединение классов используя директиву @apply
↗
104
104
4м 8с
6
Закрытый
13.14
Создания UI компонента вместо @apply
↗
105
105
6м 52с
5
Закрытый
13.15
Работа с объектом state NavLink
↗
103
103
5м 19с
7
Закрытый
13.16
Подключаем свои шрифты в проект
↗
100
100
3м 33с
6
Закрытый
13.17
Как работает адаптивный дизайн Tailwind
↗
105
105
5м 27с
8
Закрытый
13.18
Псевдо классы и класс group:
↗
102
102
6м 54с
6
Закрытый
13.19
Как работает класс peer:
↗
101
101
2м 25с
5
Закрытый
13.20
Как работают animation в Tailwind
↗
100
100
5м 41с
6
Закрытый
13.21
Как работают плагины вTailwind
↗
101
101
12м 49с
6
Закрытый
13.22
#9-PRACTICE Заканчиваем проект часть 1 (Level-2)
↗
99
99
19м 32с
2
Закрытый
13.23
Заканчиваем проект часть 2 (Опционально)
↗
85
85
9м 27с
4
Закрытый
13.24
Заканчиваем проект часть 3 (Опционально)
↗
83
83
4м 58с
1
14. React Router 6.4+ (С подгрузкой данных)
9 уроков
934
931
75м
68
Закрытый
14.1
Как происходила работа с API в React Router до версии 6.4.
↗
122
122
18м 28с
12
Закрытый
14.2
Cовременный способ загрузки данных параметром loader
↗
115
115
7м 25с
10
Закрытый
14.3
Cовременный способ обработки ошибок React Router 6.4+
↗
110
110
6м 33с
8
Закрытый
14.4
Хук useNavigation для получения данных компонентом
↗
107
107
11м 44с
10
Закрытый
14.5
Отправка данных параметром маршрута action
↗
106
106
8м 43с
6
Закрытый
14.6
#10-PRACTICE-Router Data Loading p1 (Level-2)
↗
99
99
9м 9с
6
Закрытый
14.7
#10-PRACTICE-Router Data Loading p2 (Level-2)
↗
92
92
9м 1с
4
Закрытый
14.8
#10-PRACTICE-Router Data Loading p3 (Level-2)
↗
90
90
5м 0с
9
Закрытый
14.9
Тест по блоку React Router 6.4+ Data Loading - (Level 2)
↗
93
90
2м 43с
3
15. Управление state через Context API
7 уроков
733
727
56м
36
Закрытый
15.1
Подводим итоги всего курса
↗
113
113
6м 15с
7
Закрытый
15.2
Как работает Context API
↗
114
114
10м 52с
8
Закрытый
15.3
#11-PRACTICE-Context API на проекте Task List (Level-2)
↗
104
104
10м 38с
2
Закрытый
15.4
Context API + Children prop
↗
107
107
19м 34с
5
Закрытый
15.5
Небольшая ошибка которую вы могли допустить
↗
97
97
5м 40с
8
Закрытый
15.6
Создаем кастомный хук для useContext
↗
100
100
5м 8с
4
Закрытый
15.7
Тест по блоку Context API - (Level 2)
↗
98
92
2м 59с
2
16. Продвинутое управление состоянием - useReducer hook
14 уроков
1 317
1 313
109м
68
Закрытый
16.1
Как работает оператор switch
↗
101
101
7м 41с
5
Закрытый
16.2
Варианты использования useState
↗
100
100
5м 17с
5
Закрытый
16.3
Знакомство с useReducer Hook
↗
101
101
10м 47с
7
Закрытый
16.4
Работа useReducer шаг за шагом
↗
97
97
5м 26с
5
Закрытый
16.5
Как работает функция dispatch.
↗
97
97
6м 30с
6
Закрытый
16.6
Объект в начальном состоянии вместо примитива
↗
98
98
8м 11с
6
Закрытый
16.7
Дополнительно о useReducer
↗
97
97
11м 34с
8
Закрытый
16.8
#12-PRACTICE - useReducer хук (Level-2)
↗
94
94
12м 59с
4
Закрытый
16.9
useReducer с загрузкой данных часть 1
↗
94
94
4м 50с
4
Закрытый
16.10
useReducer с загрузкой данных часть 2
↗
88
88
12м 32с
3
Закрытый
16.11
useReducer с загрузкой данных часть 3
↗
88
88
5м 10с
3
Закрытый
16.12
useReducer с загрузкой данных часть 4
↗
87
87
11м 6с
4
Закрытый
16.13
useReducer с загрузкой данных часть 5
↗
86
86
10м 53с
7
Закрытый
16.14
Тест по блоку useReducer хук - (Level 2)
↗
89
85
4м 56с
1
17. Библиотека Redux With Thunks
10 уроков
867
861
81м
48
Закрытый
17.1
Обзор проекта
↗
104
104
9м 46с
3
Закрытый
17.2
Создаем initialState и функцию reducer
↗
88
88
9м 55с
6
Закрытый
17.3
Как работает функция createStore и компонент Provider
↗
86
86
6м 52с
4
Закрытый
17.4
Как работает функция dispatch
↗
88
88
7м 3с
4
Закрытый
17.5
Получения state с помощью useSelector hook
↗
84
84
9м 20с
5
Закрытый
17.6
Рефакторинг функции action для dispatch
↗
84
84
6м 0с
5
Закрытый
17.7
Создание экшена удаления юзера
↗
83
83
4м 49с
5
Закрытый
17.8
Как работает Redux Thunk
↗
85
85
13м 18с
5
Закрытый
17.9
Как создавать и использовать несколько редьюсеров
↗
84
84
15м 27с
9
Закрытый
17.10
Тест по блоку Redux With Thunk - (Level 2)
↗
81
75
3м 41с
2
18. RTK (Redux ToolKit) Современный Redux
11 уроков
881
876
85м
47
Закрытый
18.1
Устанавливаем RTK в проект
↗
89
89
3м 4с
5
Закрытый
18.2
Создаем файл store
↗
86
86
5м 4с
3
Закрытый
18.3
Создаем "слайс"
↗
86
86
12м 37с
3
Закрытый
18.4
Используем "экшены" из "слайса"
↗
85
85
10м 30с
4
Закрытый
18.5
#13-PRACTICE - Добавьте функционал-(Level-2)
↗
78
78
8м 28с
4
Закрытый
18.6
Redux Dev Extension для браузера
↗
81
81
5м 12с
6
Закрытый
18.7
createAsyncThunk. Подгрузка пользователей
↗
80
80
11м 14с
6
Закрытый
18.8
Обработка ошибок в createAsyncThunk
↗
76
76
11м 21с
5
Закрытый
18.9
Дополнительные возможности createAsyncThunk
↗
74
74
5м 41с
5
Закрытый
18.10
#13-Practice-Завершите приложение-(Level-2)
↗
75
75
12м 0с
5
Закрытый
18.11
Тест по блоку RTK - (Level 2)
↗
71
66
2м 11с
1
19. Оптимизация проекта
7 уроков
522
514
47м
31
Закрытый
19.1
Вкладка profiler в devTools
↗
82
82
8м 56с
5
Закрытый
19.2
Как работает хук useMemo()
↗
77
77
10м 10с
7
Закрытый
19.3
Как работает хук useCallBack()
↗
75
75
5м 21с
5
Закрытый
19.4
Использование children вместо мемоизации
↗
70
70
5м 50с
4
Закрытый
19.5
Ленивая загрузка компонентов
↗
70
70
7м 56с
5
Закрытый
19.6
Компонент Suspense для статуса загрузки
↗
75
75
10м 56с
4
Закрытый
19.7
Тест по блоку Оптимизация проекта - (Level 2)
↗
73
65
2м 56с
1
20. Деплой проекта
3 урока
254
254
19м
20
Закрытый
20.1
Хэширование изображений
↗
86
86
6м 43с
3
Закрытый
20.2
Запускаем npm run build
↗
83
83
9м 40с
4
Закрытый
20.3
Размещение проекта на хостинге
↗
85
85
5м 0с
13
21. До новых встреч!
1 урок
90
90
1м
13
Закрытый
21.1
До встречи на уроках!
↗
90
90
1м 57с
13