01MVP Starter Kit

做网站之前会碰到一堆名词，不用怕，也不用现在全搞懂。先过一遍，知道它们各自负责什么事，遇到不懂的再问 AI。

这些名词都是干嘛的

先过一遍核心的——做网页绕不开这三个：

名词	大概是什么
`HTML`	网页的内容和结构，你看到的文字、按钮、图片，底层都是它写的。
`CSS`	控制长什么样——颜色、间距、在手机上怎么排版，都归它。
`JavaScript`	让网页能交互。点按钮弹窗、表单校验、数据实时更新，都得靠它写逻辑。

开发环境相关的：

名词	大概是什么
`Node.js`	让 JavaScript 也能在你电脑上跑（不只在浏览器里）。装依赖、起本地服务器都要用。
`pnpm`	给项目装依赖的工具，理解成”装零件”就行。
`Git`	记录代码改了什么。改崩了能回退，多人协作也不会互相覆盖。
`GitHub`	放代码的平台，类似网盘但多了协作、部署这些功能。

偶尔会碰到的：

名词	大概是什么
`TypeScript`	JavaScript 加了类型检查。写着麻烦一点，但大项目能少踩 bug。现在不用深学。
`Markdown`	纯文本写文档的格式，GitHub README 和很多 AI 工具都用它。会打字就会写。
`React` / `Vue`	把页面拆成组件来拼的框架，做复杂一点的应用基本都会用到其中一个。
`API`	程序之间互相调用的接口。前端跟后端要数据、调 AI 模型，本质都是调 API。
`Chrome DevTools`	Chrome 按 F12 打开的调试工具，下面单独说。

别花两周在那里背概念。跟着一个教程把项目跑起来，过程中碰到不认识的词，直接问 AI：

我没学过编程，用大白话给我解释一下 TypeScript

AI 会根据你的水平来回答，比翻文档快。第一次碰到 TypeScript 不用慌，知道它”比 JS 多了类型检查”就够了，等真遇到一堆红色报错再去看细节也来得及。

页面白屏、样式歪了、接口没数据——大部分问题按 F12 打开 DevTools 看一眼就有头绪。

三个最常用的入口：

Console 里红色的就是报错，Elements 能看到页面的 HTML，Network 能看到请求发出去没有、返回了啥。一开始知道这三个就够用。

B 站有个入门视频讲得不错：Chrome DevTools 开发者工具。