开发实践与AI学习路径

🎯 实现目标

从零做出第一个能给别人展示的 AI 小 Demo，建立「我也能做」的正反馈。核心流程：定目标 → 验证效果 → 搭页面 → 部署拿链接。

📝 详细分步实操

1. 定目标：一句话写清「给谁看、解决什么问题、演示哪个动作」，写不下来就先别动手。
2. 验证效果：打开模型官方 Playground，手动把演示内容生成出来，确认输出可用、风格对路。
3. 备素材：把文案、示例数据、图片整理到一个文件夹，命名清楚。
4. 建工程：新建文件夹，里面建 index.html、style.css、script.js 三个文件。
5. 让 AI 写初版：把需求和素材路径贴给 AI，让它生成完整页面代码。
6. 本地跑起来：用 VS Code 的 Live Server 插件，或命令行 python -m http.server 8000 起服务。
7. 联调核心流程：按钮 → 请求 → 渲染结果，逐段在浏览器控制台 console.log 排查。
8. 部署上线：推送到 GitHub 仓库，用 GitHub Pages（免费）或 Vercel 拿公网链接。
9. 写三句话讲稿：它解决什么问题 / 怎么做到的 / 下一步做什么。

🎯 实现目标

完成一个微信小程序从注册、开发、提审到上线的全流程，做出一个微信里即点即用的应用。

📝 详细分步实操

1. 注册账号：微信公众平台 → 立即注册 → 小程序 → 邮箱验证 → 选「个人」主体（免费，无支付能力）。
2. 完善信息：设置名称（一年可改两次）、头像、简介、服务类目（选最贴近的，类目错了会被驳回）。
3. 拿 AppID：在「开发管理 → 开发设置」里复制 AppID，后面创建项目要用。
4. 下载微信开发者工具：官网选稳定版，扫码登录，注意安装路径不要有中文。
5. 创建项目：选「JavaScript 基础模板」，填入 AppID，不勾选云开发（新手先用原生）。
6. 认识目录：app.json 管全局配置（窗口/页面路由），pages/ 里每个页面是一对 .wxml + .js + .wxss 文件。
7. 开发首页：让 AI 帮你写 WXML 和 JS，重点理解数据绑定（{{}} 语法）和 setData 更新。
8. 真机预览：点工具栏「预览」，手机微信扫码，检查布局和交互。
9. 处理调试坑：开发阶段在详情里勾选「不校验合法域名」；上线前必须在后台配置 request 合法域名（必须是 HTTPS）。
10. 提交审核：填类目 + 用户隐私保护指引（不填必被驳回），等审核（一般 1-2 个工作日）。
11. 发布：审核通过后点「发布」，可选灰度发布，先发 10% 观察。

🎯 实现目标

把应用做到 QQ 生态，从注册到发布全流程走通；已有微信小程序代码可低成本迁移。

📝 详细分步实操

1. 注册：QQ 开放平台 → 注册开发者 → 创建应用 → 选「小程序」类型，完善主体信息。
2. 下载工具：QQ 小程序开发者工具，登录并关联刚创建的应用，拿到 AppID。
3. 建项目：模板结构与微信小程序高度相似，选择与微信一致的 JS 模板降低迁移成本。
4. 迁移改造：把微信小程序代码复制过来，替换 AppID，逐个检查差异 API（登录、支付、分享）。
5. 调试：先用模拟器过一遍，再点真机预览，手机 QQ 扫码实测。
6. 提审：按平台要求填类目、资质、隐私说明，提交审核。
7. 发布：审核通过后发布上线，观察 QQ 内入口数据。

🎯 实现目标

做出自己的网站，并让全世界通过网址访问；从静态站起步，进阶可上服务器跑动态站。

📝 详细分步实操

