フロントエンド

UI 構築・スタイリング・コンポーネント設計を扱うドメインです。

UI フレームワークは React ガイドか Vue ガイドから始めます。まず片方を通して読むほうが考え方を掴みやすく、Vue ガイドには React の経験がある人が設計思想の違いを見る読み方も用意されています。スタイリングは Tailwind CSS ガイドが担い、フレームワークを問わず併読できます。shadcn/ui Button は React でコンポーネントを書けるようになった先の話なので、最後に読むのが自然です。

ガイド	扱う内容	対象
React ガイド	コンポーネント・Hooks・状態管理・データ取得・パフォーマンス・Next.js	入門〜中級。HTML/CSS と JavaScript の基礎が前提
Vue ガイド	リアクティビティの仕組み・コンポーネント設計・Vue Router・Pinia・Nuxt	入門〜中級。HTML/CSS と JavaScript の基礎が前提
Tailwind CSS ガイド	ユーティリティファーストの考え方・Flexbox/Grid・レスポンシブ・ダークモード	入門〜中級。HTML/CSS の基礎が前提
shadcn/ui Button で学ぶデザインシステム設計	デザイントークン・cva・cn・Radix Slot を Button 1 つで通して見る	中級。React の基本と Tailwind CSS のクラスに触れた経験が前提