1. Робіть маленькі компоненти. Не треба складати все в купу, навіть якщо зараз це виглядає зручно - підтримувати потім буде дуже важко.
2. Розділяйте компоненти на ті що отримують дані та ті що їх відображають. Такий підхід спрощує підтримку та тестування.
3. Пишіть мінімум коду в JSX - виносьте його в блок до
return. Так у вас буде блок логіки (до return, та блок відображення - те що в return)4. Виносьте логіку в окремі функції або кастомні хуки. Компоненти потрібні для відображення, бізнес логіка має лежати окремо і бути протестована.
5. Взагалі виносьте з функцій будь-який код, що не залежить від компоненту. Оці всі магічні числа, масиви для дропдаунів - все це геть, чим менше в компоненті коду що його не стосується тим легше його читати та підтримувати.
6. Мінімізуйте useEffect. Використовуйте useEffect лише якщо немає іншого виходу - наприклад для асинхронних запитів. Намагайтеся його уникати.
7. Зберігайте локальний стейт локально. Якщо дані компоненту потрібні лише цьому компоненту - не варто додавати їх в глобальний стор.
8. Гарно спіть та повільно думайте. Вам платять за вирішення бізнес задачі, а не за кількість символів. Ясний розум - одна з основ чистого коду.
Якщо у вас є бажання та готовність пройти CodeReview в прямому ефірі - пишіть в ПМ.
Бережіть себе, допомагайте ЗСУ,
@reactbeginners