本書は、Web ブラウザにおける本格的な GUI の入門書です。Web ブラウザに期待される役割は年々増してきています。ネイティブアプリ顔負けのデザインツールや、ドラッグアンドドロップでの操作が必要なフォームを作りたくなったとして、我々は何に気をつけるべきなのでしょうか?これまで HTML / CSS / JavaScript で実装するのが大変だった UI をどう実装するべきなのでしょうか?この点を本書は重点的に扱います。本書では定番のセレクトボックスやヘッダーレイアウトの他、バウンディングボックスやツリーといったドラッグを伴う UI なども実装していきます。苦しくも楽しい、Webブラウザの複雑なGUIの世界に、エディタとブラウザを開きながら足を踏み入れてみましょう。
【目次】
第1章 フルスクラッチGUI入門
第2章 バウンディングボックスことはじめ──移動・拡縮・回転
第3章 スクロールに連動して高さが変わるヘッダビューを作る
第4章 ドラッグ&ドロップ並び替え入門
第5章 座談会──STUDIO CPOとするGUIの話
目次プレビュー
- はじめに
- 本書について
- 第1章 フルスクラッチGUI入門
-
1.1 フルスクラッチGUIの原罪
-
1.2 select要素を自作してみよう
-
1.3 トレースもとを観察しよう
-
1.4 モックしよう
-
1.5 オープン・クローズの挙動をつけよう
-
1.6 Propsを渡せるようにしよう
-
1.7 要素を選択可能にする
-
1.8 v-modelに対応する
-
1.9 キーボード操作に対応しよう
-
1.10 スクリーンリーダーへの配慮
-
1.11 まとめ
-
1.12 【おまけ】リングコマンドを実装しよう
-
3.1 完成イメージ
-
3.2 ざっくり作る
-
3.3 細部を作り込む
-
3.4 仕上げ
-
3.5 デモ
-
4.1 一次元のlistを並び替えよう
-
4.2 GUIを作ろう
-
4.3 DnDを実装しよう
-
4.4 まとめよう
-
5.1 GUIという「超高級言語」
-
5.2 ビジュアルプログラミングの壁
-
5.3 「モーターで走る馬」を作らない
-
5.4 コード vs GUI
-
5.5 処理そのものはGUIにならない
-
5.6 「何も無い」ことが究極のGUI
-
5.7 CUI → GUI → ???
-
5.8 GUIらしさ、楽しさとは何か
-
5.9 何かのための何かのための何か
-
5.10 複雑さの過渡期、臨界