2021年5月22日のブックマーク (1件)

  • Atomic Designをやめてディレクトリ構造を見直した話|食べログ フロントエンドエンジニアブログ

    こんにちは。フロントエンドチームの金野と申します。 べログでは現在、React+TypeScriptフロントエンドのリプレースを進めています。 以前の記事で、べログではAtomic Designをどのように取り入れているかの紹介をしました。 しかし、最近のリプレース作業では、Atomic Designとは異なるディレクトリ構造を採用しています。 今回の記事では、「なぜAtomic Designをやめたのか」という理由と、「どのようなディレクトリ構造にしたのか」を紹介します。 Atomic Designを導入したねらいと導入した結果 上記の記事で言及した通り、当初Atomic Designを導入したねらいは以下になります。 1. コンポーネントの責務がより明確になる 2. 見た目の粒度だけでなく、ロジックの責務も明確にできる 3. 「ドメインが入るか/入らないか」。「抽象的か/そうでな

    Atomic Designをやめてディレクトリ構造を見直した話|食べログ フロントエンドエンジニアブログ
    atico
    atico 2021/05/22
    AtomとMoleculesの使い分ける利点は、下位レイヤーから上位レイヤーを参照することがないので、Moleculesの修正がAtomに影響がないことが確定できる。Atomも最小単位なので自身の修正が他のAtomに影響を与えることがない点。