Tailwind CSS

Project FHについて、もともと書いてあった素のCSSをTailwind CSSに移行していく作業をドドドと進めた。今回はClaude Codeに依頼する内容をうまいことまとめることができて、功を奏した。

feeeed/docs/2025-10-24_スタイルシートの整理.md at main · kairan-app/feeeed

Contribute to kairan-app/feeeed development by creating an account on GitHub.

github.com

Project KJ方面のウェブアプリケーション開発でGraphQLに触れていて、ぼくは習熟度が低いのでハチャメチャに手探りで進めている。グラフキューエル対応人材になりたいですね。

Project FH方面のアプリケーションではTailwind CSSのv3系からv4系へのバージョンアップを進めていて、なかなかの悪戦苦闘になっている。ぼくのDevinの使い方では突破できなかった。微妙な表示の差異を解消していくのがむずい。

Project FHの週次定例。こっちでもTailwind CSSを使っていくことになりそうで楽しみ。楽しいことがどんどん増えていってまいっちゃう。

自宅の周辺をちょろちょろしていたらジェームスさんと会ったので立ち話した。ジェームスさんのところのメダカやドジョウたちの近況を教えてもらう。ジェームスさんの庭のところにはカエルたちもいっぱいいたな。かわいかった。

Teacher Teacher方面で使うウェブアプリケーションの開発を進めている。ちょっと前に導入したTailwind CSSはだいぶ手になじんできていて、今日も快適に作業できた。自分の場合は、自前でCSSを書いていくよりもTailwind CSSを使った方がアプリケーションの見た目が整うみたい。「Cursor + GPT-4o + Tailwind CSS」を使っていて、Cursorの右サイドバーにチャットを開いてGPT-4oに「これをTailwindのクラスで実現するにはどうしたらいいですか」って話しかけながらコーディングを進めている。だいぶ快適。

とあるウェブアプリケーションの開発を進めていた。今日はまじめにスタイリングに取り組むか、と思ってTailwind CSSを導入して格闘していた。最初の90分間くらいは「どうにもよくわからん…」となって導入を取りやめたい気分が高まっていたが、ドキュメントや入門者向けの解説をドドドと読んでいったらだんだんとわかっていった。

• https://tailwindcss.com/docs/installation
• Tailwind CSS入門と実践 - Zenn
• https://tailblocks.cc
• https://www.hyperui.dev/components/application-ui
• https://tailwindcomponents.com/cheatsheet/

ぼくがスタイリングまで担当するようなウェブアプリではそこまで複雑なインターフェイスは組まないので、もっと慣れていけば自分用の道具としてよさそう。と思えるところまで気持ちが進んだ。触ってみるのは大事だなあ。