🌅

Reactで自分が良いと思ったディレクトリ構成

2021/09/24に公開
src
┣assets
┣common
┃┗interfaces
┣components
┃┣atoms
┃┣molecules
┃┗organisms
┣providers
┣routes 
┣services
┗template
App.tsx
index.tsx
.env
.env.development
.env.production

各ディレクトリの大まかな説明

assets: 画像やフォントを格納する
common: 各ページで共通して使用する処理(ライブラリなど)を一元化する
common>interfaces: interfaceをそれぞれ定義 <-typeで定義しても良いかも
components: templateから使われる部品
components>atoms: 最小単位の部品
components>molecules: 中規模の部品
components>organisms: 各画面用の大規模部品
providers: ルーティングの再構築のため、処理集約の役割
routes: ルーティングの一覧
services: 各画面で発生する処理
template: ルーティングされた各要素

Discussion