← FC Coder · HomePhase 05 · Lesson 64 · 90 min
Lesson64
Phase Five · Showcase · Matchday 64 · The Coach Speaks
AI 足球教练
ai-sdk + 流式
Today's 3 Jobs · 今天这三件事
- 01app/api/coach/route.ts · streamText边吐边看
- 02/coach 页 · useChat + ai-elementsConversation/Message
- 03🌟 问 AI 足球问题 · 流式回9 岁友好
ai-sdk + ai-elements 一拍即合。`/coach` 你问 AI 足球问题 · 流式回(边吐边看)。system prompt 设角色 = 9 岁友好教练。API key 在 .env.local 别 commit。
Concept
streaming + system prompt
// 边生成边渲染 · 体验 10x
API
streamText({...})
UI
useChat + ai-elements
system
设角色 / 风格
Half 2
装 · API · UI · 调 prompt
01ai-sdk + streamText
01Min
pnpm i ai @ai-sdk/openai · .env.local OPENAI_API_KEY
父亲提供 key · gitignore。
02Min
app/api/coach/route.ts · streamText + system prompt
9 岁友好 · 中文 · 简短 · 比喻。
02ai-elements 聊天 UI
03Min
/coach 页 · useChat({ api: '/api/coach' })
ai-elements Conversation + Message + PromptInput。
04Min
🌟 问 '哈兰德为什么强' · 看流式回
边生成边显示。
05Min
调 system prompt · 让回答更友好
测 3-5 个 prompt。
03AI 自己改 · 存对话
06Min
AI Trust: 保存对话到 DB(可选)
Cmd+K · '加 conversations 表 · 每次 chat 存'。
07Min
📸 截图流式对话
Phase 5 第 9 张。
讲给爸爸听
3 题
01流式输出 vs 普通 fetch?Hint ↓
边吐边看 / 等完整。体验 10x。
02system prompt 干啥?Hint ↓
给 AI 设角色 + 风格。'你是友好的足球教练 · 用中文 · 简短'。
03API key 为什么 gitignore?Hint ↓
secret · 别人拿到你的会被刷账单。
温度计
评分
今天难度Difficulty
0
今天开心Fun
0