React

React.js: Документальный фильм React - это одна из самых популярных библиотек, используемых сегодня. Учитывая, что она была создана в таком гиганте, как Facebook, можно предположить, что она всегда была обречена на успех. А что если мы скажем вам, что первое знакомство React с публичной сферой было совсем не гламурным? Документальный фильм React.js: The Documentary расскажет вам полную историю ранних дней React, сосредоточившись на преданной группе разработчиков, которые помогли вывести его на мировую арену. Эту историю рассказывает звездный состав разработчиков, таких как Том Оккино, Кристофер Чедо, Пит Хант, Себастьян Маркбоге, Дэн Абрамов и многие другие. Загляните на сайт cult.honeypot.io, где собраны нерассказанные истории разработчиков, связанные с открытым исходным кодом, карьерой и другими интересными вещами, которыми занимаются разработчики. Honeypot - это платформа для трудоустройства разработчиков, цель которой - обеспечить разработчиков отличной работой. Хотите увидеть, что мы собой представляем? Посетите сайт honeypot.io, чтобы найти работу по душе. источник ✍️ @React_lib

useSyncExternalStore - The underrated React API https://thisweekinreact.com/articles/useSyncExternalStore-the-underrated-react-api ✍️ @React_lib

❔❔ JS-разработчик? А насколько хорошо ты знаешь Vue.js? JS-разработчик? А насколько хорошо ты знаешь Vue.js? ✔️ Пройди тест из 20 вопросов и узнай, сможешь ли ты учиться на курсе "Vue.js Developer" от OTUS. Если правильно ответишь хотя бы на 12 вопросов - сможешь поступить на курс по специальной цене! ⏰ Время прохождения теста ограничено 30 минут ✍️ПРОЙТИ ТЕСТ: https://otus.pw/wHLA/ Курс доступен в рассрочку. Реклама. Информация о рекламодателе на сайте www.otus.ru

⚡️React Performance Optimization: useMemo vs useCallback https://dev.to/ahmedgmurtaza/react-performance-optimization-usememo-vs-usecallback-2p2a ✍️ @React_lib

Ключ к хорошему дизайну компонентов - эгоизм При разработке новой функции, что определяет, будет ли существующий компонент работать или нет? И когда компонент не работает, что именно это означает? Не работает компонент функционально так, как ожидается, например, система вкладок, которая не переключается на правильную панель? Или он слишком жесткий для поддержки заданного контента, например, кнопка с иконкой после контента вместо перед ним? Или, возможно, он слишком предопределен и структурирован, чтобы поддерживать небольшое отклонение, например, модальное окно, которое всегда имело заголовок, теперь требует варианта без него? https://www.smashingmagazine.com/2023/01/key-good-component-design-selfishness/ ✍️ @React_lib

🔥Тест по JavaScript от OTUS 🔥 Ответьте на 20 вопросов и проверьте, насколько вы готовы к обучению на курсе - «JavaScript Developer. Professional» 👉 ПРОЙТИ ТЕСТ https://otus.pw/e0Ed/ 💣 Пройдете тест и получите: ✔️ Живое общение с экспертами JavaScript-сообщества ✔️Получите видео-курс по Git в подарок ✔️ Лучшие открытые уроки прошлых наборов курса ✔️ Продвинутые темы и практика на «боевых» задачах уровня Middle+ ✔️ Скидку на прохождение онлайн курса «JavaScript Developer. Professional» Курс доступен в рассрочку. Реклама. Информация о рекламодателе на сайте www.otus.ru

Все, что вам необходимо знать о конкурентном рендеринге В 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_lib

Data Fetching With Suspense In React https://blog.openreplay.com/data-fetching-with-suspense-in-react/ ✍️ @React_lib

