![](https://res.cloudinary.com/zenn/image/upload/s--lou_seaO--/co_rgb:222%2Cg_south_west%2Cl_text:notosansjp-medium.otf_37_bold:meijin%2Cx_203%2Cy_98/c_fit%2Cco_rgb:222%2Cg_north_west%2Cl_text:notosansjp-medium.otf_65_bold:React%25E3%2583%2599%25E3%2582%25B9%25E3%2583%2588%25E3%2583%2597%25E3%2583%25A9%25E3%2582%25AF%25E3%2583%2586%25E3%2582%25A3%25E3%2582%25B9%25E3%2581%25AE%25E5%25AE%259D%25E5%25BA%25AB%25EF%25BC%2581%25E3%2580%258Cbulletproof-react%25E3%2580%258D%25E3%2581%258C%25E5%258B%2589%25E5%25BC%25B7%25E3%2581%25AB%25E3%2581%25AA%25E3%2582%258A%25E3%2581%2599%25E3%2581%258E%25E3%2582%258B%25E4%25BB%25B6%2Cw_1010%2Cx_90%2Cy_100/g_south_west%2Ch_90%2Cl_fetch:aHR0cHM6Ly9saDMuZ29vZ2xldXNlcmNvbnRlbnQuY29tL2EtL0FPaDE0R2pPWmtyWk1nS3djRXl5a2w1X2lVTFZFVmtVVUpkNzkzcjlfejhERjRzPXM4MC1j%2Cr_max%2Cw_90%2Cx_87%2Cy_72/v1627274783/default/og-base_z4sxah.png)
Reactベストプラクティスの宝庫!「bulletproof-react」が勉強になりすぎる件
SRANK
Reactアプリケーションのアーキテクチャの一例として公開されているGitHubリポジトリ「bulletproof-react」が大変勉強になるので、私自身の見解を交えつつシェアします。 ディレクトリ構造が勉強になる ソースコードはsrc以下に入れるbulletproof-reactでは、Reactに関するソースコードはsrcディレクトリ以下に格納されています。逆に言えば、ルートディレクトリにcomponentsやutilsといったディレクトリはありません。たとえばCreate Next Appで作成されるアプリケーションは、デフォルトではルートディレクトリにpagesといったソースコードのディレクトリが並びますから、src以下に入れるのは本リポジトリが意図的に行っているディレクトリ構造といえます。実プロジェクトのルートには、マークダウンで書かれたドキュメント群(docs)や、GitHub Actions等のCI設定(.github)、もしコンテナベースで扱っているアプリケーションであればDockerの設定(docker)などが混在するでしょうから、ルートレベルに直接componentsなどを配置するとアプリケーションのソースコードとそうでないものが同一の階層に混在してしまいます。単純に紛らわしいだけでなく、たとえばCI設定を…
3 comments