代码世界的地图
🎯 学完这课你能
- 看懂项目文件夹结构，知道每个目录是干什么的
- 区分配置文件、源代码、静态资源
- 用你的绩效系统做实战导览
项目文件夹 = 公司组织架构
你打开一个项目文件夹时，看到一堆乱七八糟的文件和目录，是不是觉得像第一天入职走进一家新公司——完全不知道谁是谁、谁管什么？
其实，项目的文件结构就像公司的组织架构图。每个文件夹是一个"部门"，每个文件是一个"岗位"。一旦你理解了这张图，你就知道出了问题该找谁。
公司 = 项目根目录
部门 = 文件夹（src, components, pages...）
员工档案 = 具体文件（.js, .ts, .css, .html...）
岗位说明书 = 配置文件（package.json, tsconfig.json...）
你的绩效项目长什么样
让我们看看你做的 jixiao（绩效考评系统）项目的结构：
常见文件类型速查
就像公司里不同岗位有不同的职责，不同后缀的文件也有不同的用途：
JavaScript / TypeScript 代码
"干活的员工"
样式表
"装修设计师"
网页结构
"建筑骨架"
配置 / 数据
"规章制度"
Python 代码
"另一种语言的员工"
环境变量 / 密钥
"保险柜（不能公开！）"
"路径"是什么？
当 Claude Code 说 src/app/page.tsx 的时候，它在说一个路径（path）——就像公司里的"位置描述"：
src/app/page.tsx 相当于：
"公司 → 业务部 → 前台页面岗"
/Users/wepie/Desktop/项目/jixiao/performance-review/src/app/page.tsx
这是完整地址，从"地球"开始定位——就像写快递地址从国家写起。
./src/app/page.tsx
这是相对地址，从"当前位置"开始——就像说"从前台往左走到底"。
🎮 练习：把文件拖到正确的"部门"
把左边的文件拖到右边对应的文件夹中
📝 小测验
当 Claude Code 说 "Error in src/components/Header.tsx:42"，这意味着什么？
📝 小测验 2
以下哪个文件绝对不能上传到 GitHub？