CodeAtlas 代码图谱 · 项目文档

一个把「岗位 · 技术 · 学习路径 · 厂商」放在同一张图上的计算机学习与职业决策站。

文档索引

文档	内容	适合谁看
01-需求分析	用户问题、功能范围、优先级、不做什么	产品 / 所有人
02-竞品调研	竞品的优劣势与借鉴策略	产品 / 运营
03-技术方案	技术选型、架构、数据模型、流式渲染、移动端与动效规范、扩展路径	开发 / 运维
04-开发日志	按时间记录的决策与实现过程	开发
05-测试日志	测试用例、执行结果、缺陷统计	测试 / 开发
06-修正日志	每个 Bug 的现象、根因、修复与回归	开发
07-部署运维	本地启动、构建、迁云、扩容、监控	运维
08-文案与语气	「AI 味」的六个特征、改写对照、禁用词与发布前八问	内容 / 产品

一分钟了解

内容规模：25 个岗位 / 46 项技术 / 13 条学习路径（共 61 个阶段，每阶段含 3 条误区与 3 条首周任务）/ 36 家公司
决策工具：/start 60 秒定向（3 问 → 路径 + 岗位 + 本周行动）、/jobs/compare 14 维度并排对比、/salary 五年涨幅与城市系数
技术栈：Next.js 15（App Router）+ React 19 + TypeScript + Tailwind CSS 3
数据：内容型数据用 TS 模块固化（类型安全、构建期校验），实时情报由独立采集器写入 JSON 快照
采集：6 个公开数据源（HN / GitHub / V2EX / InfoQ / 开源中国 / DEV），并发 4、超时 12s、失败重试 2 次
渲染：内容页 SSG/ISR + CDN（130 个 HTML 页），/live 与 /jobs/compare 动态渲染；共享首屏 JS 约 105KB（gzip），最重路由 /start 116KB，无第三方 UI 库
移动端：390px 起适配，横向溢出 0 页，表格三种降级策略，触控目标 ≥ 44px
可扩展：数据访问层已抽象，迁 PostgreSQL / Redis 不需要改页面

快速开始

npm install          # 安装依赖
npm run crawl        # 抓取一次实时情报（可选，不跑也有页面）
npm run dev          # 开发模式 http://localhost:3000
npm run build        # 生产构建
npm start            # 生产启动
npm test             # 内容与接口自检

目录结构

app/                 页面与 API 路由（App Router）
  jobs/ jobs/compare/ tech/ learn/ companies/ live/ salary/ start/ about/ notes/
  api/{stats,live,health}/
components/          UI 组件（服务端为主，交互组件标注 "use client"）
data/                内容数据（jobs / techs / paths / companies / insights）
  live/feed.json     采集器输出的实时情报快照
lib/                 类型、格式化、搜索索引、Markdown 渲染、采集读取
scripts/             crawl.mjs（采集） test.mjs（自检） e2e.mjs（端到端） audit.mjs（移动端审计）
docs/                本目录：需求 / 调研 / 方案 / 日志
logs/                运行时日志（采集器写入，git 忽略）

这个站是怎么被做出来的

项目总览

CodeAtlas 代码图谱 · 项目文档

文档索引

一分钟了解

快速开始

目录结构