プロポーザル

「このコード、意味不明…」「リファクタリング、後でいっか…」なんて、日々の開発で萎えていませんか？その気持ち、ポジティブな「ギャルマインド」でアゲていきましょう！

本セッションで言うギャルマインドとは、「このコード、もっとイケてんじゃん？」と気づいた時にシュッと直す、前向きな姿勢のこと。大規模で重たい作業ではなく、毎日できる「軽快なリファクタリング」術に絞って紹介します。

例えば、dataのような変数名を誰でも分かる名前に「盛る」、深いネストは早期リターンで即サヨナラ、コンポーネントを意味のある単位で「ちょい分け」するなど、明日から使えるハッピーな小技が満載です。

難しい話は一切なし！軽快なリファクタリングで、コードもチームのバイブスも、そして開発効率も一緒にブチ上げていきましょう！

デザインシステムは、思想や原則といった「ルール」、再利用可能なUIコンポーネントである「実装」、それらの利用方法を示す「ドキュメント」の3要素で構成されます。
特に「ドキュメント」は、デザイナーとエンジニアとをつなぐ共通言語として極めて重要な役割を担います。
ドキュメントが参照しやすく、運用しやすいかたちになっていないデザインシステムは、その機能を発揮できないまま腐っていくことでしょう。

このトークではそんなデザインシステムの根幹をなすドキュメントサイトの技術選定について話します。
ドキュメントサイトに必要な要件を整理し、それらを満たすための最適な技術は何なのかについて考えます。
加えてドキュメントサイトのユーザビリティや生成AI活用のために注意したいポイントなどについても解説します。

私が2021年に公開して、現在もシェアが続いている「俺流レスポンシブコーディング」は、当時現役だったIEのためにほぼメディアクエリに依存した実装の紹介となっていました。

しかし、IEがサポート終了した現在では、grid, min(), max(), clamp(), コンテナクエリといったレスポンシブコーディングにおける「ゲームチェンジャー」的な機能が広く利用でき、メディアクエリへの依存度を大きく下げることが可能となりました。

このトークでは、これらのモダンなCSS機能を駆使し、「メディアクエリは適した場面でのみ使用する」ことを目指す、Intrinsicなレスポンシブコーディングの手法を紹介します。

また、progress(), スタイルクエリ, if(), Anchor Positioningなど、将来のレスポンシブコーディングをさらに進化させる機能についても予習として解説します。

「HTMLって単なるマークアップ言語？JavaScriptがないと動的なUIは作れない？」そんな固定観念は、もう捨ててください！
実はHTMLはここ数年で革命的な進化を遂げ、かつてないほど表現力豊かで強力な言語になっています！これまでJavaScriptの実装が必須だったポップアップやモーダル、複雑なインタラクション、パフォーマンス最適化など、多くのことがHTMLだけで、宣言的かつシンプルに実現できるようになりました。
本トークでは、そんなモダンHTMLの持つ真の力を凝縮してお届けします。

Reactなどのフロントエンドフレームワークを使いこなす中で、「もっと速く、もっと手軽にUIを作りたい」と感じたことはありませんか？本セッションでは、PythonからUIを構築できるStreamlitを、あえてフロントエンド実装の選択肢として検討した経緯と実践を共有します。フォームやチャートの高速構築、LLMとの連携、プロトタイプ開発などで活躍する一方で、カスタマイズ性の限界や制約についてもお話します。