Skip to content

assignment-zh.md

Latest commit

 

History

History
172 lines (114 loc) · 7.72 KB

assignment-zh.md

File metadata and controls

172 lines (114 loc) · 7.72 KB
Raw

← 本周导航 · 模块首页 · 术语表

Week 8 中文导读：多技术栈应用

最后一周，来个综合练习

最后一周，来做一个综合练习：用三种不同的技术栈（Tech Stack）构建同一个应用。其中至少一个版本要使用 AI 应用生成平台 bolt.new。这是一个回顾和整合的机会。

技术栈是什么？

技术栈就是"做这道菜用什么锅、什么火、什么配料"。构建一个 Web 应用，你需要选择：

  • 前端框架：React、Vue、Vanilla JS...（餐厅装修风格）
  • 后端框架：FastAPI、Express、Django、Rails...（厨房设备）
  • 数据库：SQLite、MongoDB、PostgreSQL...（仓储系统）
  • 语言：Python、JavaScript、Ruby...（厨师的母语）

不同的组合就是不同的技术栈。常见的组合比如：

  • MERN = MongoDB + Express + React + Node.js（全 JavaScript 家族）
  • Django + React = Python 后端 + React 前端（前后端分离，两种语言）
  • Rails = Ruby on Rails 全栈（一种框架搞定前后端）

选技术栈没有绝对的"对错"，就像做菜没有唯一正确的锅。关键是理解每种选择的取舍（trade-off）：上手难度、生态成熟度、性能特点、招人容易程度，等等。

bolt.new 是什么？

bolt.new 是一个"AI 应用生成器"——你用自然语言描述想要什么应用，它直接帮你生成完整的代码。

这就是典型的 Vibe Coding：描述想法 -> AI 生成 -> 看看能不能用。

但经过前 7 周的学习，你应该能更有策略地使用它：

  • 用 Week 1 学的提示技术来写更好的描述
  • 用 Week 6 学的安全意识来检查生成的代码
  • 用 Week 7 学的审查方法来评估代码质量

这就是"学过"和"没学过"的区别。同样用 bolt.new，你现在能问出更好的问题，也能更快地发现生成代码中的问题。

任务导读

原始作业的要求：

  1. 选择一个应用概念 —— 可以复用之前 weeks 的应用（比如 developer control center），也可以新建一个
  2. 用 3 种不同的技术栈实现它 —— 比如一个用 MERN，一个用 Django + React，一个用 Rails
  3. 至少一个版本用 bolt.new —— 体验 AI 应用生成
  4. 至少一个版本用非 JavaScript 语言 —— 比如 Python（Django/Flask）或 Ruby（Rails）
  5. 每个版本要能本地运行 —— 并且有清晰的 README 文档

最小功能要求

不管用什么技术栈，每个版本都要满足这些基本要求：

  • 用户可以创建、查看、更新、删除一个核心资源（这叫 CRUD：Create / Read / Update / Delete）
  • 有持久化存储（persistent storage）——关掉应用再打开，数据还在
  • 基本的输入验证（input validation）和错误处理（error handling）
  • 简单但可用的界面

这些要求看起来不多，但用三种不同的技术栈分别实现，你会对"同一件事可以有多种做法"有切身体会。

关于 bolt.new 的实际建议

如果你是第一次用 bolt.new，这些经验可能会帮到你：

  • 描述应用时，明确数据模型和关系 —— 比如"用户有多个任务，每个任务有标题、描述、状态"，比"做一个任务管理器"要好得多
  • 一次不要描述太多功能 —— 先描述核心功能，生成后再迭代式添加新功能
  • 生成后一定要检查安全问题 —— 参考 Week 6 的检查清单，特别是 API 密钥、输入验证、认证逻辑这些
  • 注意 bolt.new 偏好现代 JS 全栈方案 —— 它默认会生成 React + Node.js 之类的组合，如果你要非 JS 版本，需要用其他工具（比如 Claude Code 或 Cursor）

课程提供了 bolt.new 的教育优惠码，可以免费用三个月 Pro 版。记得在试用期结束前取消，免得被扣费。

