Level 1 / 阅读练习
大白话学习路线图
先看完整顺序,再按文章逐篇学习。
Progress
阅读中
0/4 步完成 / 阅读后完成练习才算通关
Practice
本关怎么过
- 读完正文后确认完成阅读
- 完成 3 道选择题练习
- 答错时看解释,再回到正文补理解
这个目录用来记录 content/learn/ 里的文章阅读顺序。以后文章变多时,先看这里,不用靠文件名猜学习路线。

前端框架学习路线
这条路线用同一个“用户管理后台”案例,把 React 和 Vue 的基础、核心、工程化、生态架构、横向对比串起来。
统一案例包含:
用户列表
搜索筛选
新增/编辑弹窗
删除确认
表单校验
API 请求
Loading / Error 状态
路由跳转
全局状态
权限控制
工程化目录组织建议按下面顺序学习:
| 顺序 | 文章 | 学完你应该知道什么 |
|---|---|---|
| 1 | 大白话讲解——前端框架学习路线图.md | React/Vue 学习顺序、统一案例、每篇文章的学习产出 |
| 2 | 大白话讲解——React 入门篇:组件 JSX Props State.md | React 19、JSX、组件、Props、State、静态用户列表 |
| 3 | 大白话讲解——React 核心篇:Hooks 表单 请求 用户列表.md | Hooks、表单、请求、loading/error、自定义 Hook |
| 4 | 大白话讲解——React 进阶篇:路由 状态管理 权限 工程化.md | React Router、权限、状态管理、TypeScript、工程化目录 |
| 5 | 大白话讲解——Vue 入门篇:模板 指令 组件 响应式.md | Vue 3.5、script setup、模板、指令、ref/reactive、静态用户列表 |
| 6 | 大白话讲解——Vue 核心篇:Composition API 表单 请求 用户列表.md | Composition API、表单、请求、loading/error、composable |
| 7 | 大白话讲解——Vue 进阶篇:Router Pinia 权限 工程化.md | Vue Router、Pinia、权限、接口层、TypeScript、工程化目录 |
| 8 | 大白话讲解——React vs Vue 心智模型对比.md | render/commit、状态快照、Proxy 响应式、依赖追踪、更新调度 |
| 9 | 大白话讲解——React vs Vue 真实开发任务对比.md | 同一业务任务在 React 和 Vue 中如何分别落地 |
| 10 | 大白话讲解——React 生态全景与项目架构.md | React Router、状态管理、请求缓存、表单、组件库、Next.js、测试怎么组成项目 |
| 11 | 大白话讲解——Vue 生态全景与项目架构.md | Vue Router、Pinia、Nuxt、请求封装、表单、组件库、测试怎么组成项目 |
| 12 | 大白话讲解——React vs Vue 生态架构横向对比.md | 两边生态风格、架构分层、SSR、跨端、测试、团队协作和长期维护差异 |
Python 后端工程学习路线
这条路线的目标不是只会写几个接口,而是逐步做到:
会 Python
懂 HTTP/API
能写 FastAPI 服务
懂 SQL 和表关系
会数据库和 ORM
会输入校验
会登录鉴权
会接缓存
能让服务稳定跑起来
逐步建立工程化意识建议按下面顺序学习:
| 顺序 | 文章 | 学完你应该知道什么 |
|---|---|---|
| 1 | 大白话讲解——Python 后端够用基础.md | Python 写后端最常用的变量、函数、类、模块、异常、类型提示、异步 |
| 2 | 大白话讲解——HTTP JSON REST API 大白话.md | 请求、响应、JSON、状态码、Header、REST 路径设计 |
| 3 | 大白话讲解——FastAPI 入门到进阶.md | FastAPI 是什么、接口是什么、参数怎么传、/docs 怎么用 |
| 4 | 大白话讲解——Pydantic 接口输入校验.md | 必填/可选、字段规则、枚举、嵌套对象、自定义校验、响应模型 |
| 5 | 大白话讲解——FastAPI 搭建标准的 API 服务.md | 标准 API 服务的目录、配置、路由、鉴权、错误、日志、部署基础 |
| 6 | 大白话讲解——关系型数据库和 SQL 够用基础.md | 表、行、列、主键、外键、SQL、索引、事务、ORM 对应关系 |
| 7 | 大白话讲解——FastAPI 连接数据库并实现增删改查.md | 怎么连接数据库,怎么用 SQLAlchemy 写增删改查 |
| 8 | 大白话讲解——FastAPI 使用 Alembic 管理数据库表结构.md | 为什么正式项目要用迁移,怎么生成、执行、回滚数据库迁移 |
| 9 | 大白话讲解——FastAPI 登录认证和 JWT 鉴权.md | 登录、发 token、校验当前用户、保护接口、管理员权限 |
| 10 | 大白话讲解——Redis 缓存和限流.md | 什么时候用 Redis、接口缓存、TTL、缓存失效、接口限流 |
| 11 | 大白话讲解——后端系统分层架构.md | API、Schema、Service、Repository、Model、Core 分别负责什么 |
| 12 | 大白话讲解——Docker入门到进阶.md | Docker 的镜像、容器、端口、数据卷、Dockerfile、Compose 基础 |
| 13 | 大白话讲解——Docker Compose 跑完整后端服务.md | FastAPI、PostgreSQL、Redis 怎么用 Compose 一起跑 |
| 14 | 大白话讲解——后端服务稳定性.md | 异常、日志、健康检查、超时、重试、限流、降级、监控 |
| 15 | 大白话讲解——后端测试和工程化.md | pytest、接口测试、测试数据库、mock、ruff、CI/CD、发布检查 |
AI 全栈扩展路线
| 建议阶段 | 文章 | 适合什么时候看 |
|---|---|---|
| 刚开始规划 AI 学习路线时 | 大白话讲解——AI 全栈学习导航.md | 想知道前端、后端、数据、大模型、部署怎么组合成 AI 产品时 |
| 学完 FastAPI 基础和后端分层后 | 大白话讲解——LangChain 入门到实战.md | 想把大模型、提示词、工具、知识库和后端服务串起来时 |
前端工程化扩展路线
| 建议阶段 | 文章 | 适合什么时候看 |
|---|---|---|
| 已经有多个前端项目或准备抽公共包时 | 大白话讲解——pnpm + monorepo + Turborepo 管理多项目.md | 想用 pnpm workspace 和 Turborepo 管理官网、后台、AI 前端、BI 前端等多个项目时 |
项目实战路线
这条路线适合在你已经看过前端框架、FastAPI、数据库、登录鉴权之后再读。它的目标是把分散知识串成真实项目闭环。
| 顺序 | 文章 | 学完你应该知道什么 |
|---|---|---|
| 1 | 大白话讲解——从 0 到 1 做一个用户管理系统.md | 一个小后台如何拆成前端页面、后端接口、数据库、登录鉴权和权限控制 |
| 2 | 大白话讲解——前后端接口联调.md | 接口契约、跨域、token、分页、表单、错误码和联调排查顺序 |
| 3 | 大白话讲解——后台权限系统设计.md | 用户、角色、权限、菜单、按钮、路由和后端接口权限如何形成闭环 |
| 4 | 大白话讲解——SQLAlchemy 关系查询和性能优化.md | 一对多、多对多、relationship、N+1 查询、提前加载和分页性能 |
| 5 | 大白话讲解——FastAPI 项目配置、多环境和部署上线.md | .env、dev/test/prod、Docker Compose、Nginx、HTTPS、健康检查和上线流程 |
| 6 | 大白话讲解——AI 应用里的 RAG 知识库实战.md | 文档上传、切分、向量化、检索、Prompt、引用来源和效果调试 |
上线运维路线
这条路线适合在你已经做出一个能跑的项目之后再读。它的目标不是继续堆功能,而是让项目上线后更安全、更稳定、更容易排查问题。
| 顺序 | 文章 | 学完你应该知道什么 |
|---|---|---|
| 1 | 大白话讲解——生产环境日志、监控和告警.md | 日志、指标、request_id、P95、慢查询、告警阈值和接口变慢排查 |
| 2 | 大白话讲解——CI/CD、发布和回滚.md | CI 检查、CD 部署、固定制品、冒烟测试、发布观察和回滚流程 |
| 3 | 大白话讲解——后端安全加固实战.md | 密码 hash、token、权限校验、CORS、限流、SQL 注入、文件上传和密钥管理 |
| 4 | 大白话讲解——数据库备份、迁移和恢复.md | 数据库备份、恢复演练、生产迁移、危险改表和数据回滚策略 |
| 5 | 大白话讲解——接口契约、版本管理和文档.md | 接口契约、OpenAPI、字段变更、版本管理、错误码和契约测试 |
| 6 | 大白话讲解——生产问题排查 Runbook.md | 线上故障确认、影响范围、止血、定位、恢复、记录和复盘流程 |
推荐学习节奏
- 如果你先补前端框架能力,先按“前端框架学习路线”完成 12 篇,重点用同一个用户管理后台案例反复练。
- 如果你先补后端能力,Python 后端路线第 1-2 篇先建立 Python 和 HTTP 基础,不急着写复杂项目。
- Python 后端路线第 3-5 篇开始写 FastAPI,重点吃透接口、校验、标准目录。
- Python 后端路线第 6 篇先补数据库和 SQL 底座,避免一上来学 ORM 时只会照抄代码。
- Python 后端路线第 7-9 篇进入真实后端:CRUD、迁移、登录鉴权。
- Python 后端路线第 10-11 篇补工程设计:缓存、限流、分层架构。
- Python 后端路线第 12-14 篇解决“跑起来”和“稳定跑”:Docker、Compose、稳定性。
- Python 后端路线第 15 篇建立工程化意识:测试、检查、发布流程。
- 最后看 AI 全栈扩展路线,把前端、后端、大模型应用串成完整产品。
- 如果开始维护多个前端项目,再学习 pnpm、monorepo 和 Turborepo,把依赖、共享包、构建任务管清楚。
- 当前后端和前端基础都看过后,按“项目实战路线”做用户管理系统,把文章里的知识真正串起来。
- 项目能跑起来之后,再看“上线运维路线”,补齐日志监控、发布回滚、安全、备份、接口契约和故障处理。
当前文章状态
| 文章 | 状态 |
|---|---|
| 前端框架学习路线图 | 已完成 |
| React 入门篇:组件 JSX Props State | 已完成 |
| React 核心篇:Hooks 表单 请求 用户列表 | 已完成 |
| React 进阶篇:路由 状态管理 权限 工程化 | 已完成 |
| Vue 入门篇:模板 指令 组件 响应式 | 已完成 |
| Vue 核心篇:Composition API 表单 请求 用户列表 | 已完成 |
| Vue 进阶篇:Router Pinia 权限 工程化 | 已完成 |
| React vs Vue 心智模型对比 | 已完成 |
| React vs Vue 真实开发任务对比 | 已完成 |
| React 生态全景与项目架构 | 已完成 |
| Vue 生态全景与项目架构 | 已完成 |
| React vs Vue 生态架构横向对比 | 已完成 |
| Python 后端够用基础 | 已完成 |
| HTTP JSON REST API 大白话 | 已完成 |
| FastAPI 入门到进阶 | 已完成 |
| Pydantic 接口输入校验 | 已完成 |
| FastAPI 搭建标准的 API 服务 | 已完成 |
| 关系型数据库和 SQL 够用基础 | 已完成 |
| FastAPI 连接数据库并实现增删改查 | 已完成 |
| FastAPI 使用 Alembic 管理数据库表结构 | 已完成 |
| FastAPI 登录认证和 JWT 鉴权 | 已完成 |
| Redis 缓存和限流 | 已完成 |
| 后端系统分层架构 | 已完成 |
| Docker 入门到进阶 | 已完成 |
| Docker Compose 跑完整后端服务 | 已完成 |
| 后端服务稳定性 | 已完成 |
| 后端测试和工程化 | 已完成 |
| AI 全栈学习导航 | 已完成 |
| LangChain 入门到实战 | 已完成 |
| pnpm + monorepo + Turborepo 管理多项目 | 已完成 |
| 从 0 到 1 做一个用户管理系统 | 已完成 |
| 前后端接口联调 | 已完成 |
| 后台权限系统设计 | 已完成 |
| SQLAlchemy 关系查询和性能优化 | 已完成 |
| FastAPI 项目配置、多环境和部署上线 | 已完成 |
| AI 应用里的 RAG 知识库实战 | 已完成 |
| 生产环境日志、监控和告警 | 已完成 |
| CI/CD、发布和回滚 | 已完成 |
| 后端安全加固实战 | 已完成 |
| 数据库备份、迁移和恢复 | 已完成 |
| 接口契约、版本管理和文档 | 已完成 |
| 生产问题排查 Runbook | 已完成 |
Checkpoint
读完后做题闯关
先读正文,再用下面的选择题检查自己是否真的理解。答错会出现解释,可以回到正文补一眼再重选。
先完成阅读
读完正文后点击“我已读完,进入练习”,题目会变成可答状态。