知りたいこと
Next.jsを使用してアプリ開発を始めようとしています。
コンポーネントの設計にはAtomicDesignを採用します。
Next無しのReactアプリ開発でAtomicDesignを採用したことはあり、
どのようなものかはわかっているのですが、
Next.jsに落とし込む場合のフォルダ構成について悩んでいます。
具体例
以下の条件の場合、どのようなフォルダ構成とするのが正解でしょうか。
・コンポーネントが見た目とロジックの機能を持つ場合、ContainerComponent(ロジックを責務とするコンポーネント 以下CC)とPresentationalComponent(見た目を責務とするコンポーネント 以下PC)に分割して作成し、CCからPCを呼び出す
・ApageはPCとCCに分かれている
・BpageはPCしか存在しない
①pages配下のコンポーネントはルーティングにしか使用しない
pages/Apage.tsx(内容はApageのCCを呼び出すだけ)
pages/Bpage.tsx(内容はBpageのPCを呼び出すだけ)
components/presentational/Apage.tsx
components/presentational/Bpage.tsx
components/container/Apage.tsx
②pages配下のコンポーネントにある程度内容も書いてしまう
pages/Apage.tsx(CCの内容)
pages/Bpage.tsx(PCの内容)
components/presentational/Apage.tsx
個人的には①の方が分かりやすいのかなと思うのですが、少し冗長な気もしております。
どちらの方が良いか、また別パターンのやり方をご存知の方が居ましたらご教示ください。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。