AI の力で解き放とう、 開発者の無限の可能性を。
蔡欣眉さん
Webの再生と技術者の今後
及川卓也さん
- Web2.0
- 2006年
- ウェブ進化論のほんのころ
- 誰もが参加し発信できるWeb
- 2つのクラウド
- Cloud Computing
- Crowdsourcing
- HTML5
- Webは誰も支配していない
- Webとメールだけは誰のものでもない
- 他はお金になるのでどこかが囲い込んでしまっている
- 2025年のWeb
- Web vs アプリ
- WebとAI
- WebがAIの餌場
- もともとは人に届けるためだった
- AI向けでお金になるなら人にとっての質が下がっていく
- AIのリスクからWebを守る
- AI利用の制御
- 利用許可の明示
- AI生成物のラベル付け
- テキストはラベル付けできないので倫理観が問われる
- AI時代のWeb再設計
- Webのメタデータの補足
- AIが扱えるデータ空間としての再設計
- 画面を操作するWebからの脱却
- NLWeb
- Webの会話形インターフェース
- WebがAIの餌場
- 技術者
- レイヤーがなくなってきてる
- 単一レイヤーでは戦えない
- 実装 -> 事実標準 -> 公式標準
- まずは作ることから
- 人間のためのWebを設計する
- レイヤーがなくなってきてる
異分野クロストーク
データ分析エージェントでBQを活用
なかむら さとるさん
- BigQuery
- データウェアハウス
- BigQueryから生成AIを使う
- クエリのなかでgeminiを使うと書くと使える
- selectにプロンプト書く
- データをselectしつつ生成AIの結果も含ませることができる
- データとして持ってる画像や音声の内容も解釈できる
- 生成AIからBigQeuryを使う
Chrome Dev Toolsとバックエンド
矢倉 眞隆さん
- DevTools
- HTMLやJavaScriptなどのデバッグに使うブラウザのツール
- Networkパネル
- DevToolsのAI機能
- AI機能がビルトインされている
- チャットで聞けたり質問がテンプレで用意されてたりする
- DevToolsMCP
- ページを開いてボタンクリックさせたり
- スクリーンショットとらせたり
Next Generation Web Frontend 2025
State of Angular with AI
Angular v21
- Signal Forms
- Signalベースの新しいFormAPI
- Experimentalで入った
- 今で2種類のフォームがあった
- どっちを使うか迷っていた
- 今後はこれになるはず
- Angular Aria
- ヘッドレスUI的なものをAngularが提供
- 今は13種類のコンポーネント
- Zonelessがデフォルトに
- Zone使ってないのがデフォルトに
- パフォーマンスが向上
- Vitestがデフォルトに
- v4にも対応してる
- TailwindCSS integration
- ng newでtailwindセットアップ済みで雛形ができる
Angular with AI
- Develop with AI
- Angularのベストプラクティスに従ったコードを書くためのルールを提供
ng generate ai-config geminiとかすると自動でセットアップしてくれる
- Angular MCP Server
ng mcp- Angularを効率よく開発するためのセットアップを全部やってくれる
- Angularのベストプラクティスに従ったコードを書くためのルールを提供
- Build with AI
- FirebaseのGenkitとの統合
- Learn with AI
- Angular AI Tutor
- チュートリアルをやる時にチューターになってくれる機能
- Firebase Studio内でやるとローカルのエディタなしでできる
- Angular AI Tutor
- Design with AI
- AngularのAPIをどう作るかAIを活用してやってる
- デザインdocを与えてコードサンプルを作らせる
- 結果を見てフィードバックサイクルを回して最適を探してる
- AIが間違えやすいとかで改善も進めてる
- AngularのAPIをどう作るかAIを活用してやってる
Getting started with Chrome build-in AI APIs
Yuriko Hirotaさん
- WebにAI機能を作る時
- ChromeにビルトインされたAI
- ブラウザにモデルが内蔵されている
- ChromeにはGeminiNanoが入ってる
- 標準化に向けて動いているので他のブラウザも進むことになる
- WebAPIを通じてアクセスする
- Prompting
- Writing
- Translating
- ブラウザにモデルが内蔵されている
Web UI 2025 Updates & What's Coming!
sakuさん
https://sakupi01.github.io/slides/ja/2025_11_22_gdgdevfest_web-ui-updates-whats-coming/
- Baseline
- Limited Availability
- まだ全てのブラウザで使えない状態
- Newly Available
- 全ての主要ブラウザで実装された状態
- Widely Available
- ブラウザ利用状況も踏まえて広く使えるようになった状態
- Limited Availability
- Container Query
@containerでコンテナのサイズに応じてスタイルの使い分けができる- これまではJavaScriptによる実装が必要だった
- 今年にWidely Availableになった
- PopoverAPI
- トリガーとなるボタンと押した時に表示するフローティングな要素
- Invoker Commands
- JSを使わずボタンを押したら何か表示するみたいなトリガー機能を実現できる
- Interest Invokers
- 興味を示したかどうかをイベントで取得できる
- 興味を示すとはホバーした時
- Anchor Positioning
- トリガー要素に対してフローティングな要素を表示する時にどこに表示するかの機能
- 余白のある方向に表示を切り替えたりもできる
- それに応じたCSSの変更もできる
- Customizable Select
- PopoverAPIやAnchor Positioningも関連してる
- 見た目をカスタマイズしたセレクトボックスを作ることができる
- 今までは標準のselectを非表示で隠してカスタムの見た目と連動させたりしないといけなかった
- menuやcomboboxへの派生も始まってる
