Как создать CAROUSEL/СЛАЙДЕР на ReactJS с нуля
#React #ReactJS
Это видео - первая часть из серии о том как создать компонент слайдер на React JS. В этом видео создадим компонент carousel (или image slider, карусель, слайдер) на ReactJS, рассмотрим схему html элементов и css классов, а также разберемся в принципах работы компонента carousel.
Еще плейлисты по ReactJS:
💡 Как создать слайдер на ReactJS: • 🎪 Как создать СЛАЙДЕР на ReactJS
💡 Как пройти собеседование по ReactJS: • 🚀 Собеседование React Frontend
Мы в соцсетях:
👉 Сайт: https://it-dev-journal.ru
💻 Telegram: https://t.me/devmagazinechannel
☕️ Поддержать: https://www.donationalerts.com/r/devm...
📃 Исходный код: https://t.me/devmagazinechannel/164
00:00 - О компоненте carousel
00:26 - Схема компонента carousel
02:01 - Как перемещаются страницы в компоненте carousel
04:10 - API и использование компонента carousel
06:34 - Разработка компонента carousel - базовая разметка
08:44 - Добавляем стили
10:38 - Обновляем размер страниц
14:12 - Показываем только текущую страницу
14:42 - Добавляем кнопки навигации
16:48 - Добавляем изменение смещения страниц
18:44 - Обработчик кнопки "на право"
20:18 - Обработчик кнопки "на лево"
21:12 - Валидация значения смещения
23:52 - Анимация перемещения
#devmagazine #devmagazinechannel
