フロントエンドのディレクトリ設計を移行した話 | Atomic Design → Feature

はじめに この記事は、業務でフロントエンドのディレクトリ設計思想を変更した際の作業をまとめた記事です📕 それなりの規模のプロジェクトでの移行作業のため、新規機能実装などに影響が出にくいようにリファクタリングを進めてきました。そこでの進め方や感想も含めてお伝えできればと思います。 前提 6年ほど運用しているReact Nativeのプロジェクトでの移行作業のお話です。 従来のディレクトリ設計思想はAtomic Designを採用していました。しかし、organismsのコンポーネントが300個近くにも及び、プロジェクトの規模が大きくなるにつれて様々な課題が浮き彫りになりました。これを機に設計思想の移行を決めました。 Layer型のAtomic DesignからFeature型のディレクトリ構造に移行していこうと思います😌 参考: ソフトウェアアーキテクチャの基礎 なぜ移行したか なぜ移行

[mayumayu_nimolove]

前から思ったんだけどフロントエンドって最高のディレクトリ構成作るとやっぱつおいの？

[suika3417]

ブコメまでが定期になってるこの流れ。自分も含めて中身を語らないのである

[inmysoul]

フロントエンダーマンは1日中技術選定ばっかりやってると思ってたけど、ディレクトリ構成の変更もするのか。えらいやん。

[ghostbass]

またエンジニアがディレクトリ構成移行してる

[dec123456789]

React勢っていっつもディレクトリ構成の話してんな。

[efcl]

Atomic Designを汎用的なものとFeature型に分けて管理