1から始めるTailwindCSS
＜！注意！＞---------------------------------------------------------------- ・公式の内容を100%網羅しているものではありません。 ・書き方が統一されていないかもしれません。 ・実務でどうあるべきかという領域には踏み込みません。 ・簡単な説明とサンプルコード、実行した結果がメインで構成されています。 ・正しさが担保されているものではありません。 誤りを確認した場合はご指摘いただけますと幸いです。 ・v3.4.13を使っています。 ------------------------------------------------------------------------------ TailwindCSSを使用する機会が多々あったものの、うまく扱いきれずきれいにスタイルを整えきれなかったり、実装に時間がかかったりしました。公式見るとスタイルを適用するとどうなるかイメージできるものの、サンプルコードがそのまま動かせるわけではないので、実装面で今一つ掴めない部分がありました。そのため、一度公式の内容をかみ砕いて、動くコードを作ってまとめてみることにしました。 この本ではダークモード等重要なポイントでありながら、動作確認をする上でJavaScriptを実行させる必要があるケースが存在します。そのケースにおいてはReactを使用します。 多くの場合はJavaScriptを必要とせずに、公式で提供しているTailwindCSSの学習環境であるTailwind Playが利用できるため、基本はそちらの使用を推奨します。 ※私自身この本を作成する上でほとんどをTailwind Play上で動作させています。 https://play.tailwindcss.com/ 各章の内容としては関連クラスについてコードと実行結果、必要に応じて解説を載せています。本の最後にはまとめとして学習した内容を使ってZennのホームページを極力再現していきます。 この本で身に着けられるレベル感が確認できると思いますので、先にまとめを流し見していただてもよいかもしれません。
