発行
セレクトボックスのドロップダウン部分（選択肢項目部分）と、選択された項目の表示方法のカスタマイズを紹介します。
最終回では、良い名前、悪い名前に代わる軸として、コミュニケーションにおける「納得感」を中心に考えてみます。どうしたら納得感を高められるのか、そのヒントを紹介します。
AI利用時にも役立つMermaid基礎知識を解説します。フローチャートとシーケンス図の基本記法から、注釈・色分け・グルーピングなど読みやすい図を作るための記法まで紹介します。
発行
前回作ったセレクトボックスUIの基本的な部分を、Floating UI Reactを使ってポップオーバー化していきます。リストが長い場合でも、ブラウザ画面内に収まるようにし、より使いやすくしていきましょう。
1回目ではプログラミングにおける名前は「コミュニケーション」の手段であることを述べました。2回目では、そのような名前をどうやって探り当てていくか、具体的な事例をもとに解説します。
前回までで、ローカル実行できる最小のPlaywrightテストが完成しました。今回はタブUIの切り替え操作をテストに加え、最小テストを拡張します。「基本的な操作がエラーなく成立する」ことまで自動検証できるようにしましょう。
発行
scroll-state()の知識を応用し、実際にスクロールに応じて見出しやカードの見た目が変化するUIを作ってみます。組み合わせることで、動きのある表現をどのように実現できるのかを見ていきましょう。
AIエージェントに実装やドキュメント作成を任せることが現実的になってきた今、うまく使いこなすにはどうしたらいいでしょうか。AIを効果的に働かせるための環境作りと、実際に使う中で見えてきた仕事の変化について、筆者の実感をもとに考察します。
Svelteのスタイリングにおいてもレイアウトが可能ですが、Svelteではコンポーネントのスコープを意識しないと、レイアウトが適切になされません。その注意点と、解決方法を解説します。
発行
プログラミングにおいて、変数や関数に名前を付ける行為はごくごく日常的でありながら、コードの可読性を左右します。第1回目はそのような名付けの機能をあらためて考えることから始めましょう。
チェックボックスとラジオボタンの状態を取り上げます。また、普段はデザイン視点からはあまり触れることが少ない、実装における見た目のカスタマイズについても触れます。
第4回からは、Floating UI Reactを使ってセレクトボックスUIを実装していきます。今回は、トリガーボタンを用意し、選択した内容をトリガーボタンに表示するまでを解説します。