1. 定方案：纯静态站（免费托管）还是动态站（需服务器 + 数据库），新手先做静态站。
2. 建目录：根目录放 index.html、css/、js/、img/，命名规范。
3. 写页面：让 AI 生成初稿，自己调整结构和文案，重点保证移动端适配。
4. 本地预览：Live Server 或 python -m http.server，逐页检查跳转。
5. 建仓库：GitHub 新建仓库，本地 git init → add → commit → push 推上去。
6. 部署静态站：仓库 Settings → Pages → 选分支 → 开启，几分钟后拿到 https://用户名.github.io/仓库名 链接。
7. 绑自定义域名（可选）：域名 DNS 加 CNAME 记录指向 GitHub Pages，仓库里放 CNAME 文件。
8. 上服务器（进阶）：买云服务器，装 Nginx + Node/Python，用 Docker 部署更省心。
9. 备案：域名解析到国内服务器必须先 ICP 备案（约 1-3 周），期间可用海外服务器过渡。
10. HTTPS：GitHub Pages / Vercel 自动签发证书；自建服务器用免费证书（Let's Encrypt）。
11. 上线验证：手机流量访问、多浏览器测试、检查控制台报错。

🎯 实现目标

做一个能安装到手机上的原生质感 App，走通「开发 → 真机调试 → 打包 → 上架」完整链路。

📝 详细分步实操

1. 选路线：Flutter（推荐，渲染一致）/ React Native / uni-app，新手首选 Flutter。
2. 装环境：装 Flutter SDK → 配置环境变量 → 装 Android Studio + 模拟器 → 命令行 flutter doctor 检查是否全绿。
3. 创建工程：flutter create my_app，用 VS Code 打开。
4. 写首屏 UI：用 AI 辅助写 Dart 组件，跑模拟器看效果（热重载 r 键秒刷）。
5. 加逻辑：状态管理（setState 起步）+ 网络请求（http 包）。
6. 接 AI 功能（可选）：调用大模型 API，做成问答 / 润色工具。
7. 真机调试：手机开 USB 调试连电脑，flutter run 实机验证。
8. 打包：flutter build apk 生成安装包，先装到手机自测。
9. 上架：安卓上各应用商店（备软著、隐私协议）；iOS 需要 Mac + 99 美元/年开发者账号。

🎯 实现目标

做出一个玩法成立、别人愿意玩的小游戏，走完「原型 → 内容 → 测试 → 发布」最小闭环。

📝 详细分步实操

1. 定玩法：用一句话写清核心机制（如「躲避障碍越久分越高」）+ 一个目标，越小越好。
2. 下载 Godot：官网选 4.x 稳定版，Windows 直接解压即用。
3. 建项目：新建 2D 项目，认识场景（Scene）和节点（Node）体系。
4. 做主角：先用简单色块/几何形状占位，不用等美术。
5. 写核心逻辑：GDScript 脚本控制移动、碰撞、计分，配合官方文档边查边写。
6. 做玩法闭环：目标达成 / 失败重开 / 分数记录，缺一不可。
7. 补内容：用 AI 生成美术、音乐、音效，替换占位素材。
8. 找 2-3 个人测试：观察他们卡在哪、哪里无聊，迭代 2-3 轮。
9. 发布：网页版导出 HTML5 传 itch.io（免费）；桌面版打包后可选上 Steam。

🎯 实现目标

做一个能自主规划、调用工具、完成任务并安全收手的 AI 智能体应用。

📝 详细分步实操

1. 选平台：Coze（免代码、最快）→ Dify（可自部署）→ LangChain / 原生代码（最灵活）。
2. 定目标任务：写清「输入什么 → Agent 要做什么 → 输出什么」，边界越窄越容易成功。
3. 配置工具：把搜索、网页读取、查数据库、调 API 封装成 Agent 可调用的工具函数。
4. 写系统指令：角色 + 规则 + 边界（什么情况必须停下来问人）。
5. 测试多轮：故意给模糊、危险、越权指令，确认它不会乱调工具。
6. 加记忆：短期对话记忆 + 长期知识（接 RAG 向量检索）。
7. 加护栏：每个工具的权限、调用次数上限、单任务预算上限。
8. 部署上线：接入口令、限流、日志审计，观察真实使用再迭代。

