CSSフレームワーク(コンポーネントライブラリ)の事例


Originally posted at michaelzanggl.com. Subscribe to my newsletter to never miss out on new content.


CSSフレームワークは、プロジェクトをクイックスタートする素晴らしい方法です.彼らは、デザインよりむしろあなたのアプリケーションに集中させました.あなたがデザイナーでなくて、あなたのチームで1を持っていないならば、これは特に素晴らしいです.
しかし、時間をかけてカスタマイズを必要とし、これは、特定の上の戦いは、フレームワークとの戦いが始まるところです.
これはもちろん何も新しいことではない、人々は長い間、これを議論してきた.
だがこれは実際にはこれほど大きな問題ではなかった.確かに、あなたは多分!importantと他の醜いハッキングをここで、そして、そこで必要としました、しかし、それは少なくともそれらのオーバーライドをどこで加えるべきかについてわかっていて難しいことでした.
今日では、いくつかの小さなクラスでは、離れて分離フレームワークのコンポーネント内の生活をオーバーライドしたい.クラスの名前が自動的に生成され、何を変更するには、簡単にハック離れて非常に退屈にオーバーライドするようになった.
Vuetifyで私は自分自身を見つける
.list-tile:hover >>> .v-list__tile {
    background: transparent;
}
Voetifyのコンポーネントのうちの1つのクラスであるv-list__tile.この内部的に使用されるクラス名が変更されるならば、それはアップグレードガイドでさえ言及されますか?
もう一つは、現代のCSSフレームワークのAPIです.ブートストラップのAPIとCSSのクラスは非常にあなたの頭に保つために簡単だった.しかし、今日、私はこのようなフレームワークを使用して開発するたびに、私はVuetify、材料のUIのマニュアルを持っているか、いつでも開いて何でも、簡単なダイアログのコードを50行のコードをコピーする準備ができている.各コンポーネントのすべての小道具、スコープ、イベントなどを覚えている方法はありません.この全体のコピーペーストのアクションはまた、正直であることを楽しく取る.
私は低レベルのユーティリティの最初のCSSフレームワークTailwindを使用して以来、他の何かとの作業は非生産的な感じ.私はそれにブログのポストhereを書いた.確かに、最初にドキュメントを見る必要がありますが、APIは予測可能であり、覚えやすいですが、自動補完のためのツールもあります.最良のことは、それが完全にフレームワークagnosticです.新しいAPIは、あなたが次のプロジェクトでVueの上で反応を使用すると決めるので、学ぶためにありません.
現代CSSフレームワークに関するあなたの考えは何ですか?それらを使用して楽しむか?