From zero to built-in AI hero
summary
A travel-blog editor is built that hooks Chrome’s built‑in AI APIs into real code: Summarizer API (Chrome 138) streams click‑inviting headlines and SEO teasers from a page’s innerText; Prompt API with structured output uses JSON Schema enums to return predictable tag arrays; multimodal image input accepts an HTML <img> element and returns required Alt + caption fields. Repo runs locally via npm start, exercises and solutions included; Writer/Rewriter are usable behind flags and Firebase iLogic provides a Cloud/local hybrid fallback.
AI-written summary · about
chapters (12)
- 0:00Introduction and Agenda
- 0:45The demo app and blog editor
- 2:20Summarizer API
- 5:40Workshop setup and instructions
- 13:47Prompt API with structured output
- 17:40Exercise: Prompt API with structured output
- 20:54Prompt API with multimodal input
- 24:38Exercise: Prompt API with multimodal input
- 28:33Writer API
- 32:11Rewriter and Translator APIs
- 34:03Polyfills and final tips
- 35:13Takeaways and Conclusion
related talks
15mOverview of Chrome built-in AI
24mAI right in the browser with Chrome's built-in AI APIs
32mConversations Without Prompts: AI in the Web
10mBuilt-in AI: The next frontier for web experiences
15mThe future of AI is now: Real-life case studies for on client-side AI adoption in web apps
16mLessons learned from being customer zero of Chrome's built-in APIs
37mBuilding AI-powered user interfaces
35mBuilding AI-powered user interfaces