react.md

Читать и применять только если уже знакомы с React, в противном случае можно пока игнорить

1. Все компоненты должны быть по умолчанию функциональными, то есть stateless (что это такое?), и только при необходимости становиться class-based component;

2. Метод render() должен быть чистым (читаем доки);

3. Избегайте создания методов-рендеров в компонентах-классах (речь не о методе render, а о методах, которые вы можете написать помимо него, и которые тоже возвращают JSX);

   Так как эти методы возвращают куски JSX, которые не являются полноценными react-unit объектами, у вас могут возникнуть проблемы с сопровождением этих компонент в дальнейшем.
   И потом - с непрваильно вынесенным jsx не удается работать как с полноценным react-unit, проблемы с рефами и отслеживаемостью в ДОМ Если вы хотите вынести JSX — выносите его в stateless компоненту.
   Например:

    export class OrderStatus extends Component {
      renderStatusView(status) { // этот рендер должен быть вынесен в отдельную компоненту
        if (status === 'succeed') {
          return <span>Done!</span>;
        }
        return <span>Active...</span>;
      }
   
      render () {
        return (
          <div>
              Order status: {this.renderStatusView(this.props.status)}// Здесь должна использоваться компонента а не метод
          </div>
        );
      }
    }

4. Метод render() и все методы, возвращающие куски DOM-a, должны располагаться в конце компоненты, сам метод render самым последним из публичных;

5. Принципы работы с action creators (redux);

   • Следует избегать лишнего getState обращения в action creator, кроме специфических случаев (например, когда вьюха никак не может получить достаточное количество данных). Данные следует отправлять в action creator явно аргументами, чтобы явно указать, с какими данными функция работает и что ей необходимо для корректной работы;
   • Декомпозиция сложного экшна (состоящего из нескольких структурных, алгоритмических экшнов) должна проводиться в присутствии старшего разработчика. то есть если напрашивается множественный dispatch в одном action creatore, следует обсудить этот момент со старшим разработчиком, т.к. бывают случаи, когда этого можно избежать, а бывают - когда не удается;
   • Следует вызывать action creators только в контейнерах, в ответ на более низкоуровневые действия глупых компонентов: к примеру registerUser action следует вызывать в ответ на OnSubmit событие компонента формы регистрации.