concept development

Note

宣言的UIのようにデータもコンポーネント単位で取得し管理すること。 GraphqlFragment Colocationを使用することで実現ができる

これまではページ単位でRestAPIを叩いてデータをまとめて取得し各コンポーネントに伝達して表示を行うのが一般的であった。 この方法だと各コンポーネントに表示する情報を親のページがもつことになりコンポーネント間の依存関係が強くなってしまう。

コンポーネント内でGraphqlを利用して取得するデータを宣言することで各コンポーネント単位でデータを取得管理を行いコンポーネント内でデータフェッチを完結させる。 → コンポーネントとページの関係が疎結合になる。

参考

【GraphQL】Relayのサンプルコードで学ぶ、宣言的データフェッチとFragment Colocation