Повний курс по React. Частина 2 - React Hooks

preview_player
Показать описание
Частина друга - React Hooks. В даному курсі ми розглянемо всі Реакт хуки які йдуть з коробки. Їх всього лише 10, з яких 3 базових та 7 додаткових. Також, ми створимо декілька своїх власних хуків (кастомних) та напишемо на це все юніт тести.

React зараз дуже хайпова тема, дуже популярний і його знання являється прекрасним бонусом в пошуках роботи JavaScript розробником.

Свій трирічний досвід викладу в даному курсі з трьох частин.

Друга частина:
00:00 Вступ
08:34 useState hook
34:38 useEffect hook
59:44 Form component Unit tests
01:30:49 Home component Unit tests
01:59:47 useContext hook
02:16:08 useReducer hook
02:22:22 Створюємо App Context (Redux аналог)
02:34:34 Створюємо Settings сторінку
02:43:26 useCallback hook
03:11:02 useMemo hook
03:20:40 useRef hook
03:32:00 useImperativeHandle hook
03:34:36 useLayoutEffect hook
03:37:05 useDebugValue hook
03:37:59 Створюємо кастомні хуки
03:39:46 useBooleanToggle кастомний хук
03:40:38 SVG картинки в роботі з React
03:59:48 Як працюють кастомні хуки
04:00:40 Продовжуємо useBooleanToggle hook
04:07:44 useBooleanToggle hook Unit tests
04:19:21 useData кастомний хук
04:46:43 useData hook Unit tests
05:01:47 Підсумки другої частини

Буду вдячний за підтримку каналу:
або так - 5375 4114 0505 7287
Приват банк - 5363 5426 0316 4386

Підготовчий курс по JavaScript для роботи з React

Корисні посилання:

Давайте дружити:

#React #ReactJS #MaksymRudnyi
Рекомендации по теме
Комментарии
Автор

Друзі, дякуємо автору донатиком за цінний навчальний контент! 💕

heavydirtysoul
Автор

5 годин і 5 хвилин. Оце я розумію підхід. Академічний 💪

heavydirtysoul
Автор

Оооо...мотивація дійти швидко до кінця 1 частину і почати 2!) Дякую, Максим!

oleksandrvoron_ko
Автор

Тести це було круто! Завтра почну все спочатку розбиратися, бо на компонеті Home зрозумів, що щось десь попропускав. Попробую з другого заходу розібратися. Люблю такі речі. Я чомусь думав, що тести тестувальники пишуть для себе. Максим, спасибі за урок.

sergeydanilyuk
Автор

О як вчасно новий курс прилетів. Вихідні будуть пізнавальні :) Дякую!

pavlopotapenko
Автор

Дякую за курс. Чекаю на третю частину.

sakharuk
Автор

дякую за частину 2!!! міцного здоров'я автору!

sandryeyev
Автор

Дякую за якісний контент по React.js. Якраз почав вивчати хуки, а тут all inclusive.

olegvintoniuk
Автор

Дякую за продовження. Все як завжди детально та зрозуміло роз'яснено. Успіхів.

yaroslavbozhak
Автор

хочу дополнить важную информацию, по поводу тестирования, такая же проблема были и в конце первой части в разделе про тестирования, там я просто посмотрел про тестирование, вылетела ошибка, я не нашел тогда быстрого решения и промотал эту часть. а сейчас решил разобраться

1. вызов этой строки приводит к ошибке:
npm i --save-dev enzyme enzyme-adapter-react-16
теперь не нужно устанавливать enzyme-adapter-react-16

2. чтобы все заработало, нужно немного изменить файл setupTests.js - должно получится вот так:
import Enzyme, { EnzymeAdapter } from "enzyme";

Enzyme.configure({
adapter: new EnzymeAdapter(),
});

сейчас у меня установлен Реакт 17.0.2, а на видео 17.0.1.
потратил на это 2 часа, и печально, что в документации этого еще нет. Было бы здорово добавить сноску в описании и может пометку в репозитории сделать.

PS. скриншоты ошибок скинул в Телеграм.

MrRomanSmal
Автор

Дякую за доступне пояснення та вклад в україномовний контент!

stepan
Автор

Дякую за курс. Дуже цікаво яким чином React перевіряє, що hook є на верхньому рівні. Виходить що він якось парсить функцію і виконує якусь свою валідацію

yuriikoval
Автор

Дуже вам дякую за цю велику працю для нас !!!

sxbnglp
Автор

Не здається що відео по 5год трохи занадто?)
як записувати, так і дивитись)
ну записувати це чисто вже Ваше рішення, але дивитись 5годинне відео трохи напряжно, можна ставити на паузи так, але все таки...
радив би порізати хоча б по 1 год, чи по тим же таймкодам, + більше переглядів буде, бо кожне відео будуть дивитись)
чисто моя думка, не хотів нікого ображати або що
Всім добра :)

VasylBatih
Автор

Чудове відео. Таке питання. Чи рекомендовано використовувати TypeScript з React?

andriyilnytskyy
Автор

useEffect приймає другим параметром масив залежностей на зміну яких треба викликати колбек. А чи є якийсь хук котрий приймає масив предикатів?

Зараз я знайшов рішення по типу:
const isRefreshed = didRefresh(data); // (any) => boolean
useEffect(() => {
if (isRefreshed) {
// some action
}
}, [isRefreshed]);

Але виглядає воно так собі

yuriikoval
Автор

Дякую за продовження. Виникла проблема в минулій частині коли ми встановили serve. Я повторював все точно так само, консоль виводила все так само, але коли я писав serve build вибивало помилку. command not found, але я декілька разів писав yarn global add serve і помилки ніякої не було.

dima
Автор

Максим, мені здається у прикладі використання useEffect було допущенно помилку у логиці перерендерингу (невірно інкрементуються кліки)

maxchuhryaev
Автор

Максим, є зауваження, звук занадто тихий, часом буває так що треба прислузатися. Це так щоб покращити якість на майбутнє. Якщо є труднощі, можу допомогти, показати, як підняти гучність в редакторі. Дякую за чудовий урок

yaremaostrovskiy
Автор

Скажіть, які вимоги ноута потрібні, яка мінімальна вінда має бути?

btsteqv