フロントエンドカンファレンス北海道2025
LT(5分)
新卒エンジニアが実現したTailwind CSS×ピクセルパーフェクトUI
Wakki
新卒としてフロントエンド開発に飛び込んだ私が、スピードと1px単位で再現する丁寧さを掛け合わせたTailwind CSSのユーティリティファースト思想を武器に、Figmaで作成されたデザインカンプ通りのピクセルパーフェクトUIを実現するワークフローをご紹介します。
複雑なカスタムCSSを極力排除し、すべてのレイアウト・余白・カラーをユーティリティクラスで厳密に制御することで、保守・管理しやすいコードを実現。vw/vhベースのレスポンシブサイズ指定や、ブレイクポイントごとの細かな微調整、各ブラウザ間のレンダリング差異検証と補正対応など、プロダクション品質のUIを効率よく丁寧に構築するためのベストプラクティスを学ぶことができます。
新卒だからこそ試行錯誤して実現した、モダンCSS運用の最短ルートをお伝えします!