متاح الآن! بحث تيليغرام 2025 — أهم رؤى العام 
React
الذهاب إلى القناة على Telegram
Подборки по React js и все что с ним связано. По всем вопросам @evgenycarter
إظهار المزيد2 730
المشتركون
لا توجد بيانات24 ساعات
-57 أيام
-930 أيام
أرشيف المشاركات
2 730
⚛️ Совет по React: Если вам нужно импортировать серверный компонент в клиентском компоненте, передайте его как prop (children) ↓
#react
✍️ @React_lib
2 730
⚛️ Совет по React: Используйте кастомный хук для управления состояниями массивов в ваших компонентах.
#react
✍️ @React_lib
2 730
‼️Тест по React JS от OTUS
— Ответьте на 30 вопросов и проверьте, насколько хорошо вы знаете язык.
Сможете сдать — пройдёте на продвинутый онлайн-курс по React.js по спец. цене!
👉ПРОЙТИ ТЕСТ - https://vk.cc/czLjo4
Курс доступен в рассрочку.
❇️ Пройдите тест и получите:
✔️ Живое общение с экспертами
✔️Получите видео-курс по Git в подарок
✔️ Лучшие открытые уроки прошлых наборов курса
✔️ Продвинутые темы и практика на «боевых» задачах уровня Middle+
✔️ Скидку на прохождение онлайн курса «React.js Developer»
Реклама. ООО «Отус онлайн-образование», ОГРН 1177746618576, www.otus.ru
2 730
⚛️ Знаете ли вы, как и когда использовать flushSync в React?
Используйте
flushSync, чтобы принудительно выполнить немедленный рендеринг обновлений, обходя обычную пакетную отрисовку.
Полезно при интеграции с сторонним кодом, таким как браузерные API или UI-библиотеки.
#react
✍️ @React_lib2 730
⚛️ Как типизировать обобщенные компоненты в React с помощью TypeScript
#react
✍️ @React_lib
2 730
⚛️ Знали ли вы, что можно использовать пересечение типов для легкого расширения нативных свойств элементов в React
#react
✍️ @React_lib
2 730
❓Хотите узнать, как эффективно управлять состоянием в React.js с помощью хуков useState и useReducer?
Ждем вас на открытом вебинаре 20 августа в 19:00 мск, где мы разберём:
- основы управления состоянием в React.js с помощью хуков useState и useReducer;
- различия и преимущества использования useState и useReducer;
- практические примеры применения хуков для управления состоянием в реальных приложениях.
Урок будет полезен как новичкам, знакомым с базовыми концепциями React, так и опытным разработчикам, которые хотят улучшить свои навыки управления состоянием.
Встречаемся в преддверии старта курса «React.js Developer». Все участники вебинара получат специальную цену на обучение!
👉 Регистрируйтесь прямо сейчас, чтобы не пропустить бесплатный урок: https://vk.cc/czugnB
Реклама. ООО «Отус онлайн-образование», ОГРН 1177746618576, www.otus.ru
2 730
Полиморфизм в React: 2 паттерна, которые нужно знать
Независимо от того, создаете ли вы библиотеку или разрабатываете React-компоненты для своих нужд, есть один прием, который вам необходимо знать: полиморфизм. Это когда один элемент может принимать несколько форм, например, когда кнопка может выступать в роли ссылки. При правильном использовании это может избавить вас от необходимости поддерживать множество вариантов компонентов, одновременно предоставляя пользователям необходимую гибкость.
В этом тексте я покажу вам, как использовать два наиболее известных способа реализации полиморфизма в React: паттерны "as" и "asChild".
https://www.bekk.christmas/post/2023/1/polymorphism-in-react
#react
✍️ @React_lib
2 730
Дублирование JSX - верный признак того, что вам нужно создать компонент.
Дублирование логики в компонентах - верный признак того, что вам, возможно, нужно создать пользовательский хук.
Обратите внимание на слово *может*
#react
✍️ @React_lib
2 730
⚛️ useEffect становится проще в React, когда вы перестаете использовать его для:
1. Выведения/вычисления нового состояния.
2. Инициализации состояния на основе props.
3. Получения данных.
Вместо этого:
1. Делайте это в рендере.
2. Инициализируйте состояние в useState.
3. Используйте либо обработчики событий, либо react-query для этого.
#react
✍️ @React_lib
2 730
⚛️ Быстрый совет по React
❌ Преобразование данных в useEffect.
✅ Делаем это во время рендеринга ↓
#react
✍️ @React_lib
2 730
❓React-компоненты работают медленно и требуют оптимизации? Хотите узнать, как сделать их быстрыми и эффективными?
Ждем вас на открытом вебинаре «Оптимизация работы компонентов в React.js» 6 августа в 19:00 мск, где мы разберём:
- как работать с оптимизацией в React.js;
- особенности работы функциональных компонентов и хуков;
- трюк с мемоизацией коллбеков для списка элементов.
Урок будет полезен как начинающим разработчикам React, так и опытным специалистам, которые хотят глубже изучить процесс мемоизации.
Встречаемся в рамках курса «React.js Developer». Все участники вебинара получат специальную цену на обучение!
👉 Регистрация открыта: https://otus.pw/AXnVY/?erid=2VtzqwfLhcF
Реклама. ООО «Отус онлайн-образование», ОГРН 1177746618576, www.otus.ru
2 730
Самый быстрый способ передачи state в JavaScript
В приложениях Redux с серверным рендерингом часто приходится передавать state магазина с сервера на клиент. Передача больших state может быть медленной, поэтому в 2019 году Хенрик Йоретаг провел бенчмаркинг трех подходов, чтобы определить наиболее производительный способ:
// "Plain object":
window.__STATE__ = {"foo":"bar"}
// "Invalid mime type":
<script type="mime/invalid" id="myState">{"foo":"bar"}</script>
window.__STATE__ = JSON.parse(window.myState.innerHTML)
// "Just parse":
window.__STATE__ = JSON.parse("{\"foo\":\"bar\"}")2 730
⚛️ Совет React 💡
Используйте строковые литералы + тип union в typescript для указания точных строковых значений в props
#react
✍️ @React_lib
2 730
⚛️ Совет по React + Typescript
Вы можете использовать `
typeof` для типизации предполагаемых типов
#react
✍️ @React_lib