Atomic Designの作者のBrad氏のブログでAtomic DesignとStorybookについて語られていた bradfrost.com
これまでAtomic Designはデザインをする上でのメンタルモデルでしかなく、CSS設計などの実装については言及していないとBrad氏自身が言っていたが、それがStorybookという実装よりの話しをしていたので興味深かった
特に興味深いのは、Brad氏コンポーネントの分け方と、templateとpageをセットにしておくというアイデア
コンポーネントの分け方はブログの図をみると思ってた分け方と違いすぎた
ButtonがAtomsにはなくMoleculesとOrganismsにしかない
ただ、これが正解とも思わないので参考程度に留めておく
あとは、templateとpageをセットにしておくというアイデアをお勧めしていた
templateをStorybookでどう扱っていいかわからなかったので、これはかなり参考になった
Pagesの下にtemplateのストリーも配置して、そこにはコンポーネント名を書いておくのは良さそう
こちらの図もブログより拝借
Atomic Designの作者がこうやってAtomic Designの熱冷めやらず実装部分に言及してくれてるのは助かる