🎯 实现目标

把开源 AI 工具（如 Ollama、Open WebUI）改造成自己专属的版本，学会「看懂 → 改对 → 发得出」。

📝 详细分步实操

1. 选项目：优先社区活跃、文档全、star 高的开源工具，别选停更的。
2. 读 README + 许可证：先看 License（GPL 传染性 / MIT 自由），再决定能不能改、改完怎么发。
3. Fork + Clone：GitHub 上 Fork 到自己账号，本地 git clone 下来。
4. 按文档跑起来：装依赖 → 配环境变量 → 本地启动，先确认原项目能跑。
5. 摸结构：看目录、入口文件、配置文件，画一张「项目地图」。
6. 找扩展点：前端样式 / 配置项 / API 层，从最小改动开始。
7. 改一处验证一处：比如改主题色 → 重启 → 确认生效，再改下一处。
8. 构建发布：Docker 打包或生成安装包，推到自己的仓库或团队内部。

🎯 实现目标

做一个浏览器扩展（如 AI 划词翻译、网页摘要助手），从本地加载到上架商店全流程走通。

📝 详细分步实操

1. 建文件夹：新建插件目录，先写 manifest.json（声明名称、版本、权限、入口，用 Manifest V3）。
2. 写内容脚本 content script：注入网页，监听划词事件，把选中文本提取出来。
3. 做弹出页 popup：HTML + JS 的小界面，放输入框、设置项、结果显示区。
4. 接 AI API：把文本发给模型接口，返回翻译 / 摘要结果（建议经自己的后端代理转发，防 Key 泄漏）。
5. 本地加载：地址栏输 chrome://extensions → 开启开发者模式 → 加载已解压的扩展 → 立即生效。
6. 多页面测试：普通网页、后台标签、无痕模式都测一遍，修掉兼容问题。
7. 上架 Chrome 商店：注册开发者账号（一次性 5 美元）→ 打包 zip → 提交截图、说明、隐私政策 → 等审核。

🎯 实现目标

把 GitHub 开源项目部署成自己的线上服务，并做个性化修改，建立可持续的更新机制。

📝 详细分步实操

1. 选项目：看 star 数、最近提交时间、README 完整度、License 类型，四者缺一不可。
2. 读 README：确认功能、依赖环境、端口、环境变量清单。
3. 准备环境：服务器装 Docker（最省心）或按项目要求装 Node / Python。
4. Clone + 配置：git clone，复制 .env.example 为 .env，填好密钥和数据库地址。
5. 本地 / 服务器跑通：docker compose up 一键起服务，先确认原版能跑。
6. 个性化修改：改站点名、主题色、Logo、文案，提交到自己的分支。
7. 反代 + HTTPS：Nginx 配反向代理 + 免费证书（Let's Encrypt），域名指向服务器。
8. 建立更新机制：定期 git pull 上游 master，解决冲突后重新构建部署。

🎯 实现目标

不依赖后端和数据库，用纯 HTML/CSS/JS 做出一个能上线的个人网站或落地页，掌握静态网站的完整开发流程。

📝 详细分步实操

