-
Урок 1. 00:04:20Об этом курсе
-
Урок 2. 00:05:22Что такое React
-
Урок 3. 00:10:21Первое React приложение
-
Урок 4. 00:06:18Настройка среды разработки
-
Урок 5. 00:05:42Как скачать код примеров
-
Урок 6. 00:06:05Современный JavaScript и его версии
-
Урок 7. 00:02:50Введение - как использовать этот раздел
-
Урок 8. 00:06:11Ключевые слова let и const
-
Урок 9. 00:11:45Arrow-функции
-
Урок 10. 00:05:40Параметры по-умолчанию
-
Урок 11. 00:04:15Rest параметр
-
Урок 12. 00:04:18Spread оператор для массивов
-
Урок 13. 00:12:55Деструктуризация объектов
-
Урок 14. 00:09:27Деструктуризация массивов
-
Урок 15. 00:04:33Шаблонные строки (template strings)
-
Урок 16. 00:07:37Объекты
-
Урок 17. 00:03:49Оператор Object Spread
-
Урок 18. 00:14:20Прототипы
-
Урок 19. 00:09:18Классы
-
Урок 20. 00:07:20Свойства классов (class properties)
-
Урок 21. 00:11:29Модули в JavaScript
-
Урок 22. 00:05:01Каким будет наш первый проект
-
Урок 23. 00:08:09Создаём пустой React проект
-
Урок 24. 00:11:06React элементы
-
Урок 25. 00:06:32React компоненты
-
Урок 26. 00:14:20JSX
-
Урок 27. 00:04:20Упражнение - Code Review 1
-
Урок 28. 00:08:52Структура React проекта (часть 1)
-
Урок 29. 00:07:22Props - свойства компонентов
-
Урок 30. 00:10:32Массивы, как свойства компонентов
-
Урок 31. 00:10:50Коллекции и ключи
-
Урок 32. 00:14:37Как импортировать css
-
Урок 33. 00:08:10Структура React проекта - часть 2
-
Урок 34. 00:08:00Компоненты-классы
-
Урок 35. 00:11:37Обработка событий
-
Урок 36. 00:05:36State - состояние React компонента
-
Урок 37. 00:04:32Как работает setState()
-
Урок 38. 00:05:26Обновление состояние, зависящее от предыдущего состояния
-
Урок 39. 00:07:43Собственные события
-
Урок 40. 00:11:38setState() - удаление элемента
-
Урок 41. 00:14:42setState() - добавление элемента
-
Урок 42. 00:07:57Данные в React приложении
-
Урок 43. 00:15:46setState() - редактирование элементов
-
Урок 44. 00:09:31Работа с формами
-
Урок 45. 00:04:12Контролируемые компоненты
-
Урок 46. 00:01:54Как использовать этот раздел
-
Урок 47. 00:09:09Реализуем поиск
-
Урок 48. 00:13:08Реализуем фильтры
-
Урок 49. 00:03:03Каким будет наш следующий проект
-
Урок 50. 00:05:16Создаём пустой проект
-
Урок 51. 00:03:28Выбор HTTP API для браузера
-
Урок 52. 00:05:51Как работает Fetch API
-
Урок 53. 00:04:16Обработка ошибок в Fetch API
-
Урок 54. 00:07:21Создаём клиент для API
-
Урок 55. 00:06:51Создаём компоненты StarDB
-
Урок 56. 00:09:48Компонент, который получает данные из API
-
Урок 57. 00:11:28Трансформация данных API
-
Урок 58. 00:04:21Создаём индикатор загрузки
-
Урок 59. 00:08:39Логика индикатора загрузки
-
Урок 60. 00:08:59Обработка ошибок сети в компоненте
-
Урок 61. 00:05:25Работа с API - выводы
-
Урок 62. 00:07:07Зачем компонентам "жизненный цикл"?
-
Урок 63. 00:06:00Методы жизненного цикла
-
Урок 64. 00:02:39componentDidMount()
-
Урок 65. 00:08:03Используем на практике componentDidMount()
-
Урок 66. 00:02:08componentDidUpdate()
-
Урок 67. 00:07:51Используем на практике componentDidUpdate()
-
Урок 68. 00:02:20componentWillUnmount()
-
Урок 69. 00:10:41componentDidCatch()
-
Урок 70. 00:09:11Используем componentDidCatch() на практике
-
Урок 71. 00:04:07Паттерны React - введение
-
Урок 72. 00:09:22Использование функций
-
Урок 73. 00:07:15Render-функции
-
Урок 74. 00:06:56Свойства-элементы
-
Урок 75. 00:08:45Children
-
Урок 76. 00:09:16Практика - рефакторинг компонента
-
Урок 77. 00:09:43Работа с props.children
-
Урок 78. 00:05:17Клонирование элементов
-
Урок 79. 00:12:51Компоненты высшего порядка (HOC)
-
Урок 80. 00:12:11Рефакторинг компонентов
-
Урок 81. 00:08:32Композиция компонентов высшего порядка
-
Урок 82. 00:06:34Контекст
-
Урок 83. 00:09:47Использование Context API
-
Урок 84. 00:07:04Использование HOC для работы с контекстом
-
Урок 85. 00:12:26Трансформация props в компонентах высшего порядка
-
Урок 86. 00:12:53Обновление контекста
-
Урок 87. 00:10:20Рефакторинг: делаем код чище
-
Урок 88. 00:07:36Рефакторинг компонентов высшего порядка (опциональный урок)
-
Урок 89. 00:11:24Функция compose() (опциональный урок))
-
Урок 90. 00:06:14Свойство defaultProps
-
Урок 91. 00:05:00Свойство propTypes
-
Урок 92. 00:03:58NPM - установка дополнительных пакетов
-
Урок 93. 00:07:28Библиотеки prop-types
-
Урок 94. 00:06:57Что такое React Hooks (хуки)
-
Урок 95. 00:02:29Новый проект
-
Урок 96. 00:11:15useState()
-
Урок 97. 00:02:51useContext()
-
Урок 98. 00:11:04useEffect()
-
Урок 99. 00:09:33useEffect() - упражнения
-
Урок 100. 00:07:32Использование useEffect() для загрузки данных
-
Урок 101. 00:02:28Создание собственных хуков
-
Урок 102. 00:17:51useCallback() и useMemo()
-
Урок 103. 00:03:50Правила и ограничения хуков
-
Урок 104. 00:04:55Что такое роутинг
-
Урок 105. 00:04:54Основы react-router
-
Урок 106. 00:03:01Link
-
Урок 107. 00:05:30Как работает Route
-
Урок 108. 00:07:06Динамические пути
-
Урок 109. 00:06:35withRouter
-
Урок 110. 00:04:59Относительные пути
-
Урок 111. 00:08:04Опциональные параметры
-
Урок 112. 00:11:13Авторизация и "закрытые" страницы
-
Урок 113. 00:07:16Switch (обработка несуществующих адресов)
-
Урок 114. 00:10:15Введение в Redux
-
Урок 115. 00:03:33Установка библиотек
-
Урок 116. 00:07:04Reducer
-
Урок 117. 00:04:28Redux Store
-
Урок 118. 00:06:04Чистые функции
-
Урок 119. 00:05:22UI для Redux
-
Урок 120. 00:03:43Действия с параметрами
-
Урок 121. 00:03:43Action Creator
-
Урок 122. 00:01:59Структура проекта
-
Урок 123. 00:08:50bindActionCreators()
-
Урок 124. 00:08:48Использование React и Redux
-
Урок 125. 00:11:03react-redux и функция connect()
-
Урок 126. 00:08:06Функция mapDispatchToProps()
-
Урок 127. 00:04:28mapDispatchToProps в виде объекта
-
Урок 128. 00:02:30Наш следующий проект
-
Урок 129. 00:03:35Инициализация проекта
-
Урок 130. 00:05:29Структура react+redux проекта
-
Урок 131. 00:09:34Вспомогательные компоненты
-
Урок 132. 00:06:44Redux компоненты
-
Урок 133. 00:08:01Каркасc React-Redux приложения
-
Урок 134. 00:10:58Роутинг
-
Урок 135. 00:04:38Чтение данных из Redux Store
-
Урок 136. 00:12:04Отправка действий в Redux Store (action dispatch)
-
Урок 137. 00:09:38Стили (опциональное видео)
-
Урок 138. 00:07:49Работа с асинхронными данными
-
Урок 139. 00:07:02Отличия setState() и reducer
-
Урок 140. 00:07:45Обработка ошибок
-
Урок 141. 00:07:07mapDispatchToProps: аргумент ownProps
-
Урок 142. 00:04:21Naming Convention для действий
-
Урок 143. 00:03:40Компоненты-контейнеры
-
Урок 144. 00:10:33Подключение нового компонента к Redux
-
Урок 145. 00:10:07Redux: добавление элементов в массив
-
Урок 146. 00:13:43Redux: обновление элементов в массиве
-
Урок 147. 00:12:17Redux: удаление элементов из массива
-
Урок 148. 00:12:54Организация кода reducer'а
-
Урок 149. 00:11:46Store Enhancers
-
Урок 150. 00:09:51Middleware
-
Урок 151. 00:11:41Thunk
-
Урок 152. 00:02:59Следующие шаги
-
Урок 153. 00:03:09Сборка React приложения
-
Урок 154. 00:06:04Создаём новый проект
-
Урок 155. 00:04:36Установка Babel
-
Урок 156. 00:06:09Плагины Babel
-
Урок 157. 00:04:20Конфигурация Babel (.babelrc)
-
Урок 158. 00:06:55Babel Presets
-
Урок 159. 00:09:10Оптимизация сборки для конкретных браузеров
-
Урок 160. 00:05:55Динамический выбор браузеров (browserslist)
-
Урок 161. 00:04:31Файлы конфигурации browserslist
-
Урок 162. 00:07:33Polyfills
-
Урок 163. 00:03:27Работа с JSX
-
Урок 164. 00:02:32Организация зависимостей
-
Урок 165. 00:04:44Что такое WebPack
-
Урок 166. 00:07:31Установка WebPack
-
Урок 167. 00:04:31Файл конфигурации WebPack
-
Урок 168. 00:08:30Webpack Loader
-
Урок 169. 00:04:26Конфигурация loader'ов
-
Урок 170. 00:02:55Loader'ы для разных типов файлов
-
Урок 171. 00:04:44React и Babel Loader
-
Урок 172. 00:06:17Композиция Loader'ов
-
Урок 173. 00:05:12CSS препроцессоры. Sass.
-
Урок 174. 00:03:05Упрощение синтаксиса webpack.config.js
-
Урок 175. 00:06:27Плагины
-
Урок 176. 00:04:15HtmlWebpackPlugin: использование шаблонов
-
Урок 177. 00:04:49Mini CSS Extract Plugin
-
Урок 178. 00:08:10Wepback Dev Server
-
Урок 179. 00:15:46Конфигурация для production
- Категории
- Источники
- Все курсы
- Разделы
- Книги
Сейчас в основном хуками и функциональным программированием пользуются.
this.setState(({todoData}) => ({
todoData: [...todoData, newItem],
}));
а то Ментр ругатся будет )))
Посилання, яке необхідно добавити у функцію fetch змінилося!
https://swapi.dev/api/people/1/
const data = loading ? :
Можно ли чуточку оптимизировать код? Проверил, работает, но может я чего-то не учел?
Итак, вместо:
const spinner = loading ? : null;
const content = !loading ? : null
...
{spinner}
{content}
заменить на:
const data = loading ? :
...
{data}
Человек занимается отуплением своих учеников, а его код это - оверинжиниринг. (обертка - обертка -обертка - чтоб обертка....)
Да молодец, что рассказывает про базовые функции с примерами, но их применение это ппц.
Читайте лучше оф.доку
toggleProperty(arr, id, prop) {
const item = arr.find(element => element.id === id);
const data = {...item, [prop]: !item[prop]};
return arr.map(todo => todo.id === id ? data : todo);
}
this.setState(({todoData}) => {
return {
todoData: todoData.filter(element => element.id !== id)
}
});
если ты об этом
filter вернет новый массив не мутируя старый.
toggleProp(arr, id, propName){
const idx = arr.findIndex((el) => el.id === id);
const oldItem = arr[idx];
-------> const newItem = {...oldItem, [propName]: [!oldItem.propName]};
console.log(newItem)
const newArray = [
...arr.slice(0, idx),
newItem,
...arr.slice(idx + 1)
]
console.log(newArray)
return newArray
}
Друзья, кто сталкивался?
Unhandled Rejection (TypeError): undefined is not an object (evaluating 'this._extractId')
return {
id: this._extractId(planet),
.......}
если ее закрыть содержимое сайта показывает, но при обновлении постоянно вылазит эта ошибка, кто с этим сталкивался??
спасибо
componentDidMount() {
this.swapiService
.getAllPeople()
.then((peopleList) => {
this.setState({
peopleList
});
});
}
У меня peopleList приходит undefined после запроса к апи, а почему - понять не могу
свапи переехал сюда https://swapi.dev/documentation#people
Где найти этот исходный код?