AtomicDesignとデザインシステム、CSS設計について
あっきー開発部で週1で新しいことをやってみる『Dev実験室』の取り組み
AtomicDesignを知る
デザインシステムを知る
CSS設計どうするのが良い？
って話をする
あっきーAtomic Design を改めて知る
参考記事
あっきー他のデザイン手法とかある？
あっきーCSS設計との紐付け方が難しいなと思う
結局橋渡しが必要的なのが必要？
syunAtomic Design が注目を浴びるようになったのは React Vue などのコンポーネント指向のライブラリが流行っているから？？
あっきーShadowDOMとかあったよね
あっきーそういえばWebComponentもあった
hikimaLv2.Lv3の住み分けはむずい。別れてることに恩恵を感じたことはない
あっきーLv2と3の違いって何？？
いくらかの複雑性はもつがこれ単体では成立しない
サンプルのLv2だと成立してそう。。。？
hikima恩恵は1から作らずに、使いまわせるところ。サービスのUIがちぐはぐになりにくい
あっきーCSS設計について
あっきーCSSは破綻しやすい！！！つらい！！！
CSS設計、ルールを決めて破綻しづらく、拡張性高く、運用しやすくしようって話。
村上健太BEM
が一番頻度的に見る・いい印象
村上健太今は、FLOCSS、BEMを合わせてる？
村上健太projects名が長くなるのを防ぎたい
ー＞ネストはそこまで深くならない方針なら大丈夫
あっきーンポーネントを構成する要素
- 情報構造
- スタイル
- 状態
- インタラクション・機能
村上健太p-- という規則性なら、BEMのelementの __ -> _
にしたい。とかいうので独自のあれが増えていくのか
あっきー短くするなら？
c-blokBlockName_elementName
あっきーMindBEMdingから独自にカスタマイズするのコスト高そうに感じるけど慣れれば別に良いかも
新しい人にもなれてもらえばよいだけなので
あっきーTailwind CSS
あっきー感想など
村上健太ルールにしっかり則ってやるより「見た目重要」にして、柔軟に見やすいルールに変えていきたい
村上健太部品化をRailsのパーシャル（ViewComponent）に落とし込めたら楽なのかな
あっきー現在、自社でやってるCSS設計割といい気がする
やれるとしたら
- ユーティリティに寄せる
- AtomicDesignのコンポーネントのLvと整合性を合わす
syunBEMのblock block__element の棲み分けの考え方を聞けてスッキリした
あっきーコンポーネントごとにファイルを分けているためクラス名の衝突はしないのでクラス名を省略しちゃって良い
c-plan-entry-create -> c-pec とか
hikimaAtomicDesignでLv4が活用されるときは来るのかって感じ。必要なさそう。
改めてAtomicDesignの恩恵を振り返れて良かったです。
あとは新しい言葉が頭に入ってきて熱出そうでした。