1. 定方向：先想清楚网站做什么（个人主页/作品集/产品落地页/博客），画一张简单的页面草图（纸上画就行）。
2. 建工程：新建文件夹，创建 index.html、style.css、script.js 三个文件，用 VS Code 打开文件夹。
3. 写 HTML 骨架：用 ! 快捷键（VS Code 装 EMMET 插件）生成基础结构，规划 header/nav/main/section/footer 语义化标签。
4. 写 CSS 样式：先写全局重置（margin/padding 清零、box-sizing: border-box），再按从上到下的顺序写各区块样式，用 CSS 变量管理颜色和字体。
5. 加交互：用原生 JS 实现导航高亮、回到顶部、表单验证、移动端菜单展开收起等基础交互。
6. 做响应式：用媒体查询（@media）适配手机和平板，先做 PC 版再压缩到移动端，重点检查导航和图片。
7. 本地预览：用 VS Code 的 Live Server 插件右键 Open with Live Server，实时看效果，改代码自动刷新。
8. 检查兼容性：在 Chrome 和 Edge 分别打开，用开发者工具的设备模拟功能检查手机端显示。
9. 优化性能：压缩图片（用 TinyPNG 在线压缩）、合并 CSS/JS、加懒加载，确保首屏加载在 3 秒内。
10. 部署上线：推到 GitHub 仓库，开启 GitHub Pages，或用 Vercel/Netlify 一键导入，拿到公网链接。

🎯 实现目标

从原生三件套到现代前端工程化，系统掌握前端开发技能栈，能独立开发中大型 Web 应用。

📝 详细分步实操

1. 夯实基础：深入学 JS（ES6+ 语法、异步编程 Promise/async-await、DOM 操作、事件机制），推荐做 3-5 个原生 JS 小项目（待办清单/天气应用/计算器）。
2. 学 CSS 进阶：Flexbox 和 Grid 布局（必学）、CSS 变量、动画过渡、BEM 命名规范、响应式设计，做一个纯 CSS 作品集页面。
3. 选一个框架：React 或 Vue 二选一（国内 Vue 多，国外 React 多），跟着官方教程做一个 Todo App，理解组件化思想、状态管理、生命周期。
4. 工程化入门：用 Vite 或 Create React App 脚手架创建项目，理解 package.json、依赖管理（npm install）、开发服务器、热更新。
5. 学路由和状态管理：React Router / Vue Router 做多页面应用，Redux/Zustand（React）或 Pinia（Vue）管理全局状态，做一个带登录和列表页的小应用。
6. 接口联调：学 fetch / Axios 发请求，理解 RESTful API、跨域 CORS、请求拦截器，用 Mock 数据或公开 API（如 JSONPlaceholder）练手。
7. UI 组件库：学一个组件库（Ant Design / Element Plus / shadcn-ui），快速搭建管理后台或表单页面，理解主题定制。
8. TypeScript：学 TS 基础类型、接口、泛型，把一个 JS 项目改写成 TS，理解类型安全的好处（大型项目必备）。
9. 性能优化：学 Lighthouse 跑分、代码分割（React.lazy）、图片懒加载、虚拟列表、首屏优化，把一个慢网站优化到 90 分以上。
10. 部署和 CI/CD：用 Vercel/Netlify 部署前端项目，配 GitHub Actions 自动部署，理解环境变量、构建命令、dist 目录。

🎯 实现目标

用 Node.js + Express 搭建一个 RESTful API 服务，掌握路由、数据库、认证、部署全流程，能独立开发后端接口。

📝 详细分步实操

1. 理解 HTTP：学请求方法（GET/POST/PUT/DELETE）、状态码（200/400/401/404/500）、请求头/响应头、JSON 数据格式，用 Postman 发几个请求感受一下。
2. 初始化项目：mkdir my-api && cd my-api && npm init -y，安装 express（npm install express），创建 app.js 写一个 Hello World 接口。
3. 设计路由：按资源划分路由（/users、/posts、/comments），用 Express Router 模块化，每个资源实现 CRUD 四个接口（增删改查）。
4. 中间件：学 Express 中间件机制，写日志中间件（记录每个请求的方法/路径/耗时）、错误处理中间件（统一捕获异常返回标准格式）、CORS 中间件（允许前端跨域访问）。
5. 接数据库：选 MongoDB（上手快，用 Mongoose ODM）或 MySQL（传统关系型，用 Sequelize ORM），设计数据模型（Schema），实现接口的真实数据读写。
6. 数据校验：用 Joi / Zod 做请求参数校验，在接口入口拦截非法数据，返回清晰的错误提示（不要把数据库错误直接暴露给前端）。
7. 用户认证：实现注册/登录接口，密码用 bcrypt 加密存储，登录成功签发 JWT Token，后续接口用中间件校验 Token（鉴权），区分普通用户和管理员。
8. 分页和排序：列表接口实现分页（page/pageSize）、排序（sortBy/order）、过滤（keyword/category），返回统一格式 {code, message, data: {list, total}}。
9. 接口文档：用 Swagger / Apifox 自动生成接口文档，每个接口写清楚参数、响应格式、示例，方便前端联调。
10. 部署上线：服务器装 Node.js，用 PM2 守护进程（pm2 start app.js），Nginx 反向代理 + HTTPS，配环境变量（数据库密码/密钥不写代码里）。

