Переосмысление лучших практик React
Мы начнем с ознакомления с основными ограничениями React и прошлыми подходами к управлению ими, исследуя основные паттерны и принципы, которые объединяют счастливые приложения React.
К концу мы поймем, как меняются ментальные модели в таких фреймворках React, как Remix и каталог приложений в Next 13.
Давайте начнем с изучения основных проблем, которые мы пытались решить до сих пор. Это поможет нам контекстуализировать рекомендацию основной команды React использовать с React фреймворки более высокого уровня, которые имеют тесную интеграцию между сервером, клиентом и бандлером.
https://frontendmastery.com/posts/rethinking-react-best-practices/
✍️ @React_lib
Мы начнем с ознакомления с основными ограничениями React и прошлыми подходами к управлению ими, исследуя основные паттерны и принципы, которые объединяют счастливые приложения React.
К концу мы поймем, как меняются ментальные модели в таких фреймворках React, как Remix и каталог приложений в Next 13.
Давайте начнем с изучения основных проблем, которые мы пытались решить до сих пор. Это поможет нам контекстуализировать рекомендацию основной команды React использовать с React фреймворки более высокого уровня, которые имеют тесную интеграцию между сервером, клиентом и бандлером.
https://frontendmastery.com/posts/rethinking-react-best-practices/
✍️ @React_lib
Frontendmastery
Rethinking React best practices
A deep dive into the evolution of React from client-side view library to application architecture.
4 совета по React для мгновенного улучшения вашего кода
Я хотел бы поделиться четырьмя советами, которые помогли мне в написании лучшего кода React. Надеюсь, вы найдете для себя что-то новое и полезное. Так что давайте приступим к делу!
https://javascript.plainenglish.io/4-react-tips-to-instantly-improve-your-code-7456e028cfa3
✍️ @React_lib
Я хотел бы поделиться четырьмя советами, которые помогли мне в написании лучшего кода React. Надеюсь, вы найдете для себя что-то новое и полезное. Так что давайте приступим к делу!
https://javascript.plainenglish.io/4-react-tips-to-instantly-improve-your-code-7456e028cfa3
✍️ @React_lib
Prop drilling and component composition in React
https://alexsidorenko.com/blog/react-prop-drilling-composition/
✍️ @React_lib
https://alexsidorenko.com/blog/react-prop-drilling-composition/
✍️ @React_lib
Многопоточное приложение React с использованием useWorker
Если мы выполняем какую-либо требующую больших затрат задачу, она будет блокировать взаимодействие с пользовательским интерфейсом. И пользователю придется ждать, пока она завершится, чтобы выполнить любое другое действие, что создает плохое впечатление от UX.
https://dev.to/nilanth/multi-threaded-react-app-using-useworker-gf8
✍️ @React_lib
Если мы выполняем какую-либо требующую больших затрат задачу, она будет блокировать взаимодействие с пользовательским интерфейсом. И пользователю придется ждать, пока она завершится, чтобы выполнить любое другое действие, что создает плохое впечатление от UX.
https://dev.to/nilanth/multi-threaded-react-app-using-useworker-gf8
✍️ @React_lib
This media is not supported in your browser
VIEW IN TELEGRAM
Media is too big
VIEW IN TELEGRAM
This media is not supported in your browser
VIEW IN TELEGRAM
This media is not supported in your browser
VIEW IN TELEGRAM
This media is not supported in your browser
VIEW IN TELEGRAM
This media is not supported in your browser
VIEW IN TELEGRAM
This media is not supported in your browser
VIEW IN TELEGRAM
This media is not supported in your browser
VIEW IN TELEGRAM
This media is not supported in your browser
VIEW IN TELEGRAM
This media is not supported in your browser
VIEW IN TELEGRAM
Full Modern React Tutorial
#1 - Introduction
#2 - Creating a React Application
#3 - Components & Templates
#4 - Dynamic Values in Templates
#5 - Multiple Components
#6 - Adding Styles
#7 - Click Events
#8 - Using State (useState hook)
#9 - Intro to React Dev Tools
#10 - Outputting Lists
Все видео доступны на youtube
✍️ @React_lib
#1 - Introduction
#2 - Creating a React Application
#3 - Components & Templates
#4 - Dynamic Values in Templates
#5 - Multiple Components
#6 - Adding Styles
#7 - Click Events
#8 - Using State (useState hook)
#9 - Intro to React Dev Tools
#10 - Outputting Lists
Все видео доступны на youtube
✍️ @React_lib
7 небольших и недооцененных библиотек React 🔥
Сегодня я расскажу о 7 небольших и недооцененных библиотеках React, которые я люблю использовать и которые могут понравиться вам.
https://dev.to/naubit/7-small-underrated-react-libraries-h54
✍️ @React_lib
Сегодня я расскажу о 7 небольших и недооцененных библиотеках React, которые я люблю использовать и которые могут понравиться вам.
https://dev.to/naubit/7-small-underrated-react-libraries-h54
✍️ @React_lib
6 подходов к выборке данных в React
Получение данных является ключевым аспектом любого React-приложения. Для разработчиков React очень важно понимать различные подходы к получению данных и понимать, какой из них наиболее подходит для их конкретного случая.
https://dev.to/char_carr_dev/6-approaches-for-data-fetching-in-react-1ec3
✍️ @React_lib
Получение данных является ключевым аспектом любого React-приложения. Для разработчиков React очень важно понимать различные подходы к получению данных и понимать, какой из них наиболее подходит для их конкретного случая.
https://dev.to/char_carr_dev/6-approaches-for-data-fetching-in-react-1ec3
✍️ @React_lib
Передача props компоненту
Компоненты React используют props для взаимодействия друг с другом. Каждый родительский компонент может передавать некоторую информацию своим дочерним компонентам, передавая им props. Props могут напоминать атрибуты HTML, но через них можно передавать любые значения JavaScript, включая объекты, массивы и функции.
https://react.dev/learn/passing-props-to-a-component#passing-jsx-as-children
✍️ @React_lib
Компоненты React используют props для взаимодействия друг с другом. Каждый родительский компонент может передавать некоторую информацию своим дочерним компонентам, передавая им props. Props могут напоминать атрибуты HTML, но через них можно передавать любые значения JavaScript, включая объекты, массивы и функции.
https://react.dev/learn/passing-props-to-a-component#passing-jsx-as-children
✍️ @React_lib
react.dev
Passing Props to a Component – React
The library for web and native user interfaces
Антипаттерны и лучшие практики React - "за" и "против
Может показаться, что React - один из наименее подверженных влиянию мнений фреймворков на Диком Западе Web. Несмотря на это, существует множество ошибок, которые можно совершить, и еще больше вещей, которые можно сделать, чтобы написать чистый и читабельный код. В этой статье рассказывается о 17 распространенных антипаттернах и лучших практиках в React.
https://dev.to/perssondennis/react-anti-patterns-and-best-practices-dos-and-donts-3c2g
✍️ @React_lib
Может показаться, что React - один из наименее подверженных влиянию мнений фреймворков на Диком Западе Web. Несмотря на это, существует множество ошибок, которые можно совершить, и еще больше вещей, которые можно сделать, чтобы написать чистый и читабельный код. В этой статье рассказывается о 17 распространенных антипаттернах и лучших практиках в React.
https://dev.to/perssondennis/react-anti-patterns-and-best-practices-dos-and-donts-3c2g
✍️ @React_lib
Создание и отправка электронных писем с помощью React
Коллекция высококачественных нестилевых компонентов для создания красивых электронных писем с использованием React и TypeScript. Благодаря поддержке темного режима он снижает сложность создания отзывчивых писем. Кроме того, он позаботится о несоответствиях между Gmail, Outlook и другими почтовыми клиентами.
https://github.com/resendlabs/react-email
✍️ @React_lib
Коллекция высококачественных нестилевых компонентов для создания красивых электронных писем с использованием React и TypeScript. Благодаря поддержке темного режима он снижает сложность создания отзывчивых писем. Кроме того, он позаботится о несоответствиях между Gmail, Outlook и другими почтовыми клиентами.
https://github.com/resendlabs/react-email
✍️ @React_lib
Media is too big
VIEW IN TELEGRAM
Media is too big
VIEW IN TELEGRAM
Media is too big
VIEW IN TELEGRAM
Media is too big
VIEW IN TELEGRAM
Media is too big
VIEW IN TELEGRAM
Media is too big
VIEW IN TELEGRAM
Media is too big
VIEW IN TELEGRAM
Media is too big
VIEW IN TELEGRAM
Media is too big
VIEW IN TELEGRAM
Media is too big
VIEW IN TELEGRAM
React
React Custom Hooks - Пишем компонент прогресса чтения
React - Компонент сравнения картинок со слайдером на TypeScript
Мобильное меню с бесконечной вложенностью на React и TypeScript
React и TypeScript - как писать tsx чище?
Разбор Next 13 - урок по работе с app, turbopack, font, SSR
Модальное окно (popup) на React с Headless UI
Что нового в React Router 6.4+?
Solid js - signals, createEffect, createResource. Круче React?
React Hook Form - простая работа с формами
Разбор Next.js Server Actions!
PurpleSchool | Anton Larichev
источник
✍️ @React_lib
React Custom Hooks - Пишем компонент прогресса чтения
React - Компонент сравнения картинок со слайдером на TypeScript
Мобильное меню с бесконечной вложенностью на React и TypeScript
React и TypeScript - как писать tsx чище?
Разбор Next 13 - урок по работе с app, turbopack, font, SSR
Модальное окно (popup) на React с Headless UI
Что нового в React Router 6.4+?
Solid js - signals, createEffect, createResource. Круче React?
React Hook Form - простая работа с формами
Разбор Next.js Server Actions!
PurpleSchool | Anton Larichev
источник
✍️ @React_lib