给后端工程师的学习路线
用接口、状态、路由、依赖管理等熟悉的后端概念，对照理解 Vue 组件、响应式、Router、Pinia 与 Vite。
后端转前端Vue 3 + H5 移动端实战教程
用后端概念理解前端，从 HTML、CSS、JavaScript 一路学到 Vue 3 工程化和移动端项目实战。
Skip to content
这套教程适合谁
这套教程面向有后端开发经验、想系统补齐前端能力的开发者。课程不会假设你已经熟悉复杂的前端工具链，而是先让页面跑起来，再逐步引入Vue 3和工程化。
学习时建议按顺序进行：
text
前端地基
↓
Vue 3 核心
↓
工程化开发
↓
H5 移动端
↓
TypeScript
↓
移动端项目实战后端与Vue概念对照
| 后端概念 | 前端 / Vue 对应概念 |
|---|---|
| 函数 / 类 | 组件 Component |
| 方法入参 | props |
| 回调 / 事件 | emit |
| 成员变量 / 实例状态 | ref / reactive |
| 计算属性 getter | computed |
| 观察者 / 监听器 | watch |
| URL路由映射 | Vue Router |
| 全局Service / 缓存 | Pinia |
| HttpClient / RestTemplate | axios |
| Maven / Gradle | Vite + npm |
| pom.xml | package.json |
怎么学习效果最好
- 按左侧目录顺序学习，不要先跳到工程化章节。
- 每章先读讲义，再打开配套在线Demo。
- 至少改一个变量、样式或交互，再刷新页面观察变化。
- 到第2部分后，在本机安装Node.js并运行配套Vue项目。
- 最后完成商品应用，不要停留在“看懂代码”。