Примеры использования React ref callback

https://julesblom.com/writing/ref-callback-use-cases

✍️ @React_lib

Возможно, вам не нужен эффект

Эффекты - это люк для выхода из парадигмы React. Они позволяют вам "выйти за пределы" React и синхронизировать ваши компоненты с какой-либо внешней системой, например, с не-React виджетом, сетью или DOM браузера. Если внешняя система не задействована (например, если вы хотите обновить состояние компонента при изменении некоторых реквизитов или состояния), вам не нужен Эффект. Удаление ненужных Эффектов сделает ваш код более понятным, быстрым в исполнении и менее подверженным ошибкам.

https://beta.reactjs.org/learn/you-might-not-need-an-effect

✍️ @React_lib

Вещи, которые полезно знать о React.js

Несколько слов о мотивации написать эту статью. Большинство вещей, о которых я тут хочу рассказать, вы можете узнать из документации React. Но проводя собеседования последние пару лет я понял, что многие разработчики о них не знают по каким-то причинам, может просто не вчитывались внимательно или этому не уделено достаточного внимания в самой документации. Так что я решил собрать тут несколько моментов и разобрать их, чтобы тот кто прочитает эту статью, начал понимать React чуть лучше и стал более осознанно использовать те или иные инструменты в работе. Так же это будет полезно тем, кто хочет подготовиться к собеседованию и не ударить в грязь лицом, когда их будут гонять по реакту.

https://habr.com/ru/post/679452/

✍️ @React_lib

Learning React
Авторы: Alex Banks, Eve Porcello (2020)

Если вы хотите научиться создавать эффективные веб-приложения на React, данная книга для вас. Эта обновленная версия также идеально подходит для веб-разработчиков и инженеров-программистов, которые знают основы JavaScript, CSS и HTML. В ней представлены передовые практики и шаблоны для написания современного кода на React. Никаких предварительных знаний о React или функциональном JavaScript не требуется.

✍️ @React_lib

Как создать Star Rating виджет на React.js и оптимизировать его

В этой статье я хочу затронуть еще одну задачу, с которой вы можете столкнуться на собеседовании на позицию Front-End — создание Star Rating виджета.

За последние пять месяцев у меня было 15 онсайт собеседований, а также офферы от Google, Roku, Microsoft и других компаний.

Вы должны уточнить требования и реализовать этот виджет в течение ~ 45–50 минут.

Rus https://habr.com/ru/post/678478/

Eng https://betterprogramming.pub/how-to-implement-star-rating-widget-with-react-js-and-optimize-it-e3625f3104f

✍️ @React_lib

Simple React Component That Makes Titles More Readable

https://github.com/shuding/react-wrap-balancer

✍️ @React_lib

Использование шаблонов проектирования группы GoF в React

В этой статье поговорим о том, как написать в React многократно используемый код, используя три шаблона проектирования группы Gang-of-Four.

https://blog.bitsrc.io/using-gof-design-patterns-with-react-c334f3ea3147

✍️ @React_lib

✨React-bits

Коллекция паттернов, антипаттернов, советов и полезных ресурсов для React-разработчиков.

https://github.com/vasanthk/react-bits

✍️ @React_lib

Работа с ошибками как профессионал в TypeScript

Обработка ошибок в Type/JavaScript - это тема, которой не уделяется должного внимания. Для долговечности любого проекта очень важно отлавливать и регистрировать ошибки.

С годами, когда я начал больше работать с TypeScript, я начал понимать, что не совсем понимаю обработку ошибок. Я часто сталкивался с этой проблемой:

https://engineering.udacity.com/handling-errors-like-a-pro-in-typescript-d7a314ad4991

✍️ @React_lib

The Easiest React Hook

00:00 - Introduction
00:30 - Why this hook is needed
02:25 - How to use the useId hook
04:03 - querySelector gotcha
05:08 - How to use the useId hook with multiple ids

✍️ @React_lib

The Best React Design Patterns You Should Know About

https://www.uxpin.com/studio/blog/react-design-patterns

✍️ @React_lib

React re-renders guide: everything, all at once

https://www.developerway.com/posts/react-re-renders-guide

✍️ @React_lib

Использование шаблонов проектирования группы 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

8 Mistakes every junior React developer makes

https://kusham1998.medium.com/8-mistakes-every-junior-react-developer-makes-7ceace725d36

✍️ @React_lib

React: полное руководство по повторному рендерингу

https://www.developerway.com/posts/react-re-renders-guide

✍️ @React_lib

Avoiding useEffect with callback refs

https://tkdodo.eu/blog/avoiding-use-effect-with-callback-refs

✍️ @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