🎯 实现目标

在自己电脑上用 Ollama 跑大模型，实现完全离线、隐私安全的本地 AI 对话，掌握模型选择、参数调优和常见应用搭建。

📝 详细分步实操

1. 下载安装：去 Ollama 官网（ollama.com）下载对应系统安装包，Windows 双击安装，macOS 拖入应用文件夹，安装后命令行输入 ollama --version 验证。
2. 选模型：根据自己的硬件选模型——8GB 内存选 qwen2:1.8b 或 llama3.2:1b；16GB 选 qwen2.5:7b 或 llama3.1:8b；32GB+ 选 qwen2.5:14b 或 mixtral:8x7b。模型名后面加 : 版本号 指定量化版本（如 qwen2.5:7b-instruct-q4_K_M）。
3. 拉取模型：命令行 ollama pull qwen2.5:7b（首次会下载模型文件，7B 模型约 4-5GB，耐心等待），下载完用 ollama list 查看已安装模型。
4. 命令行对话：ollama run qwen2.5:7b 进入交互模式，直接打字对话，输入 /bye 退出，/clear 清空上下文，/? 查看所有命令。
5. 调参数：运行时加参数控制生成效果——ollama run qwen2.5:7b --temperature 0.7（创造性，0=最确定，1=最随机）、--top_p 0.9、--num_ctx 4096（上下文长度，越大越吃内存）。
6. API 调用：Ollama 自带 REST API（默认 http://localhost:11434），用 curl 或 Python requests 发请求，实现编程调用，接口格式兼容 OpenAI（/v1/chat/completions）。
7. 装可视化界面：推荐 Open WebUI（一键 docker 部署）或 LobeChat / Chatbox，连接本地 Ollama API，获得类似 ChatGPT 的网页界面，支持多轮对话、模型切换、对话管理。
8. 跑多模态：ollama pull llava 或 qwen2.5-vl:7b，支持图片理解，用 Open WebUI 直接拖图片进去提问（识别图表/截图/照片内容）。
9. 做本地应用：基于 Ollama API 做自己的应用——本地知识库问答（配合 RAG）、代码助手、文档总结、翻译工具，数据完全不出本机。
10. 性能优化：有 NVIDIA 显卡装 CUDA 加速（自动识别）；内存不够用 --num_ctx 调小上下文；同时跑多个模型会抢占显存，建议一次只跑一个；模型文件存在 ~/.ollama/models，可迁移到其他盘。

🎯 实现目标

从零开发一个能自主规划、调用工具、完成复杂任务的 AI Agent，掌握 Agent 核心架构（规划+工具+记忆+执行）和主流框架使用。

📝 详细分步实操

