Day 1 | 前端转全栈的思维切换：你以为在学后端，其实你在学系统

本系列基于真实项目（事故分析系统：三端协作：Vue3 前端 + Spring Boot 后端 + uni-app 移动端）实战经验，讲述如何借助 AI 从前端开发者成长为真正的全栈工程师。

---

你不是"学后端"，你是学"系统"

大多数前端开发者转型全栈，第一步就错了——他们把后端当成"又一门语言/框架"来学，像学 Vue3 那样学 Spring Boot。

这不是学习，这是搬家。

前端思维的核心是：UI → 状态 → 交互。数据来了，渲染。事件来了，更新状态。

全栈思维的核心是：请求 → 处理 → 存储 → 返回。数据从哪来，存到哪，谁可以读，谁可以改。

这不是技术栈的区别，是系统视角的区别。

你写 Vue3 的时候，API 响应的数据在你脑子里是"JSON"。但后端看同样的数据，是"一行 MySQL 记录 + 一次 JOIN + 一个缓存键"。

理解了这个，你就知道为什么光是"学 Spring Boot 注解"救不了你——你需要学的是一个请求从客户端发出到数据库落盘再返回的全链路。

---

AI 在全栈学习中的真正角色

很多前端开发者用 AI 的方式是：让它帮我写代码。这在大多时候够用，但转全栈的时候你会发现——你问不出好问题。

因为全栈的问题不是"这个代码怎么写"，而是：

• “我这个 SQL 查询为什么这么慢，索引加在哪？”
• “Spring Boot 的 Bean 生命周期到底是怎么回事，@Autowired 和构造函数注入怎么选？”
• “用户登录后 token 存在哪，刷新机制怎么做才安全？”

这些问题需要你先理解系统的一部分，才能问出来。

所以 AI 在全栈学习中扮演的角色应该是：

陪练，不是教练。 它能帮你验证理解、纠正偏差、生成代码样本，但你得先有足够的问题意识。

我合作的前端开发者（也就是写这个系统的人）在推进项目时，用的就是这个模式：先有根因分析（哪里不懂），再让 AI 解释，然后让 AI 生成代码，最后自己验证。根因 → 修复 → 验证，一次一条。

---

第一天的开发环境（Windows + Git Bash）

转全栈第一步：把你的 Windows 环境变成一个真正的全栈开发环境。

核心工具链

# Java（后端运行时）
# 下载 JDK 17+ from https://adoptium.net/
# 安装后配置环境变量
export JAVA_HOME="/c/Program Files/Eclipse Adoptium/jdk-17.0.11.9-hotspot"
export PATH="$JAVA_HOME/bin:$PATH"
java -version  # 验证

# Node.js（前端 + 部分工具）
# 下载 LTS 版本 https://nodejs.org/
node -v
npm -v

# MySQL（本地数据库）
# 下载 MySQL 8.x https://dev.mysql.com/downloads/mysql/
# 或用 phpstudy / XAMPP 快速启动
# Windows 无 mysql CLI？用 Python 连接：
pip install pymysql
python -c "import pymysql; print('MySQL client OK')"

# Git Bash（命令行环境，贯穿全程）
# 已安装：验证
git --version

项目的目录结构（真实项目参考）

D:/shaaxitaiyuan/
├── shanxi-accident-system/      # 主项目（真实全栈项目）
│   ├── accident-web/            # Vue3 前端（5173端口）
│   ├── accident-server/         # Spring Boot 后端（8080端口）
│   └── accident-app/            # uni-app 移动端
└── ai-fullstack-course/         # 本课程练习目录

经验之谈： 项目路径全程使用纯 ASCII，避免 Windows Unicode 路径归一化导致的编译错误。这条经验是从真实踩坑里出来的，不是纸上谈兵。

---

今日任务清单

1. 配置 Java + MySQL 环境，验证 java -version 和数据库连接
2. 阅读一个真实后端项目（可以是事故分析系统的后端），理解目录结构：
   • src/main/java/... — Java 源码
   • src/main/resources/ — 配置文件（application.yml）
   • pom.xml 或手动 lib 目录 — 依赖管理
3. 用 AI 问第一个好问题： “给我讲清楚一个 HTTP 请求从 Spring Boot 入口到 MySQL 查询返回的全链路，我只懂 Vue3，请求举例说明”

---

思维升级

前端转全栈最难的，不是某个框架的 API，而是把数据当成一个系统来理解。
今天的重点不是动手，是换脑。