#React #ReactJS Текстовая версия 👉
В этом выпуске напишем простой и полезный кастомный хук для изменения темы приложения на React JS. Используем CSS переменные, синхронизируем тему приложения с темой самой системы, сохраним в localStrorage и добавим плавные переходы при переключении темы. Узнаем о том как сделать ночной режим в React приложениях, как сделать темную тему на сайте, как сделать темную тему на React при помощи хуков. Мы в соцсетях: 👉 Сайт:
💻 Telegram:
💻 Twitter: / _devmagazine 💻 GitHub:
☕️ Поддержать канал:
https://www.donationalerts.com/r/devm... 📃 Исходный код:
Курсы и плейлисты: 💡 Tailwind: • 🍃 TailwindCSS курс 💡 Redux Saga: • 🍏 Redux Saga курс 💡 Все о ReactJS: • 📘 ReactJS 💡 Как пройти ReactJS собеседование: • 🚀 Собеседование React Frontend 💡 ReactJS хуки: • 🐠 React хуки 💡 Redux: • ☕️ Redux курс 💡 Как создать слайдер на ReactJS: • 🎪 Как создать СЛАЙДЕР на ReactJS 💡 Svelte: • 🌴 Svelte курс 💡 Sass: • 📔 Sass курс 💡 GraphQL: • 💪 GraphQL 💡 JavaScript: • 📜 JavaScript 00:00 - О примере: Форма подписки 00:40 - Принцип переключения темы 00:56 - Добавляем правила для атрибут data-theme 01:31 - Добавляем css переменные к свойствам элементов 03:07 - Пишем начальную имплементацию хука useTheme 05:16 - Добавляем обработчики кликов для переключения тем 05:42 - Сохраняем значения в local storage 06:43 - Синхронизируем тему с темой системы 08:44 - Добавляем плавные переходы при переключении темы #devmagazine #devmagazinechannel
