Попытка понять парадигму React

Question

Я пишу статью для своего Uni о реактиве и пытаюсь понять, в чем дело.

На веб-сайте раздела Thinking in React они указывают, что пользовательский интерфейс должен быть разбит на небольшие компоненты. Один из способов сделать это - использовать технику single responsibility principle.

Эта парадигма также является причиной того, что HTML (JSX), CSS (встроенный стиль) и JavaScript должны быть помещены в один файл?

Answer 1

В том числе HTML (JSX), CSS и JS в том же файле больше о separation of concerns, чем отдельная ответственность. Концентрация компонента React заключается в том, чтобы отобразить на экране небольшой подмножество информации, и для этого нужны HTML (JSX), CSS и JS, поэтому они являются частью этой проблемы.

Другие школы мысли рассматривали бы эти элементы как разные проблемы, так что это очень проблема того, как вы интерпретируете шаблон, а не что-то с окончательным правильным ответом.

Пит Хунт конкретно рассказал об обострении проблем с реакцией на ОАО «ЕСФ» в 2013 году, you can see a video of that here и read the slide deck from that presentation here. В дополнение к разделению проблем в этой презентации также обсуждается вопрос о том, как положить все элементы компонента в один и тот же файл, чтобы увеличить cohesion и поощрять loose coupling.

Практический результат включения HTML (JSX), CSS и JS в том же файле состоит в том, что вам нужно всего лишь посмотреть один файл, чтобы полностью понять поведение компонента. Это облегчает полное понимание компонента и вспомогательных средств reusability, особенно сторонних производителей.

Facebook Christopher Chedeau рассказал о том, почему они рекомендуют помещать CSS в ваш компонент React на NationJS 2014. This is a video that talk и this is the slide deck.