Этот материал находится в платной подписке. Оформи премиум подписку и смотри React - Полный Курс по React, а также все другие курсы, прямо сейчас!
Премиум
  • Урок 1. 00:01:16
    План расширения курса
  • Урок 2. 00:00:42
    Скачайте архив с проектами (ОБНОВЛЯЕТСЯ при расширении курса)
  • Урок 3. 00:00:48
    Введение в React
  • Урок 4. 00:03:16
    Предварительные требования к курсу
  • Урок 5. 00:02:45
    Одностраничные приложения
  • Урок 6. 00:04:39
    Преимущества и недостатки одностраничных приложений
  • Урок 7. 00:07:07
    Основы React и взаимодействие с DOM
  • Урок 8. 00:00:45
    Ключевые понятия в React
  • Урок 9. 00:04:23
    Компоненты
  • Урок 10. 00:02:49
    Иерархия и переиспользование компонентов
  • Урок 11. 00:00:42
    Из чего состоят компоненты React
  • Урок 12. 00:02:07
    Функциональные и классовые компоненты
  • Урок 13. 00:05:14
    JSX - JavaScript Syntax Extension
  • Урок 14. 00:01:51
    Встроенные и пользовательские компоненты
  • Урок 15. 00:01:57
    Корневой элемент в JSX
  • Урок 16. 00:02:20
    Свойства и состояние компонентов
  • Урок 17. 00:02:03
    Родительские и дочерние компоненты
  • Урок 18. 00:03:01
    Принципы изменения свойств и состояния
  • Урок 19. 00:00:50
    Ререндеринг компонентов
  • Урок 20. 00:01:39
    Резюме по ключевым понятиям в React
  • Урок 21. 00:00:51
    React Hooks
  • Урок 22. 00:02:12
    Программы для курса
  • Урок 23. 00:02:21
    Установка и настройка расширения Prettier
  • Урок 24. 00:03:50
    Проект с Vanilla JS
  • Урок 25. 00:01:31
    Запуск приложения с помощью Live Server
  • Урок 26. 00:03:37
    Замена текста кнопки при нажатии с помощью JS
  • Урок 27. 00:02:02
    Добавление стилей CSS в HTML файле
  • Урок 28. 00:02:47
    Изменение стилей кнопки при нажатии
  • Урок 29. 00:01:45
    Анализ HTML страницы в инструментах разработчика Google Chrome
  • Урок 30. 00:02:19
    Подведение итогов по примеру с Vanilla JS
  • Урок 31. 00:02:51
    Пример с подключением React в файл HTML
  • Урок 32. 00:05:36
    Создание h1 элемента с помощью React
  • Урок 33. 00:02:05
    Подключение библиотеки react-dom
  • Урок 34. 00:00:48
    Добавление div для монтирования React приложения
  • Урок 35. 00:02:45
    Монтирование приложения React в DOM с помощью react-dom
  • Урок 36. 00:00:57
    Проверка успешного добавления React компонента в DOM
  • Урок 37. 00:03:23
    Проект по добавлению h1 с помощью Vanilla JS
  • Урок 38. 00:03:08
    Сравнения результатов добавления h1 с React и без него
  • Урок 39. 00:02:33
    Проект с использованием JSX
  • Урок 40. 00:01:43
    Почему код JSX не запустился в веб браузере
  • Урок 41. 00:03:52
    Для чего нужен Babel
  • Урок 42. 00:05:13
    Трансформация кода JSX с помощью Babel
  • Урок 43. 00:05:40
    Попытка сконвертировать код JSX без общего корневого тега
  • Урок 44. 00:01:44
    Подведение итогов по Babel
  • Урок 45. 00:02:37
    Подключение Babel в файле HTML
  • Урок 46. 00:00:40
    Задание типа для JavaScript кода для корректной трансформации Babel
  • Урок 47. 00:01:44
    Запуск приложения с JSX при подключенном Babel
  • Урок 48. 00:00:47
    Подведение итогов по проекту с JSX и Babel
  • Урок 49. 00:01:24
    Обзор сайта с документацией по React
  • Урок 50. 00:03:15
    Проект с React с таким же функционалом как в первом проекте
  • Урок 51. 00:01:02
    Создание кнопки с помощью React
  • Урок 52. 00:01:41
    Почему в JSX нужно использовать className вместо class
  • Урок 53. 00:00:43
    Свойства для кнопки в React
  • Урок 54. 00:01:27
    Перенос JavaScript кода в отдельный файл
  • Урок 55. 00:06:33
    Запуск проекта React с помощью Live Server
  • Урок 56. 00:02:22
    Использование JavaScript в коде JSX
  • Урок 57. 00:01:25
    Добавление обработчика при нажатии на кнопку
  • Урок 58. 00:03:20
    Проверка замены текста на кнопке при нажатии
  • Урок 59. 00:04:11
    Перенос кода JSX в функциональный компонент React
  • Урок 60. 00:04:55
    Добавление состояния компонента с помощью хука useState
  • Урок 61. 00:01:27
    Перезаписывать значения переменных из состояния непрямую нельзя
  • Урок 62. 00:00:47
    Изменение состояния с помощью вызова функции
  • Урок 63. 00:01:30
    Как меняется реальный DOM при использовании React
  • Урок 64. 00:02:48
    Чистые функции и функции с побочными эффектами
  • Урок 65. 00:02:07
    Функции с побочными эффектами в React
  • Урок 66. 00:04:51
    Изменение стилей кнопки при нажатии с помощью React
  • Урок 67. 00:03:44
    Подведение итогов по проекту с изменением кнопки с помощью React
  • Урок 68. 00:05:55
    Добавление свойства для компонента
  • Урок 69. 00:00:12
    ЗАДАНИЕ - Передать дополнительное свойство
  • Урок 70. 00:02:07
    РЕШЕНИЕ - Передать дополнительное свойство
  • Урок 71. 00:04:12
    Курс по предварительным требованиям
  • Урок 72. 00:04:37
    HTML
  • Урок 73. 00:05:56
    CSS
  • Урок 74. 00:01:58
    Переменные в JavaScript
  • Урок 75. 00:03:34
    Функции
  • Урок 76. 00:02:41
    Стрелочные функции
  • Урок 77. 00:03:39
    Операторы
  • Урок 78. 00:02:22
    Логические операторы
  • Урок 79. 00:02:03
    Spread оператор
  • Урок 80. 00:02:45
    Деструктуризация объектов
  • Урок 81. 00:01:33
    Деструктуризация массивов
  • Урок 82. 00:02:29
    Деструктуризация параметров функции
  • Урок 83. 00:02:43
    Тернарный оператор
  • Урок 84. 00:03:48
    Метод массивов map
  • Урок 85. 00:03:00
    Модули ES6
  • Урок 86. 00:04:16
    Классы
  • Урок 87. 00:02:17
    Промисы и fetch
  • Урок 88. 00:02:29
    Async и await
  • Урок 89. 00:02:50
    Именование переменных в React
  • Урок 90. 00:03:19
    NPM
  • Урок 91. 00:04:17
    Семантическое управление версиями
  • Урок 92. 00:01:07
    Скрипты NPM
  • Урок 93. 00:00:22
    Резюме для курса по предварительным требованиям
  • Урок 94. 00:04:16
    Create React App
  • Урок 95. 00:09:40
    Создание приложения с помощью Create React App
  • Урок 96. 00:16:46
    Обзор содержимого проекта React
  • Урок 97. 00:02:09
    Переустановка всех зависимостей NPM
  • Урок 98. 00:02:53
    Запуск приложения с помощью npm start
  • Урок 99. 00:13:36
    Анализ файлов приложиения React
  • Урок 100. 00:06:19
    Создание production версии с помощью npm run build
  • Урок 101. 00:07:53
    Пересоздание версии для production
  • Урок 102. 00:06:05
    Тестирование приложения с помощью npm test
  • Урок 103. 00:10:24
    Отключение react-scripts с помощью npm run eject
  • Урок 104. 00:07:24
    Запуск приложения после npm run eject
  • Урок 105. 00:04:34
    Создание шаблона для последующих проектов
  • Урок 106. 00:04:46
    Изменения CSS файлов в шаблонном проекте
  • Урок 107. 00:01:11
    Модификация html файла в шаблонном проекте
  • Урок 108. 00:05:11
    Замена favicon в шаблонном проекте
  • Урок 109. 00:01:07
    Подведение итогов по очистке шаблонного приложения
  • Урок 110. 00:05:22
    Отключение Git в проекте
  • Урок 111. 00:04:54
    Проект по переиспользованию компонентов
  • Урок 112. 00:02:45
    Вынос компонента в отдельный файл
  • Урок 113. 00:02:34
    Что будет если название компонента будет с маленькой буквы
  • Урок 114. 00:00:32
    ЗАДАНИЕ - Создание еще одного компонента
  • Урок 115. 00:01:35
    РЕШЕНИЕ - Создание еще одного компонента
  • Урок 116. 00:06:20
    Проект по использованию props
  • Урок 117. 00:00:15
    ЗАДАНИЕ - Добавление свойства для компонента
  • Урок 118. 00:00:58
    РЕШЕНИЕ - Добавление свойства для компонента
  • Урок 119. 00:03:08
    Деструктуризация свойств
  • Урок 120. 00:07:46
    Проект по условному возврату JSX
  • Урок 121. 00:01:15
    Значение true для свойств можно опускать
  • Урок 122. 00:03:15
    Тернарный оператор в JSX
  • Урок 123. 00:02:54
    Резюме по проекту с условным возвратом JSX
  • Урок 124. 00:08:04
    Проект с состоянием компонента
  • Урок 125. 00:03:50
    Добавление состояния для компонента RandomNum
  • Урок 126. 00:03:37
    Создание функции по генерации случайного числа
  • Урок 127. 00:07:37
    Генерирование нового случайного числа при нажатии на кнопку
  • Урок 128. 00:00:57
    ЗАДАНИЕ - Вынести функцию в отдельный модуль
  • Урок 129. 00:02:23
    РЕШЕНИЕ - Вынести функцию в отдельный модуль
  • Урок 130. 00:02:16
    ЗАДАНИЕ - Добавление свойства для случайных чисел
  • Урок 131. 00:03:22
    РЕШЕНИЕ - Добавление свойства для случайных чисел
  • Урок 132. 00:03:42
    Резюме по проекту с генерированием случайных чисел
  • Урок 133. 00:07:35
    Проект по передаче состояния через свойства
  • Урок 134. 00:02:07
    В состоянии какого компонента сохранять счетчик кликов
  • Урок 135. 00:02:26
    Добавление состояния со счетчиком кликов
  • Урок 136. 00:00:14
    ЗАДАНИЕ - Передача счетчика в компонент Counter
  • Урок 137. 00:01:59
    РЕШЕНИЕ - Передача счетчика в компонент Counter
  • Урок 138. 00:03:58
    Изменение состояния в дочернем компоненте
  • Урок 139. 00:06:51
    Изолирование состояния в родительском компоненте
  • Урок 140. 00:02:15
    Резюме по проекту передачи состояния через свойства
  • Урок 141. 00:03:06
    Очередность рендеринга компонент
  • Урок 142. 00:02:30
    Обновление состояния происходит асинхронно
  • Урок 143. 00:04:31
    Расширение React для Google Chrome
  • Урок 144. 00:00:36
    Завершение проекта по изменению состояния из дочерних компонент
  • Урок 145. 00:06:16
    Отображение данных из массивов
  • Урок 146. 00:09:23
    Пример с методом массивов map
  • Урок 147. 00:04:21
    Добавление key при использовании метода map
  • Урок 148. 00:01:41
    Проект с итерацией по массиву объектов
  • Урок 149. 00:03:42
    Генерация случайных данных для проекта
  • Урок 150. 00:03:46
    Добавление массива объектов в проект
  • Урок 151. 00:03:34
    Итерация по массиву объектов
  • Урок 152. 00:00:47
    ЗАДАНИЕ - Передача всех свойств объекта в компонент
  • Урок 153. 00:04:41
    РЕШЕНИЕ - Передача всех свойств объекта в компонент
  • Урок 154. 00:06:26
    Использование spread оператора для передачи свойств
  • Урок 155. 00:03:30
    Отображение данных из объекта в интерфейсе
  • Урок 156. 00:00:39
    ЗАДАНИЕ - Создание компонента Persons
  • Урок 157. 00:03:49
    РЕШЕНИЕ - Создание компонента Persons
  • Урок 158. 00:04:55
    Добавление стилей CSS для карточек
  • Урок 159. 00:04:53
    Подведение итогов по проекту с массивом объектов
  • Урок 160. 00:03:11
    Использование оператора И в JSX коде
  • Урок 161. 00:02:45
    Добавление стилей с помощью свойства style
  • Урок 162. 00:02:12
    Добавление обработчика нажатия на кнопку Reset
  • Урок 163. 00:04:47
    Условное отображение блока JSX с помощью оператора И
  • Урок 164. 00:01:52
    Использование двойного оператора НЕ в JSX
  • Урок 165. 00:00:56
    Резюме по проекту с оператором И
  • Урок 166. 00:04:08
    Проект по использованию React Fragment
  • Урок 167. 00:02:48
    Добавление пустого тега JSX
  • Урок 168. 00:02:32
    Почему React не нужно импортировать
  • Урок 169. 00:01:09
    Резюме по использованию React Fragment
  • Урок 170. 00:07:06
    Проект по неконтролируемым полям ввода
  • Урок 171. 00:06:22
    Получение значений из полей ввода
  • Урок 172. 00:02:51
    Подведение итогов по проекту с неконтролируемыми полями ввода
  • Урок 173. 00:04:20
    Проект по контролируемым полям ввода
  • Урок 174. 00:03:11
    Добавление обработчиков изменений в полях ввода
  • Урок 175. 00:00:12
    ЗАДАНИЕ - Контролируемое поле для ввода пароля
  • Урок 176. 00:00:43
    РЕШЕНИЕ - Контролируемое поле для ввода пароля
  • Урок 177. 00:02:45
    Данные из полей ввода теперь находятся в состоянии
  • Урок 178. 00:00:41
    Резюме по проекту с контролируемыми полями ввода
  • Урок 179. 00:08:41
    Сохранения объекта в состоянии компонента
  • Урок 180. 00:05:48
    Проект с использованием свойства children
  • Урок 181. 00:03:56
    Добавление других свойств для компонента Wrapper
  • Урок 182. 00:02:12
    Резюме по проекту со свойством children
  • Урок 183. 00:06:46
    Проект по использованию fetch в компонентах
  • Урок 184. 00:05:11
    Проблема с изменением состояния при использовании fetch
  • Урок 185. 00:05:12
    Выполнение асинхронных действий с помощью useEffect
  • Урок 186. 00:01:49
    Добавление зависимостей в useEffect
  • Урок 187. 00:02:08
    Отображение данных от удаленного сервера в интерфейсе
  • Урок 188. 00:03:25
    Резюме по проекту с использованием useEffect
  • Урок 189. 00:07:14
    Проект с массивом постов
  • Урок 190. 00:00:50
    ЗАДАНИЕ - Получение массива постов через API
  • Урок 191. 00:06:27
    РЕШЕНИЕ - Получение массива постов через API
  • Урок 192. 00:01:49
    Добавление обработки ошибок при запросе на сервер
  • Урок 193. 00:01:06
    ЗАДАНИЕ - Отображение массива постов в интерфейсе
  • Урок 194. 00:06:02
    РЕШЕНИЕ - Отображение массива постов в интерфейсе
  • Урок 195. 00:02:21
    Добавление CSS стилей для постов
  • Урок 196. 00:03:52
    Отображение возможных ошибок в интерфейсе
  • Урок 197. 00:04:51
    Добавление индикации загрузки данных
  • Урок 198. 00:00:42
    Добавления заголовка перед списком постов
  • Урок 199. 00:00:30
    ЗАДАНИЕ - Перенос индикатора загрузки на место постов
  • Урок 200. 00:01:48
    РЕШЕНИЕ - Перенос индикатора загрузки на место постов
  • Урок 201. 00:04:42
    Подведение итогов по проекту с массивом постов
  • Урок 202. 00:03:54
    Проект с async await в useEffect
  • Урок 203. 00:05:59
    Передача async функции в useEffect
  • Урок 204. 00:05:09
    Почему в useEffect нельзя передавать асинхронную функцию
  • Урок 205. 00:01:52
    Создание отдельной async функции
  • Урок 206. 00:01:55
    Использование IIFE - Immediately Invoked Function Expression
  • Урок 207. 00:05:45
    Подведение итогов по проекту с async await
  • Урок 208. 00:02:22
    Проект с модулями CSS
  • Урок 209. 00:06:06
    Импорт файла с CSS стилями
  • Урок 210. 00:05:14
    Создание и подключение модуля CSS
  • Урок 211. 00:07:09
    Использование классов из CSS модуля
  • Урок 212. 00:03:19
    Подведение итогов по проекту с модулями CSS
  • Урок 213. 00:05:19
    Обзор финальной версии Todo App
  • Урок 214. 00:00:53
    Первая версия проекта Todo App
  • Урок 215. 00:04:38
    Организация файлов в папке components
  • Урок 216. 00:02:57
    ЗАДАЧИ для первой итерации Todo App
  • Урок 217. 00:06:08
    Создание заготовок для всех компонентов Todo
  • Урок 218. 00:00:33
    Функционал добавления новой задачи
  • Урок 219. 00:08:50
    Создание и использования состояния с массивом задач
  • Урок 220. 00:11:19
    Добавление задач с помощью формы
  • Урок 221. 00:02:06
    Проверка добавления и отображения задач
  • Урок 222. 00:03:42
    Подведение итогов по первой итерации Todo App
  • Урок 223. 00:08:16
    Добавление стилей CSS для компонента TodoForm
  • Урок 224. 00:05:33
    Добавление стилей CSS для компонента Todo
  • Урок 225. 00:00:19
    ЗАДАЧА - Отображение текста об отсутствии задач
  • Урок 226. 00:01:39
    РЕШЕНИЕ - Отображение текста об отсутствии задач
  • Урок 227. 00:07:48
    Завершение задачи двойным кликом
  • Урок 228. 00:05:13
    Добавление иконки возле каждой задачи
  • Урок 229. 00:05:29
    Подведение итогов по созданию первой версии Todo App
  • Урок 230. 00:02:12
    Проект по созданию второй версии Todo App
  • Урок 231. 00:05:37
    Изменение структуры данных на массив объектов
  • Урок 232. 00:05:34
    Генерация уникальных id для задач
  • Урок 233. 00:07:39
    Завершение рефакторинга с массивом объектов
  • Урок 234. 00:08:33
    Добавление и стилизация кнопок удаления и завершения задач
  • Урок 235. 00:01:41
    Удаление отдельных задач
  • Урок 236. 00:10:33
    Завершение отдельных задач
  • Урок 237. 00:04:08
    Условное добавление классов CSS
  • Урок 238. 00:00:56
    Подведение итогов по удалению и завершению задач
  • Урок 239. 00:02:11
    Добавление блока с кнопками для всех задач
  • Урок 240. 00:08:35
    Создание компонента Button
  • Урок 241. 00:06:21
    Удаление всех или завершенных задач
  • Урок 242. 00:00:47
    ЗАДАЧА - Скрытие блока с кнопками при отсутствии задач
  • Урок 243. 00:00:50
    РЕШЕНИЕ - Скрытие блока с кнопками при отсутствии задач
  • Урок 244. 00:06:29
    Отключение кнопки удаления завершенных задач
  • Урок 245. 00:05:57
    Использование Button в TodoForm
  • Урок 246. 00:02:55
    Отображение текста с количеством завершенных задач
  • Урок 247. 00:04:24
    Подведение итогов по созданию второй версии Todo App