2016-11-28 21 views
1

現在、ReactJSアプリケーションで使用されるREST APIを設計中です。 2つの実際のエンドポイントは以下の通りです:埋め込みリソースを使用してDRYする方法

/species 
    id 
    types 
     [name, name] // each specy has 2 types, contained in an array 

/types 
    name 

我々は、我々はすべてのtypeリソースのリストを提供してエンドポイントを持っている、とspeciesエンドポイントは、特定のspecyのtypeを提供していることがわかります。私ReactJSアプリで

、私は(/typesエンドポイントを経由してフェッチ)typesのリストが含まれている選択フィールド、および/speciesからフェッチすべてspeciesのリストを持っているつもりです。ユーザーは、Selectフィールドでタイプを選択して種をフィルタリングすることができます。

typesのリストをSelectコンポーネントに保持し、speciesのリストをSpecyコンポーネントの配列に持つことはまだDRYですか?またはspecyの独自のエンドポイントからフェッチされたtypesを挿入する方法を見つける必要がありますか?

答えて

0

エンドポイントが/speciesの場合、すべてのタイプのリストを作成すると、ゼロ種が割り当てられているタイプがあるケースをカバーすることはできません。これは問題かもしれません。完全な種類のリストを取得するには、常にすべての種をロードする必要があります。これは無駄な帯域幅の多くかもしれません。


代わりに、次のアプローチを検討してください。

エンドポイント/typesは、あなたが最初にあなたのドロップダウンを埋めるために必要なすべてである、あなたに利用可能なすべての種類のリストを与えます。ユーザーが特定のタイプを選択すると、エンドポイント/types/{typeName}/speciesが呼び出され、{typeName}に割り当てられたすべての種のリストが表示されます。ここでもまた、ユーザーが参照したいデータのチャンクだけをロードしています。

この方法を使用すると、フロントエンドでデータを集約し、アプリケーションがその目的を達成する前に完全なデータセットをダウンロードする必要がなくなります。


サイドノート:種の特異性is also species、特定ではない。 :-)

+0

ご回答ありがとうございました! – Lucio

+0

ちょっと朝(私の時間)note:名前で種を絞りたいので、 '/ species?type = xxx&name = xxx'のように'/species'を検索する方がいいですか? – Lucio

関連する問題