React
الذهاب إلى القناة على Telegram
Подборки по React js и все что с ним связано. По всем вопросам @evgenycarter
إظهار المزيد2 674
المشتركون
-224 ساعات
-57 أيام
-1230 أيام
أرشيف المشاركات
2 674
useSignal() — будущее веб-фреймворков
Signal - это способ хранения состояния вашего приложения, аналогичный useState() в React. Но есть несколько ключевых отличий, которые дают Signals преимущество.
https://www.builder.io/blog/usesignal-is-the-future-of-web-frameworks
✍️ @React_lib
2 674
❔❔ JS-разработчик?
А насколько хорошо ты знаешь Vue.js? JS-разработчик? А насколько хорошо ты знаешь Vue.js?
✔️ Пройди тест из 20 вопросов и узнай, сможешь ли ты учиться на курсе "Vue.js Developer" от OTUS. Если правильно ответишь хотя бы на 12 вопросов - сможешь поступить на курс по специальной цене!
⏰ Время прохождения теста ограничено 30 минут
✍️ПРОЙТИ ТЕСТ: https://otus.pw/gAzL/
Курс доступен в рассрочку.
🎁 Пройдете успешно тест, получите доступ к открытым урокам курса.
Реклама. Информация о рекламодателе на сайте www.otus.ru
2 674
Будущее рендеринга в React
Популярность React как библиотеки для создания пользовательского интерфейса за последние несколько лет только росла и довольно быстро. На момент написания этой статьи она имеет более 14 миллионов еженедельных загрузок с npm, что, как я знаю, не является корректным показателем популярности библиотеки, но одно только расширение React Devtools chrome имеет более 3 миллионов еженедельных активных пользователей. Тем не менее, шаблоны рендеринга в React практически не менялись до появления React 18.
https://prateeksurana.me/blog/future-of-rendering-in-react/
✍️ @React_lib
2 674
React, я люблю тебя, но ты сводишь меня с ума
Ты у меня не первый. До тебя у меня были длительные отношения с jQuery, Backbone и Angular. Я знал, чего следует ожидать от фреймворка: лучший пользовательский интерфейс, продуктивность и опыт разработки, но также фрустрация от необходимости изменения способа написания кода в угоду парадигме фреймворка.
Когда я тебя встретил, я находился в длительных отношениях с Angular. Я был измотан watch и digest, не говоря уже о scope. Я искал то, что не заставляло бы меня чувствовать себя несчастным.
Rus https://habr.com/ru/companies/timeweb/articles/693072/
Eng https://marmelab.com/blog/2022/09/20/react-i-love-you.html
✍️ @React_lib
2 674
Использование React в приложениях Angular
Два сценария требуют использования React в приложении Angular. Во-первых, в экосистеме React есть компонент, на разработку которого у нас уйдут недели, например, компонент Timeline. Во-вторых, возможно, мы приобрели компанию, использующую React, и нам необходимо интегрировать его в существующее приложение.
В этой статье я покажу, как интегрировать React в обоих случаях. Начнем с самого простого случая, когда нам необходимо использовать компонент React.
https://netbasal.com/using-react-in-angular-applications-1bb907ecac91
✍️ @React_lib
2 674
React рекурсивно рендерит дочерние компоненты, но есть один нюанс
https://alexsidorenko.com/blog/react-render-children-prop/
✍️ @React_lib
2 674
Reactjs
Reactjs Hooks, простыми словами
useEffect hook, простыми словами
Reactjs Hooks изнутри, на модели
useSyncExternalStore hook, простыми словами
источник
✍️ @React_lib
2 674
🚀 Собеседование React Frontend
Собеседование JUNIOR frontend REACT
ТОП 10 вопросов на собеседовании ReactJS
Собеседование ReactJS - вопросы и ответы
источник
✍️ @React_lib
2 674
Как уменьшить размер компонента React: 3 профессиональных приема
В процессе работы многие фрагменты кода увеличиваются настолько, что над ними легко потерять контроль. Речь идет о компонентах React. Обрастание компонента множеством функций, JSX и конфигураций становится одной из главных проблем для тех, кто начинает изучать React. Рассмотрим, как ее избежать.
https://levelup.gitconnected.com/top-3-react-tricks-pros-like-to-use-to-reduce-the-size-of-component-980900370505
✍️ @React_lib
2 674
Планируете начать настраивать среды разработки с Vite.js?
🚀Приходите 30 марта в 20:00 на урок, который пройдет в рамках онлайн-курса «Vue.js разработчик».
Vite отлично подходит для сложных проектов, где требуется взаимодействие с сервером. В отличие от других инструментов, он легко встраивается через терминал и может быстро разворачиваться. Приглашаем всех желающих на открытый урок, на котором рассмотрим миграцию на Vite с Vue CLI, а также его преимущества:
- Мгновенное время запуска сервера разработки
- Горячая замена модулей из коробки
- Простая конфигурация
- Поддержка модулей ES из коробки
👉🏻 Чтобы записаться на урок, пройдите вступительное тестирование https://otus.pw/cBeD/
Курс доступен в рассрочку.
Реклама. Информация о рекламодателе на сайте www.otus.ru
2 674
React.js: Документальный фильм
React - это одна из самых популярных библиотек, используемых сегодня. Учитывая, что она была создана в таком гиганте, как Facebook, можно предположить, что она всегда была обречена на успех.
А что если мы скажем вам, что первое знакомство React с публичной сферой было совсем не гламурным? Документальный фильм React.js: The Documentary расскажет вам полную историю ранних дней React, сосредоточившись на преданной группе разработчиков, которые помогли вывести его на мировую арену. Эту историю рассказывает звездный состав разработчиков, таких как Том Оккино, Кристофер Чедо, Пит Хант, Себастьян Маркбоге, Дэн Абрамов и многие другие.
Загляните на сайт cult.honeypot.io, где собраны нерассказанные истории разработчиков, связанные с открытым исходным кодом, карьерой и другими интересными вещами, которыми занимаются разработчики.
Honeypot - это платформа для трудоустройства разработчиков, цель которой - обеспечить разработчиков отличной работой. Хотите увидеть, что мы собой представляем? Посетите сайт honeypot.io, чтобы найти работу по душе.
источник
✍️ @React_lib
2 674
useSyncExternalStore - The underrated React API
https://thisweekinreact.com/articles/useSyncExternalStore-the-underrated-react-api
✍️ @React_lib
2 674
❔❔ JS-разработчик?
А насколько хорошо ты знаешь Vue.js? JS-разработчик? А насколько хорошо ты знаешь Vue.js?
✔️ Пройди тест из 20 вопросов и узнай, сможешь ли ты учиться на курсе "Vue.js Developer" от OTUS. Если правильно ответишь хотя бы на 12 вопросов - сможешь поступить на курс по специальной цене!
⏰ Время прохождения теста ограничено 30 минут
✍️ПРОЙТИ ТЕСТ: https://otus.pw/wHLA/
Курс доступен в рассрочку.
Реклама. Информация о рекламодателе на сайте www.otus.ru
2 674
⚡️React Performance Optimization: useMemo vs useCallback
https://dev.to/ahmedgmurtaza/react-performance-optimization-usememo-vs-usecallback-2p2a
✍️ @React_lib
2 674
Ключ к хорошему дизайну компонентов - эгоизм
При разработке новой функции, что определяет, будет ли существующий компонент работать или нет? И когда компонент не работает, что именно это означает?
Не работает компонент функционально так, как ожидается, например, система вкладок, которая не переключается на правильную панель? Или он слишком жесткий для поддержки заданного контента, например, кнопка с иконкой после контента вместо перед ним? Или, возможно, он слишком предопределен и структурирован, чтобы поддерживать небольшое отклонение, например, модальное окно, которое всегда имело заголовок, теперь требует варианта без него?
https://www.smashingmagazine.com/2023/01/key-good-component-design-selfishness/
✍️ @React_lib
2 674
🔥Тест по JavaScript от OTUS 🔥
Ответьте на 20 вопросов и проверьте, насколько вы готовы к обучению на курсе - «JavaScript Developer. Professional»
👉 ПРОЙТИ ТЕСТ https://otus.pw/e0Ed/
💣 Пройдете тест и получите:
✔️ Живое общение с экспертами JavaScript-сообщества
✔️Получите видео-курс по Git в подарок
✔️ Лучшие открытые уроки прошлых наборов курса
✔️ Продвинутые темы и практика на «боевых» задачах уровня Middle+
✔️ Скидку на прохождение онлайн курса «JavaScript Developer. Professional»
Курс доступен в рассрочку.
Реклама. Информация о рекламодателе на сайте www.otus.ru
2 674
Все, что вам необходимо знать о конкурентном рендеринге
В React конкурентный рендеринг позволяет разделить быстрые и медленные части приложения, что позволяет рендерить медленные компоненты в фоновом режиме, не блокируя быстрые компоненты, таким образом каждый компонент может реагировать на взаимодействия пользователя в своем собственном темпе.
Чтобы использовать конкурентный рендеринг, необходимо использовать API, такие как переходы -
useTransition или startTransition, а также отложенные значения - useDeferredValue. Эти API помогают пометить обновления стейта с низким приоритетом. Обновления стейта, которые объявляются вне функциональностей конкурентного рендеринга, помечаются как обновления с высоким приоритетом.
Энрике Юджи подробно изучил API конкурентного рендеринга и описал экстремальные случаи использования. Например, важно понимать, что React рендерит в однопоточной среде. Если он начал рендерить компонент, то он будет рендерить его до конца без прерываний. Только по окончании рендеринга компонента React проверит, есть ли какая-либо задача с высоким приоритетом в пуле задач. В результате, следует избегать задач, которые интенсивно используют процессор и выполняются в рамках одного компонента, а не распределены по нескольким компонентам.
https://blog.codeminer42.com/everything-you-need-to-know-about-concurrent-react-with-a-little-bit-of-suspense/
✍️ @React_lib2 674
Data Fetching With Suspense In React
https://blog.openreplay.com/data-fetching-with-suspense-in-react/
✍️ @React_lib
2 674
🚀Не время стоять на месте! Пора прокачать свои навыки в JavaScript-разработке! Если вы хотите перейти в fullstack-направление, приходите 17 марта в 20:00 на открытый урок онлайн-курса «JavaScript Developer. Professional» в OTUS. Арсений Высоцкий, тимлид в большой международной компании, проведет вебинар «Клиенты реляционных баз данных». На занятии мы обсудим ORM и типизированные библиотеки формирования SQL-запросов.
👉🏻Для регистрации на занятие пройдите вступительный тест https://otus.pw/ZpVM/
Курс доступен в рассрочку.
Реклама. Информация о рекламодателе на сайте www.otus.ru
2 674
The Ultimate Form Abstraction
https://www.brendonovich.dev/blog/the-ultimate-form-abstraction
✍️ @React_lib