1. 理解 Agent 原理：学 Agent 四大核心组件——规划（Planning，把大任务拆成小步骤）、工具（Tools，调用外部能力如搜索/代码执行/API）、记忆（Memory，短期上下文+长期知识库）、执行（Action，调用工具并观察结果）。
2. 跑通第一个 API：用 Python 调用大模型 API（OpenAI 兼容格式），实现基础对话，理解 system prompt / user message / assistant message 的角色，理解 Function Calling（让模型决定调用哪个工具）。
3. 实现 ReAct 循环：手写一个最简单的 Agent 循环——Thought（思考下一步做什么）→ Action（调用工具）→ Observation（拿到工具结果）→ 循环直到完成，用搜索工具和计算器工具做 demo。
4. 选框架：学 LangChain（最流行，生态全）或 LlamaIndex（RAG 强）或 AutoGen（多 Agent 协作），用框架重写第 3 步的 Agent，理解框架封装了什么（工具注册、循环控制、记忆管理）。
5. 设计工具集：给 Agent 配备实用工具——网络搜索（Tavily/SerpAPI）、代码执行（Python REPL）、文件读写、数据库查询、邮件发送、浏览器操作，每个工具写清楚名称、描述、参数 schema（描述越准确模型调用越准）。
6. 加记忆系统：短期记忆用对话历史（控制 token 数，用摘要压缩旧对话），长期记忆用向量数据库（Chroma/FAISS）存用户偏好和历史事实，Agent 执行前先检索相关记忆。
7. 做一个完整应用：选一个真实场景做项目——个人助理（查邮件+写日程+搜资料）、数据分析 Agent（读数据+分析+生成报告）、客服 Agent（查知识库+回答用户问题+转人工）、代码 Agent（读需求+写代码+测试+修复）。
8. 加错误处理和安全：工具调用失败重试（最多 3 次）、模型输出格式校验（JSON parse 失败让模型重写）、敏感操作人工确认（发邮件/删文件前问用户）、成本控制（记录 token 用量，超预算暂停）。
9. 做前端界面：用 Gradio / Streamlit 快速搭一个聊天界面，或用 Next.js 做正式网页，展示 Agent 的思考过程（Thought/Action/Observation 可视化），支持中断和人工干预。
10. 部署和优化：用 Docker 打包部署，配环境变量管理 API Key，监控 Agent 执行日志，优化系统提示词（迭代调试是 Agent 开发的核心——提示词改一点效果差很多）。

🎯 实现目标

掌握 HuggingFace 生态（模型库/数据集/Spaces/Transformers 库），能下载使用开源模型、加载数据集、训练微调模型、部署在线 Demo。

📝 详细分步实操

1. 注册和配置：注册 HuggingFace 账号，在 Settings → Access Tokens 创建 Token（后面下载私有模型和推送模型要用），命令行 huggingface-cli login 登录。
2. 安装核心库：pip install transformers datasets accelerate torch（PyTorch 是基础），如果有 NVIDIA 显卡装 CUDA 版 PyTorch（去 PyTorch 官网选对应版本），验证 torch.cuda.is_available() 返回 True。
3. 跑通第一个模型：用 Transformers pipeline 快速调用预训练模型——from transformers import pipeline; classifier = pipeline("sentiment-analysis", model="distilbert-base-uncased-finetuned-sst-2-english"); classifier("I love this!")，体验文本分类/情感分析/命名实体识别等任务。
4. 浏览和下载模型：在 huggingface.co/models 搜索需要的模型（按任务/语言/许可筛选），看模型卡（Model Card）了解用法、性能、限制，用 model = AutoModelForCausalLM.from_pretrained("模型名") 自动下载加载。
5. 加载和处理数据集：在 huggingface.co/datasets 找数据集，用 from datasets import load_dataset; ds = load_dataset("数据集名") 加载，理解 Dataset 对象的结构（train/validation/test 划分），用 ds.map() 做数据预处理（tokenize/清洗/过滤），用 ds.train_test_split() 自己划分训练集测试集。
6. 文本生成推理：加载一个生成模型（如 Qwen2.5-7B 或 Llama-3.1-8B），用 AutoTokenizer + AutoModelForCausalLM，理解 generate() 的参数（max_new_tokens/temperature/top_p/do_sample），实现对话生成，大模型用 device_map="auto" 自动分配到 GPU/CPU。
7. 微调一个模型：学 LoRA 微调（参数高效微调，只训练少量参数，普通显卡也能跑），用 peft 库配置 LoRA，用 trl 库的 SFTTrainer 做监督微调，准备自己的数据集（指令-回答对），训练后合并权重并保存。
8. 部署在线 Demo：用 HuggingFace Spaces 免费部署——创建 Space 选 Gradio 或 Streamlit SDK，写一个 app.py（加载模型+创建界面），推送到 Space 仓库，等待自动构建，获得一个公网可访问的 Demo 链接（免费版有 CPU 限制和休眠机制）。
9. 上传自己的模型和数据集：训练好的模型用 model.push_to_hub("用户名/模型名") 上传，写好 Model Card（描述模型用途、训练数据、性能、限制），数据集用 ds.push_to_hub("用户名/数据集名") 上传，配好 Dataset Card。
10. 进阶：学量化推理（用 bitsandbytes 4bit 量化加载大模型，省显存）、学批量推理（pipeline 的 batch_size 参数加速）、学评估模型（用 evaluate 库算准确率/BLEU/ROUGE 等指标）、学 Diffusers 库做图像生成（Stable Diffusion）。

