Как лучше организовать структуру проекта на react?

Question

[moreqa]

Здравствуйте, подскажите примеры хорошей структуры проекта на react, а также на сколько детально принято разбивать код на компоненты.

Например, есть карточка товара с различными элементами (кнопка добавить в корзину, плашка с информацией о скидке, торговые предложения и тд). Очевидно, что кнопку добавления в корзину выделяем как отдельный компонент, но что делать торговыми предложениями и информацией о скидке? Стоит ли их выделять в отельный компонент или же делать просто частью карточки?

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

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

Answer 1

[Alex Karo]

1) Базовые принципы неплохо описаны в доке
2) Все сильно зависит от размера проекта и команды. На маленьких объемах все не так уж важно
3) Много кода в одном файле это неудобно. Много мелких файлов тоже неудобно. Всегда нужно искать баланс.
4) Однозначно стоит выделять в отдельные компоненты все переиспользуемое. Стандартные кнопочки, инпуты, элементы интерфейса и пр.
5) Кстати, неплохая практика оборачивать все сторонние компоненты в свои. Так будет легче их модифицировать или вовсе заменить на самописные, когда припрет.
6) В мусорку все превратится, если не менять структуру и подходы по мере роста проекта. Разбирайтесь с проблемами по мере их поступления.