HTMLHTML
页面看着没问题，但读屏读不清层级、键盘 Tab 跳不到按钮，该从哪改？
沿江步道 6 公里，报名后发集合点。
报名查看地图
结论：标签让工具认出标题、按钮和链接，不靠外观。
工程与栈术语
开发基础
12 个条目CSSCSS
我明明写了规则，颜色怎么还是不对？为什么同事总说别用 !important？
四条规则同时命中这一颗按钮。
保存结论：多条规则抢同一按钮，ID 特异性最高而胜出。
JavaScriptJavaScript
为什么 setTimeout(fn, 0) 不是马上跑？点了按钮数量怎么还是 0？
¥42 · 点击立刻改数量
加入购物车结论：点按钮立刻改页面；setTimeout(0) 不会马上跑。
TypeScriptTypeScript
JavaScript 要等运行起来才报错，TypeScript 凭什么在写代码时就把错误拦住？
return project.titelDid you mean ‘title’?
结论：写代码时就拦住拼写错，不用等页面炸。
MarkdownMarkdown
我想像写笔记一样写说明，但展示出来要有标题和列表——怎么用纯文本做到？
结论：# 变成标题，- 变成列表，源稿仍可读。
网址URL
看懂网络
把项目详情做成可复制的 HTTPS 链接：路径稳定、参数可解释，还不泄露凭据。
https://app.example.com/projects/42#comments项目 42 · 评论区结论：地址栏每一节都有用，复制后直达同一页。
运行时Runtime
都是 JavaScript，为什么 document 在 Node 里没有、fs 在浏览器里报错？
document.querySelector 只在浏览器里有。
结论：同一段 JS 能跑，是因为运行时给了 document。
库Library
同样引用别人写的代码，库和框架到底差在谁调用谁？
format(now) 把日期印在券上。
结论：库是你调用它，日期立刻回到这张券。
框架Framework
为什么用了框架，请求顺序不能自己随便排？
解析 → 鉴权 → 出票，框架按顺序叫你。
结论：框架掌控顺序，你的钩子被它依次叫到。
依赖Dependency
为什么只装了一个包，项目里却多出十几只传递箱子？
body-parser · qs · raw-body，一个直接依赖拖来一串。
结论：你只写了一个包，货架上却多出一排传递依赖。
包管理器Package Manager
为什么装包不能只改 package.json，还要带着锁文件？
清单写范围，锁文件记下实际拿到的精确版本。
结论：包管理器靠这两份文件，把「想要」钉成「拿到」。
npmnpm
npm install 和 npm ci 差在哪？为什么 CI 红在安装？
ci 只认锁文件，对得上才把文件夹填满。
结论：npm ci 按锁还原；锁对不上，文件夹就空着失败。
Web 技术
8 个条目JSONJSON
接上数据
为什么接口里的一段字，差一个逗号整页就白了？
纯文本写成结构，一个逗号错整张条失效。
结论：JSON 是带规矩的文本；解析成功，曲目才出现。
SQLSQL
为什么查表不是一行行去翻，而是先把要的行说清楚？
先说要什么行，表自己把结果交出来。
结论：SQL 声明结果形状，不是一行行去翻。
对象关系映射ORM
接上数据
为什么写对象方法，数据库里却变成一行 SQL？
对象方法变成 SQL，行再变回嵌套对象。
结论：ORM 让你写对象，框架替你对上表行。
Node.jsNode.js
JavaScript 不是浏览器里的吗，为什么还能起一个点歌 API？
浏览器外的 JS：听端口、读文件、回 JSON。
结论：Node 在服务端跑 JS，请求由这个进程接住。
ReactReact
为什么我改了页面上的数字，一点按钮又跳回去？
状态一变，卡片重画，不用自己改文字。
结论：界面是状态的函数，数字长在组件上。
Next.jsNext.js
为什么改了地址栏，页面却变成 404？
地址即文件：app/songs/[id]/page.tsx 画出这页。
结论：Next 用文件当路由，URL 对上才有这张页。
ViteVite
为什么改一行字，有的预览只换标题，有的整页刷新购物车也没了？
购物车 1 · 只换了标题，没刷整页。
结论：改一行只热替换这块，计数还留在预览窗里。
ServerlessServerless
交付上线
为什么没人下单时可以关窗，一按铃又要等一会儿才出票？
没人来就关窗，按一次才开一次。
结论：按次叫醒，空闲缩到零，不常驻烧着。
工程协作
8 个条目代码仓库Repository
大家都说把代码丢上 GitHub，仓库跟一个文件夹到底差在哪？
README.md · src/app.tsx
- 改周末花束标题
- 加上购物车
- 初始化花店页
结论：clone 一次拿到代码和全部历史，不是只拷当前文件夹。
项目说明README
协作交付
仓库里那份 README，到底要写到什么程度，别人才不会卡住？
花店预览页。本地启动：
npm run dev结论：新人打开文档就能照命令跑起来，缺命令就卡死。
配置文件Configuration
交付上线
数据库地址、密钥这些会变的东西，为什么不能直接写在代码里？
postgres://local/bouquet
结论：会变的值写在配置里，缺必填项启动直接失败并指出键名。
命令行CLI
为什么很多人不用鼠标点，而要在黑框里敲一行字？
已发布 weekend-bouquet
结论：一条命令写清程序、子命令和参数；失败用非 0 退出码告诉脚本。
代码检查Linter
协作交付
还没点运行，编辑器里那条红线是怎么来的？它和测试有什么不同？
用 === 代替 == · 不运行也能扫出来
结论：静态按规则扫代码，红线标行号，error 能挡住合并。
测试Test
协作交付
改了一行价格格式，怎么知道以前对的东西没被改坏？
实际也是 ¥1,299 · 红灯才能拦住回归
结论：先写期望，再跑实现；对不上就红灯，挡住改坏的合并。
构建Build
交付上线
「都说写完要 npm run build 再上线」——构建到底做了什么？为什么开发时和构建后体积差这么多，产物文件名还带一串随机字符？
一次构建，看产物如何从源码变小、变定稿开发时 · 读源码 部署时 · 发产物
app.tsx96 KBButton.tsx64 KBformat.ts32 KBlegacy-icons.ts48 KB
index.html1.2 KBapp.a3f9b2c1.js28.4 KBvendor.7c2e8d4f.css8.1 KBlegacy-icons.ts剔除
结论：构建把会变的源码（含类型、未引用模块、可读命名）翻译成体积小、压缩过、带哈希的定稿产物；死代码被摇树剔除。
持续集成CI
交付上线
「合并前才手工测，经常把主分支跑挂——能不能让每次提交都自动验证？」
PR #104 · feat/login-retry → main结果：测试红灯 → 熔断 · 构建跳过 · PR 未通过、阻止合并
部署与上线
8 个条目构建产物Build Artifact
交付上线
「都说 build 完要先打成一份带哈希的产物再上线」——这个产物到底长什么样？为什么不能直接拿最新源码上线？
@sha256:c7e2f08a- index.html1.2 KB
- app.c7e2f08a.js28.9 KB
- vendor.7c2e8d4f.css8.1 KB
来源 commit 8b1e4d7 · 38.2 KB
结论：上线的是这份带哈希的定稿包，不是「最新源码」。
环境变量Environment Variables
交付上线
「为什么本地能跑、一上线就报 undefined？数据库密码到底该写在哪才不会进 git、不会泄到浏览器？」
postgres://preview/[redacted]代码只写键名，真值由 Preview 注入
结论：同一键名换环境就换值；生产密钥不能贴进 Preview，也不能进浏览器。
域名Domain
看懂网络交付上线
shop.example.com 这种地址里，哪段是域名？「/shop」算域名吗？为什么域名还要每年交钱？
shop.example.com线上商店入口今日花束
地址栏里的名字才是域名
结论：域名是给人记的入口名；example.com/shop 的 /shop 是路径，不是域名。
域名解析DNS
看懂网络交付上线
域名买好了，为什么有人能打开店、有人还进旧站？改完解析要等多久？
A → 192.0.2.1TTL 3600 · 浏览器按这个地址开门店
结论：DNS 把名字翻译成地址；改记录后缓存按 TTL 才更新，不是立刻全网生效。
HTTPSHTTPS
看懂网络交付上线
地址栏那把小锁到底锁了什么？为什么证书过期浏览器直接整页拦住，不让登录？
https://app.example.com登录页 · 连接已加密密码在路上是密文
中间人只看到 enc:7f3a…
结论：HTTPS 给连接加上锁和证书；锁坏了浏览器直接红墙，不会把密码发出去。
托管与云部署Hosting
交付上线
代码在自己电脑能跑，怎样放到网上让别人打开？为什么有的站一丢到 CDN 就白屏？
服务端渲染 + 查库，常驻进程在跑
结论：托管是把产物放到别人的机器上跑给你访问；形态必须匹配产物，SSR 不能丢进纯静态 CDN。
发布策略Release Strategy
交付上线
「新版本写好了——是直接全量上线，还是先给一小段真实流量、看支付成不成功再决定？」
旧版仍接 95% · 门槛通过后再放量
结论：先给一小段真实流量看支付成不成功，再决定放量，不要一次全开。
回滚Rollback
交付上线
「线上结账突然失败——是再发一版热修猜测，还是先切回上一份已知良好的版本？」
回退点 v1.8.4 · 已验收
结论：切回已知良好的那一版，并在真实结账页上验证；数据不兼容不能硬切。
本地场景
4 个条目落地链接Landing Link
交付上线
「给活动配一条短链/二维码，微信、浏览器、APP 都能落到对的页面；下线时有说明页，不空白。」
海报上同一条码 · 按扫码端开门
结论：同一条短链按扫码端打开对的页；活动下线要给说明页，不能空白。
分享卡片Share Card
交付上线
「分享时带标题、摘要和封面图；缺图有默认封面；改了 meta 要重新抓取才更新。」
小程序Mini Program
起手搭页面交付上线
「打开就弹授权、返回不刷新、分享卡片落到首页——小程序页面到底该把数据挂在哪？」
公开可看 · 分享落到 /pages/home
个性化推荐 · 拒绝仍能逛结论：回前台才刷新列表；拒绝授权不能整页空白；分享要带落地路径。
飞书应用Feishu App
起手搭页面交付上线
「在飞书里打开应用后可查待办；发送结果用卡片消息，失败要可重试。」
结果用消息卡片回执，不另开网站
结论：在飞书里打开就能办事；结果用消息卡片回执，失败可重试且不重复发。