前端转 AI 全栈实战
一个真实转型过来的前端，带你走向 AI 全栈。从调通第一个 AI API 开始，JS/TS + Python 双语言并进，逐步掌握 Prompt 工程、流式渲染、RAG、Agent、MCP 协议等核心能力。
前端不会死，但只写页面的前端会
2025-2026 前端就业市场到底发生了什么，AI 替代不了的前端能力有哪些，四条转型路线如何选择
AI 全栈开发的技术全景图：前端需要补什么
LLM 基础认知、前端可迁移技能盘点、需要新学的 AI 核心概念、推荐学习路径
用 JS 和 Python 分别调通你的第一个 AI API
注册 API Key、JS 和 Python 双语言调用 Chat Completions API、参数详解、实战命令行 AI 问答
多模型适配：一套代码接 6 家 AI 厂商
OpenAI 兼容格式、Claude 特殊处理、封装统一 AI Client、本地 Ollama 部署
流式输出：让 AI 回复像 ChatGPT 一样打字机效果
SSE 原理、流式请求、前端逐字渲染、React/Vue 流式状态管理、实战打字机聊天组件
Prompt 工程：前端最容易忽略的核心技能
RCFE 结构化框架、JSON 输出保障、Few-shot 技巧、实战 AI Code Review 工具
.env 管理、代理配置、错误处理——AI 应用的工程化基础
API Key 安全管理、代理配置、错误处理、重试机制和成本控制
从脚本到 CLI 工具：用 Node.js 打造你的第一个 AI 命令行工具
CLI 基础架构、参数解析、终端 UX、实战 AI 翻译 i18n 工具
我是怎么做 ai-review-pipeline 的（从 v1 到 v3 的架构演进）
拆解真实开源项目 ai-review-pipeline，从 v1 到 v3 的架构演进复盘
npm 发包全流程：让你的 AI 工具被全世界 npx 到
从 package.json 配置到 npm publish，走完 npm 发包的全流程
Git Diff + AI：智能只审查变更代码（而不是全量扫描）
深入 Git Diff 解析，实现增量/全量两种 AI 代码审查模式
前端为什么要学 Python：AI 全栈的第二条腿
前端视角的 Python 最短路径指南：JS 概念对应和 FastAPI 入门
AI 聊天应用全栈实战（上）：FastAPI 后端 + 对话管理
用 FastAPI 搭建生产级 AI 聊天后端：对话管理、流式输出、Token 计量
AI 聊天应用全栈实战（下）：前端 UI + 流式渲染
构建生产级 AI 聊天 UI：流式渲染、Markdown 高亮、自动滚动
RAG 入门：让 AI 基于你的文档回答问题
从零实现 RAG：文档切片、向量搜索、ChromaDB 和 FastAPI 集成
AI Agent 模式：让 AI 不只是回答问题，还能执行任务
从 Function Calling 到全栈 Agent：工具调用、安全边界与框架对比
AI + 低代码：用自然语言生成页面 / 表单 / 图表
用 AI 生成 JSON Schema 表单、ECharts 图表和 Vue 组件代码
MCP 入门：AI 世界的"USB 接口"，前端写 Server 天然适配
MCP 协议入门：用 Node.js 写第一个 MCP Server 并在 Cursor 中使用
MCP 进阶：做一个有实用价值的 MCP Server 并发布
实战开发掘金文章管理 MCP Server，掌握多 Tool 设计原则与 npm 发布流程
AI + Chrome 扩展：做一个 AI 驱动的浏览器插件
用 Chrome Extension V3 开发 AI 网页摘要和划词翻译扩展
AI + VS Code 插件：给你的编辑器加上 AI 超能力
开发 VS Code 插件实现 AI 代码注释、代码解释和 Commit Message 生成
多模态 AI API：不只是文本，图片和语音也能玩
打通 Vision、TTS、STT 多模态 AI API，实战截图转代码
AI 应用的成本优化：从月花 $100 到 $5
五大策略将 AI 应用成本降低 99%：模型降级、缓存、Prompt 压缩等
AI 应用的测试和质量保障
AI 应用的四层测试方案：结构校验、Prompt Eval、E2E 测试与监控
AI 应用部署实战：Docker + CI/CD + 监控
AI 应用的完整部署方案：Docker Compose、GitHub Actions 与日志监控
Dify / Coze 低代码 AI 平台：不写代码也能搭 AI 应用
对比 Dify、Coze、FastGPT，10 分钟搭建客服机器人实战
AI 产品思维：前端转 AI 的真正护城河
技术之外的产品思维：前端优势、垂直方向选择与个人品牌打造