2017-01-10 8 views
0

私はReact/Redux Webアプリケーションを開発中です。プロジェクトの始めに、私は自分のアプリケーション状態をよく理解していました。しかし、コードベースが大きくなるにつれて、私は減速機を介してアプリケーションの状態にますます多くの属性を置く傾向があります。ここで問題となるのは、新しい人物がプロジェクトに加わると、すでに州にあるすべての属性についての明確な知識が得られない可能性があるということです。Redux - アプリケーションの状態を文書化するには?

今のところ、状態のすべての属性を記述するには、state.jsというファイルでコメントアウトされたオブジェクトを使用しています。

/* 
    APP_STATE = { 
     attribute1 : '', 
     attribute2 : '', 
     attribute3 : [], 
     attribute4 : { 
      key: '' 
     }, 
    } 
*/ 

質問:私のアプリケーション状態の構造を文書化して意味を分かりやすくする方法がありますか?あなたはどんなアプローチをしていますか?

答えて

1

新しい開発者はおそらく起源のものを見るべきです。私たちの場合、それはrootReducerでしょう。

通常、rootReducerの宣言は、複数の独立したレデューサーの組み合わせであり、それぞれ独自の状態(「スライス」)を持ちます。この時点で、私は各レデューサーの状態、単に主要な構造を文書化しません。

// rootReducer.js 

export default combineReducers({ 
    feature1, // State for feature1 
    feature2, // State for feature2 
    ... 
}) 

これで、開発者は各リデューサーに慣れ親しむことができました。
各レデューサーには独自のモジュールがあり、その先頭にinitialStateを宣言します。ファイルを見る人は、スライスの構造についてすぐに知ることができます。それを文書化する機会もあります。

// feature1Reducer.js 

const initialState = { 
    attribute1: '', // description of attribute1 
    attribute2: [], // description of attribute2 
    ... 
}; 

export default function reducer(state = initialState, action) { 
    ... 
}; 

だから私は私の主なガイドラインは以下のようになり推測:

  1. は一度全体ものを導入し、ストレスをしないでください。複数のファイル/モジュールに分かれています。

  2. オブジェクトを文書化する場合は、コメントブロックではなくインラインコメントを使用する方がよい場合があります。私の考えでは、維持することも簡単です。しかし、これは主観的です。

関連する問題