🎯 实现目标

系统掌握 Git 版本管理和 GitHub 协作流程，能独立管理项目代码、参与团队协作、处理常见冲突和回滚操作。

📝 详细分步实操

1. 安装和配置：安装 Git 后命令行 git --version 验证，配置用户名和邮箱（git config --global user.name "你的名字"、git config --global user.email "你的邮箱"），配置默认分支名 main（git config --global init.defaultBranch main）。
2. 初始化仓库：在项目文件夹里 git init 初始化，创建 .gitignore 文件（告诉 Git 哪些文件不用管，如 node_modules/、.env、dist/、*.log，GitHub 有各种语言的 .gitignore 模板可直接用）。
3. 基础三件套：git status 查看当前状态（哪些文件改了/暂存了）、git add 文件名 或 git add . 把改动暂存、git commit -m "提交说明" 提交到本地仓库，理解工作区→暂存区→仓库的三层结构。
4. 写好提交信息：提交说明用"动词+简短描述"格式（如"添加用户登录功能""修复首页加载崩溃"），一次提交只做一件事（别把 5 个不相关的改动塞一个 commit），英文项目用英文，中文项目可用中文。
5. 查看历史和回退：git log 查看提交历史（加 --oneline 一行显示一个）、git diff 查看具体改了什么、git reset --hard commit_id 回退到某个版本（危险操作，会丢失未提交的改动）、git revert commit_id 新建一个反向提交来撤销（更安全，保留历史）。
6. 分支管理：git branch 查看分支、git branch 分支名 创建分支、git switch 分支名 切换分支、git switch -c 分支名 创建并切换，开发新功能时新建 feature 分支（如 feature/login），开发完合并回 main，保持 main 分支始终可用。
7. 合并和冲突：git merge 分支名 把分支合并到当前分支，遇到冲突时 Git 会标记冲突文件（<<<<<<< HEAD ... ======= ... >>>>>>> 分支名），手动编辑保留正确内容，然后 git add + git commit 完成合并，理解 rebase（变基）和 merge 的区别（rebase 历史更线性，merge 保留分支轨迹）。
8. 连接 GitHub：在 GitHub 创建仓库（不要勾选 Initialize with README，避免冲突），本地 git remote add origin 仓库地址 添加远程，git push -u origin main 推送（首次会要求登录，用 Personal Access Token 代替密码），之后 git push 推送、git pull 拉取最新代码。
9. 团队协作流程：Fork 别人的仓库到自己账号 → clone 到本地 → 新建 feature 分支开发 → 推送到自己的 Fork → 在 GitHub 发 Pull Request（PR）描述改动 → 等待 review 和合并 → 同步上游最新代码（git pull upstream main），理解 code review 的意义。
10. 高级技巧：git stash 暂存当前改动（切分支前不想 commit 时用）、git cherry-pick commit_id 把某个提交挑到当前分支、git blame 文件名 看每行代码是谁改的、git bisect 二分查找引入 bug 的提交、GitHub Actions 做 CI/CD（提交后自动跑测试/部署）。

