前端开发向全栈与 Agent 工程转型,已是许多工程师在 AI 时代的自然延伸。会写提示词只是起点------要做出可靠、可维护的产品,底层框架与原理仍然绕不开。
2026 年是我工作的第十年 ,也是一次系统性的重新开始。本大纲是个人转型路线图:前端打底 → 后端补全 → Agent 落地,细节各见三份主索引,此处只做总览与串联。
主索引
- Step 1 前端 → front/all.md · 掘金
- Step 2 后端 → backend/all.md · 掘金
- Step 3 Agent → ai/all.md · 掘金
总览
flowchart LR
A["Step 1 前端<br/>front/all.md"] --> B["Step 2 后端<br/>backend/all.md"]
B --> C["Step 3 Agent<br/>ai/all.md"]
A -->|宿主环境差异| A2[Node / Browser / Hybrid]
B -->|REST / SSE / DB| C
C -->|RAG / 微调 / 编排| B
| 阶段 | 核心问题 | 主索引 | 补充产出 | 进度 |
|---|---|---|---|---|
| Step 1 | JS 在不同宿主中如何运行?如何工程化交付? | front/all.md · 掘金 | front/ Q&A 8 模块 |
掘金体系完整,Q&A 部分已有 |
| Step 2 | 服务如何设计、扩展、保障一致性? | backend/all.md · 掘金 | Spring Boot 100 题等 | 主索引已完成,Q&A 待写 |
| Step 3 | 如何让 LLM 可靠完成复杂任务并落地? | ai/all.md · 掘金 | 多 Agent 原理文 + 实战笔记 | 原理文已有,应用层待补 |
一条主线:同样是 JS,在 Chrome、Node、Hybrid 里能力边界不同;同样是接口,在业务 API 与 Agent 工具调用里契约要求不同------三阶段正是在补齐这些「边界感」。
Step 1:前端
完整目录:front/all.md · 掘金专栏
| 编号 | 主题 | front/all.md | front/ Q&A | 状态 |
|---|---|---|---|---|
| 1 | JS 原生语法 | §1 | 3. JavaScript & Browser/ |
掘金完整 |
| 2 | Node 宿主 | §2 | 待建 9. Runtimes/Node.md |
掘金完整 |
| 3 | Chrome 宿主 | §3 | 3. JavaScript & Browser/ |
掘金完整 |
| 4 | Hybrid App | §4 | 8. Cross‑Platform/ |
掘金完整 |
| 5 | Vue | §5 | 6. ReactVue Internals/ |
掘金完整 |
| 6 | React | §6 | 6. ReactVue Internals/ |
掘金完整 |
| 7 | 编译(Webpack / Vite / Babel) | §7 | 5. Tools, Testing & CI/CD/ |
掘金完整 |
| 8 | Web 架构(前端视角) | §8 前半 | 7. Architecture/ |
后端部分已迁至 Step 2 |
| 9 | 前端工程化 | §9 | 5. Tools, Testing & CI/CD/ |
掘金完整 |
| 10 | 其他(含 SSE 对话框) | §10 | 4. Performance/ 等 |
掘金完整 |
| 11 | 感悟与总结 | §11 | --- | 个人记录 |
| --- | HTML / CSS 基础 | §10 web | 1. HTML/ 2. CSS/ |
Q&A 已有 |
学习顺序:语言与宿主(1→2→3→4)→ 框架双轨(5∥6)→ 编译与架构(7→8)→ 工程化与其他(9→10)
Step 2:全栈 / 后端
完整目录:backend/all.md · 掘金专栏
| 编号 | 主题 | 本地目录 | 状态 |
|---|---|---|---|
| 0 | 计算机基础(网络 / OS / 数据结构 / 算法) | 0. Computer-Science/ |
待写 |
| 1 | Java 核心(JVM / 反射 / JNI) | 1. Java-Core/ |
掘金 3 篇 |
| 2 | 框架体系(Spring / Boot / Cloud / Netty) | 2. SpringBoot/ |
Q&A 100 题草稿 |
| 3 | 数据库(MySQL / MongoDB / Redis) | 3. Database/ |
MySQL 掘金已有 |
| 4 | 开发工具(Tomcat / Maven / Gradle / Docker) | 4. Dev-Tools/ |
待写 |
| 5 | 系统设计(REST / 鉴权 / 安全 / 定时 / 推送) | 5. System-Design/ |
待写 |
| 6 | 分布式(Gateway / 锁 / 事务 / RPC) | 6. Distributed/ |
待写 |
| 7 | 高性能(CDN / 负载均衡 / MQ / SQL) | 7. High-Performance/ |
待写 |
| 8 | 高可用(多活 / 限流 / 熔断 / 压测) | 8. High-Availability/ |
待写 |
| 9 | 全栈联调(BFF / SSE 后端 / Agent 衔接) | 9. FullStack-Integration/ |
待写 |
学习顺序:计基 → Java → Spring Boot → 数据库 → 系统设计 → 分布式 → 高性能 / 高可用 → 全栈联调
Step 3:Agent / 大模型开发
路线原则:先 API 应用(RAG、Agent),再部署与微调,最后多 Agent 工程化------与主流 AI 应用工程师路径一致。
| 编号 | 主题 | 本地目录 | 状态 |
|---|---|---|---|
| 1 | 大模型认知与 Prompt | 1. LLM-Prompt/ |
待写 |
| 2 | LLM API 与模型选型 | 2. LLM-API/ |
待写 |
| 3 | RAG 检索增强 | 5. RAG-Knowledge/ |
待写 |
| 4 | Agent 与工具调用 | 4. Agent-Practice/ |
待写 |
| 5 | 应用框架(LangChain / LangGraph) | 3. LangChain/ |
待写 |
| 6 | 模型部署(Ollama / vLLM / Qwen) | 6. Deploy-Platform/ |
待写 |
| 7 | 微调(LoRA / LLaMA-Factory,按需) | 7. Fine-Tuning/ |
待写 |
| 8 | 多 Agent 与 MCP | 8. Multi-Agent-MCP/ |
原理文已完成 |
| 9 | 平台工程与生产化 | 9. Production/ |
待写 |
| 10 | 实战案例 | 10. Case-Study/ |
待写 |
学习顺序:
text
Prompt + API(1→2)→ RAG + Agent + 框架(3→4→5)
→ 本地部署(6)→ 微调按需(7)→ 多 Agent / MCP / 生产化(8→9)→ 案例(10)
三阶段串联
业务人员通过对话界面,查询信托产品净值并生成 AI 解读报告。
| 阶段 | 承担部分 | 索引 |
|---|---|---|
| Step 1 | SSE 流式 UI、Markdown 报告 | front/all.md §10 |
| Step 2 | 产品 API、净值 DB、鉴权 | backend/all.md §9 |
| Step 3 | RAG + Agent 编排 + 工具调 API | ai/all.md §10 |