Reactjs-best-practices

ReactJS-ベストプラクティス

この章では、アプリの開発中に一貫性を保つのに役立つReactのベストプラクティス、方法、およびテクニックをリストします。

• 状態-状態は可能な限り避ける必要があります。 状態を一元化し、小道具としてコンポーネントツリーに渡すことをお勧めします。 同じデータを必要とするコンポーネントのグループがあるときはいつでも、状態を保持するコンテナ要素をその周りに設定する必要があります。 フラックスパターンは、Reactアプリで状態を処理する良い方法です。
• PropTypes -PropTypesは常に定義する必要があります。 これは、アプリ内のすべての小道具を追跡するのに役立ち、同じプロジェクトで作業している開発者にも役立ちます。
• Render -アプリのロジックのほとんどは、renderメソッド内に移動する必要があります。 コンポーネントのライフサイクルメソッドのロジックを最小化し、そのロジックをrenderメソッドで移動するようにしてください。 使用するステートとプロップが少なければ少ないほど、コードはきれいになります。 常に状態を可能な限りシンプルにする必要があります。 状態または小道具から何かを計算する必要がある場合、renderメソッド内でそれを行うことができます。
• 構成-Reactチームは、単一の責任原則を使用することを提案しています。 これは、1つのコンポーネントが1つの機能のみを担当することを意味します。 一部のコンポーネントに複数の機能がある場合、すべての機能に対して新しいコンポーネントをリファクタリングして作成する必要があります。
• 高次コンポーネント（HOC）-以前のReactバージョンは、再利用可能な機能を処理するためのミックスインを提供していました。 ミックスインは現在廃止されているため、解決策の1つはHOCを使用することです。