🚀Не время стоять на месте! Пора прокачать свои навыки в JavaScript-разработке! Если вы хотите перейти в fullstack-направление, приходите 17 марта в 20:00 на открытый урок онлайн-курса «JavaScript Developer. Professional» в OTUS. Арсений Высоцкий, тимлид в большой международной компании, проведет вебинар «Клиенты реляционных баз данных». На занятии мы обсудим ORM и типизированные библиотеки формирования SQL-запросов. 👉🏻Для регистрации на занятие пройдите вступительный тест https://otus.pw/ZpVM/ Курс доступен в рассрочку. Реклама. Информация о рекламодателе на сайте www.otus.ru

The Ultimate Form Abstraction https://www.brendonovich.dev/blog/the-ultimate-form-abstraction ✍️ @React_lib

Understanding useMemo and useCallback https://www.joshwcomeau.com/react/usememo-and-usecallback/ ✍️ @React_lib

Learn React Router v6 In 45 Minutes 00:00 - Introduction 00:45 - Basics 06:18 - Router Types 10:22 - Dynamic Routes 13:40 - Route Specificity 16:46 - Nested Routes 28:54 - useRoutes Hooks 30:32 - Link Component 32:50 - NavLink Component 35:57 - Navigate Component 36:39 - useNavigate Hook 39:07 - Search Parameters 43:16 - Navigation State ✍️ @React_lib

Frontend meetup (Online) 1. Быть Senior Frontend Developer в 2023: Экспертиза, карьера и общество — Александр Гузенко, IT_ONE В докладе попробуем систематизировать средние по палате необходимые требования к Senior Frontend Developer к 2023 году. Разберем, чем синьор отличается от мидла, посмотрим на хард скилы, софт скилы, точки роста для синьора. 2. CLI для фронтендеров. Делаем лучше, а не хуже — Алексей Попков, Толока В докладе поговорим, как превратить скриптописательство в системный подход, какие есть основные критерии качества, и как сделать инструмент, которому будет рада вся команда. 3. Обзор полезных инструментов разработчика — Павел Теренин, Juniper Square В моем докладе инструменты разделены на две секции: инструменты для отладки верстки и стилей, и инструменты для отладки кода и оптимизации быстродействия. ➖➖➖ 🗓 15 марта, начало в 19:00 мск, Среда 🌐 ОНЛАЙН ✅ Регистрация на мероприятие

Avoiding useEffect with callback refs https://tkdodo.eu/blog/avoiding-use-effect-with-callback-refs ✍️ @React_lib

React: полное руководство по повторному рендерингу https://www.developerway.com/posts/react-re-renders-guide ✍️ @React_lib

8 Mistakes every junior React developer makes https://kusham1998.medium.com/8-mistakes-every-junior-react-developer-makes-7ceace725d36 ✍️ @React_lib

🚀Как JavaScript-разработчику использовать XState? Узнаем 3 марта в 20:00 на открытом уроке онлайн-курса «JavaScript Developer. Professional» в OTUS. 😎Тема вебинара: «Управление сложным состоянием на основе XState». XState — это инструмент для создания и проверки диаграмм состояний для визуализации состояния ваших приложений. Вместе с преподавателем Арсением Высоцким, тимлидом в большой международной компании, научимся описывать бизнес-логику посредством конечных автоматов. 👉Пройдите вступительный тест, чтобы принять участие в занятии https://otus.pw/lZmN/ Курс доступен в рассрочку. Реклама. Информация о рекламодателе на сайте www.otus.ru

Использование шаблонов проектирования группы GoF в React В этой статье поговорим о том, как написать в React многократно используемый код, используя три шаблона проектирования группы Gang-of-Four. Rus https://habr.com/ru/company/rshb/blog/680770/ Eng https://blog.bitsrc.io/using-gof-design-patterns-with-react-c334f3ea3147 ✍️ @React_lib

React re-renders guide: everything, all at once https://www.developerway.com/posts/react-re-renders-guide ✍️ @React_lib

The Best React Design Patterns You Should Know About https://www.uxpin.com/studio/blog/react-design-patterns ✍️ @React_lib