Chakra UIの歩き方 & Tips集

Chakra UIの歩き方 & Tips集

01この本について 021章基礎編 03Chakra UIのはじめかた・Installation 04基礎となるスタイルの付け方・Boxコンポーネントについて 05Tips. Chakra UIの設計原則 06Theme: 色のTheme・キーワード 07Theme: サイズ・Spacingに関するTheme 08Theme: その他の機能（variant, z-index, カスタマイズ)09疑似要素スタイル(&:hover)等は_hoverのように指定する 10レスポンシブにするなら複数の値を設定する 11useBreakpointでstyle以外のレスポンシブ対応も出来る 12asプロパティでいろんなコンポーネントにする例 (ButtonをLink化する)13コンポーネントを拡張したものを共通化して使う 14sxで例外的なCSS処理・部分的にグローバルなCSSを作る 152章コンポーネント・APIのTips集 16要素を角丸にしたりshadowかけたりする 17Stackをどんどん使おう（リストレイアウト編）18VStack / HStackもどんどん使おう（コンポーネントレイアウト編）19Spacerを使って楽にレイアウトしていく 20どんなコンポーネントもChakra UIっぽく扱いたいならchakra factory機能を使う 213章拡張・その他編 22SkeltonとIntersectionObservableを組み合わせる 23Accordionが開いた後に遅延読み込み(lazy load)処理をさせる 24TabをURL Hashに同期する 25Drawerとレスポンシブを使ってモバイルのときに隠れるメニューを作る 26おまけ（CSSからの脱却・他のフレームワークと比べて）

Chapter 02無料公開

1章基礎編

2021.05.12に更新