Semantic UI React

Эта библиотека содержит длинный список готовых компонентов, разработанных таким образом, чтобы способствовать производству семантически правильного кода.

Оригинальная версия библиотеки работала на основе HTML и CSS с небольшими вкраплениями JavaScript. Вы определяли свои HTML-элементы, задавали подготовленные CSS-классы и вызывали подходящую JavaScript-функцию.

Теперь, благодаря добавленной совместимости с React, вы при помощи JSX-кода напрямую определяете компоненты и связываете их с кодом React Component. То есть, вам не нужно волноваться о выборе правильного элемента и добавлять код: «реактивный» подход все это значительно упрощает.

👉 @sWebDev

Используем GPU для повышения производительности JavaScript

https://habr.com/ru/company/vdsina/blog/555994/

⚙️Изучение React Native

▪️Урок #1 – Разработка мобильного приложения на JavaScript - Смотреть
▪️Урок #2 – Создание проекта. Запуск на Андроид и iOS - Смотреть
▪️Урок #3 – Основные компоненты (View, Text, Button, Alert, Image) - Смотреть
▪️Урок #4 – Написание стилей для приложения - Смотреть
▪️Урок #5 – Создание списка дел (Todo List) - Смотреть

@IT_1ess0ns

useStateMachine — Хук конечного автомата для React

https://github.com/cassiozen/useStateMachine

React в 3D: как использовать react-three-fiber

Популярная JavaScript-библиотека Three.js позволяет работать с 3D-графикой и анимацией, про неё слышали многие. Но знаете ли вы, что существует библиотека, которая объединяет в себе возможности React и Three.js?

Называется эта библиотека react-three-fiber и в этой статье автор показал, как с ней работать:

https://tprg.ru/tuQb

#react #фронтенд

useClippy

useClippy - это React хук, который позволяет читать и писать в буфер обмена пользователя. Особенно полезно для улучшения UX; позволяет уберечь пользователей от двойного щелчка по полям данных, предоставив им кнопку для копирования значений.

👉 @sWebDev

​​Пять лучших кастомных хуков React

Разработчик Брайан Арриета опубликовал в блоге на dev.to пять лучших, на его взгляд, кастомных React Hooks.

https://highload.today/pyat-luchshih-kastomnyh-huka-react/?utm_source=telegram&utm_medium=social&utm_campaign=telega

#React #ReactHooks #JavaScript

Как реализовать аутентификацию в Next.js с Auth0

https://www.smashingmagazine.com/2021/05/implement-authentication-nextjs-auth0/

Если вы только недавно приступили к изучению React, то эта статья то, что вам нужно!

В статье пошагово расписано создание полноценного WYSIWYG редактора и как следствие, помимо самого создания вы приобщаетесь и к архитектуре кода и знакомитесь ближе с хуками... В общем, одни преимущества.

Читать -> тут.

#react

🔥 @ProstoRazrabotka

​​Как интегрировать серверный рендеринг в React-приложение, и зачем он вообще там нужен

Серверный рендеринг (server-side rendering) — это техника рендеринга одностраничного приложения или сайта на сервере, а не в клиентском браузере. В компании RubyGarage рассказывают, как это может помочь улучшению пользовательского опыта, SEO-оптимизации и росту трафика.

https://highload.today/kak-integrirovat-servernyj-rendering-v-react-prilozhenie-i-zachem-on-voobshhe-tam-nuzhen/?utm_source=telegram&utm_medium=social&utm_campaign=telega

Пишем реклакс игрушку на JS.

Особенности работы с событиями для desktop и mobile устройств.

https://jem-space.ru/le-popit-dlia-biednykh/

react-dnd

Крутой Drag&Drop для React.
Набор утилит, которые позволяют создавать сложные интерфейсы с перетаскиванием, сохраняя при этом отвязывание компонентов.

Отличительные особенности:
1. идеально подходит для таких приложений, как Trello и Storify, где перетаскивание отвечает за передачу данных между различными частями приложения;
2. построен поверх Drag&DropHTML5;

👉 @sWebDev

react-content-loader

Набор компонентов для легкого создания skeleton loadings (как загрузка карты в Facebook).

Отличительные особенности:
1. Plug and play: поставляется с большим количеством пресетов для использования.
2. DIY: можно использовать данный софт, чтобы создавать собственные загрузчики.
3. Поддержка React Native: тот же API с теми же мощными функциями.
4. Легковесный: менее 2 КБ и 0 зависимостей для веб-версии.

👉 @sWebDev

TypeScript: Modern JavaScript Development

Автор: Remo H. Jansen, Vilic Vane, Ivo Gabe de Wolff
Год издания: 2016

Скачать книгу

#TypeScript #english

Responsive React Dashboard with Tailwind - приборная панель какого-нибудь инвестиционного сайта или что-то подобное. Можно взять некоторые элементы UI на заметку.

https://codepen.io/dilums/pen/ZEBowxX

React.js курс для начинающих, 2-е издание

Автор: Максим Пацианский
Год издания:2018

Скачать книгу

#react #русский

⚛️ 5 продвинутых паттернов React-разработки

Обзор пяти современных передовых шаблонов разработки на React с их достоинствами и недостатками, а также примерами кода.

https://proglib.io/w/2a3d9c5f

#react