Youtube動画で学ぶTailwind CSS

公開日時

「Tailwind CSS Tips, Tricks & Best Practices」を観て学ぶに引き続き、Tailwind CSSのYoutube動画を観て使い方を復習している。

Tailwind CSS作者のAdam Wathanさんの「Designing with Tailwind CSS」シリーズがとても分かりやすかった。

これまでは公式ドキュメントを見ながらざっくりと各コンポーネントを作っていたが、動画で解説してもらったほうがコンポーネントの制作過程が分かるのでより理解が深まる。

動画自体も1件あたり10分程度の短さなのも良い。

今度から新しいことを学ぶ時はドキュメントだけじゃなく、動画もチェックするようにしてみよう。

Building Interfaces with Tailwind CSS」という既存サービスのUIをTailwind CSSで作るシリーズもあったので暇なときに少しずつ観ていこうと思う。


Related #css

Chakra UIで打ち消し線を使う

Strikethrough

Chakra UIでホバー時のボタンの背景色を変える

_hoverで設定できる

tailblocks

tailwind cssのテンプレート集

Tailwind CSSでダークモード対応をする

classを指定してユーザがダークモードを切り替えられるようにした

Learn CSS

Next.js 10 + Tailwind CSS 2.0 でAMP対応(hybrid)を行う

next/ampのhybridモードを使い通常ページとAMPページを生成し、PostCSSでCSSの容量削減を行いinline cssとして埋め込み