🎯 实现目标

掌握多种静态网站部署方式（GitHub Pages / Vercel / Netlify / 云服务器 + Nginx），能把本地网站上线到公网，配域名和 HTTPS，实现自动部署。

📝 详细分步实操

1. 部署前检查：确保网站在本地能正常打开（用 Live Server 预览），所有图片/资源路径正确（用相对路径），没有硬编码的本地路径（如 C:\Users\xxx），index.html 在根目录，页面标题和 meta 描述已填写。
2. 方式一：GitHub Pages（最简单免费）——把网站推到 GitHub 仓库，在仓库 Settings → Pages 里选 Deploy from a branch，分支选 main，目录选 /（根目录），保存后等 1-2 分钟，网站就在 https://用户名.github.io/仓库名/ 上线了，每次 git push 自动更新。
3. 方式二：Vercel（推荐，更快更稳）——注册 Vercel 账号，Import Project 选 GitHub 仓库，Vercel 自动识别静态网站，Framework Preset 选 Other，Build Command 留空，Output Directory 填 ./（或 dist 如果是构建项目），点 Deploy，几十秒就上线，获得 xxx.vercel.app 域名，支持自动 HTTPS 和全球 CDN。
4. 方式三：Netlify（类似 Vercel）——注册 Netlify，Add new site → Import an existing project，选 GitHub 仓库，配置构建命令和发布目录，Deploy 上线，获得 xxx.netlify.app 域名，Netlify 的 Forms（表单收集）和 Functions（Serverless）是特色功能。
5. 方式四：云服务器 + Nginx（完全自主可控）——买云服务器（阿里云/腾讯云轻量应用服务器，新用户约 100 元/年），用 scp 或 git 把网站文件传到服务器 /var/www/网站名/ 目录，安装 Nginx（apt install nginx），配置 server block（监听 80 端口、root 指向网站目录、index index.html），systemctl reload nginx 生效。
6. 绑定自定义域名：在域名注册商（阿里云/腾讯云/Namecheap）的 DNS 管理里添加解析记录——GitHub Pages 用 CNAME 记录指向 用户名.github.io；Vercel/Netlify 在平台设置里 Add Domain，按提示添加 CNAME 或 A 记录；云服务器用 A 记录指向服务器 IP，解析生效通常几分钟到几小时。
7. 配置 HTTPS：Vercel/Netlify/GitHub Pages 自动提供免费 HTTPS（Let's Encrypt 证书），绑定域名后自动签发，无需手动操作；云服务器 Nginx 用 Certbot 一键申请免费证书（certbot --nginx -d 你的域名），自动配置 Nginx 并开启自动续期，确保网站显示小锁标志。
8. 自动部署（CI/CD）：GitHub Pages 本身就是 push 自动部署；Vercel/Netlify 连接 GitHub 后每次 push 到 main 自动重新构建部署；云服务器方案配 GitHub Actions——在仓库 .github/workflows/deploy.yml 写工作流，push 后自动 SSH 到服务器拉取最新代码并 reload Nginx。
9. 部署后验证：用手机和电脑分别访问公网链接，检查所有页面能打开、图片正常显示、链接不跳转 404、控制台无报错（F12 看 Console 和 Network），用 PageSpeed Insights 跑分看性能，用站长工具验证收录情况。
10. 日常维护：更新内容后 git push 自动更新；定期备份网站文件到本地或另一个仓库；监控网站可用性（用 UptimeRobot 免费监控，宕机发邮件提醒）；域名和服务器到期前续费（忘记续费网站会挂）。