与主题线的连接：课程的闭环

这周是整个学习旅程的闭环。回想 Week 1，你第一次学习如何与 AI 对话。现在，你用 AI 生成了完整的应用——但你不再是盲目接受 AI 的输出，而是带着提示技术（Week 1）、架构理解（Week 2）、工具集成（Week 3）、工作流设计（Week 4）、安全意识（Week 6）、和审查能力（Week 7）来评估和改进它。

这就是"Human-Agent Engineering"和"Vibe Coding"的本质区别：不是不用 AI，而是知道如何用好 AI。

如果你做完三个版本后回头看 Week 1 的作业，你大概会发现自己的提示写作、代码审查、问题诊断能力都有了明显提升。这种提升不是来自"记住了更多知识"，而是来自"建立了更好的判断力"。

环境准备

1. 领取 bolt.new 额度

bolt.new 是本周必须使用的 AI 应用生成平台。

  1. 获取你的 bolt.new 促销码（课程邮件中提供）
  2. 访问 bolt.new 并创建账号
  3. 在 Personal Settings > Subscriptions & Tokens 中，点击蓝色 "Upgrade" 按钮
  4. 选择 "Add promotion code"，粘贴你的促销码
  5. 你将获得 3 个月免费的 Bolt Pro（需要信用卡激活试用。注意在 3 个月到期前取消，避免自动扣费）

如果你没有促销码，bolt.new 也有免费额度可以体验基本功能。

2. 准备其他技术栈

你需要用 3 种不同的技术栈构建同一个应用，至少一个必须使用非 JavaScript 语言（如 Python/Django、Ruby/Rails）。提前确认相关环境已安装。

练习任务

目标

用 3 种不同的技术栈构建同一个应用，要求：

  • 至少 1 个版本使用 bolt.new
  • 至少 1 个版本使用非 JavaScript 语言（如 Django、Rails）
  • 可以复用之前 weeks 的应用（"开发者控制中心"），也可以做新应用

最低功能要求

无论使用哪个技术栈，应用都必须满足：

  • 用户可以创建、查看、更新、删除一个核心资源（如笔记、任务、帖子）
  • 有持久化存储（数据库或文件存储）
  • 基本的输入验证和错误处理
  • 简单但可用的界面
  • 清晰的本地运行说明

技术栈示例

技术栈 组成
MERN MongoDB + Express + React + Node.js
MEVN MongoDB + Express + Vue.js + Node.js
Django + React Python 后端 + React 前端
Flask + Vanilla JS Python 后端 + 原生 JS 前端
Next.js + Node Next.js + Node.js/NestJS 后端
Ruby on Rails 全栈 Ruby

使用 AI 应用生成器的建议

  • bolt.new 适合现代全栈 JS 技术方案，如果不指定框架会使用默认方案
  • 描述应用时先讲清楚概念、数据模型、路由和界面流程
  • 明确描述数据模型和关系
  • 迭代式优化提示词：先做数据模型，再做 CRUD 端点，再做前端组件
  • 每个版本放在独立文件夹中，避免依赖冲突
  • 生成的代码导出后作为独立项目文件夹提交
  • 除了 bolt.new，也可以探索 Lovable、Figma Make 等平台

成果要求

  1. 三个项目文件夹（在 week8/ 目录下），每个包含：
    • 完整源代码
    • README.md：安装前提、安装步骤、运行方式、环境配置
    • 偏差说明、已知问题、生成后的手动修复
  2. 学习笔记（writeup-zh.md）：
    • 应用概念说明
    • 每个版本的详细描述（技术栈、AI 工具、遇到的问题、时间指标）

自检清单

  • 完成了三个不同技术栈的应用版本
  • 至少一个版本使用了 bolt.new
  • 至少一个版本使用了非 JavaScript 语言
  • 每个版本都能本地运行
  • 对比了不同技术栈和工具的优劣
  • 能说出这 8 周学习对你使用 AI 的方式带来了什么改变

← 返回模块首页 · 返回首页