Code Decoded — 代码解析

Code Decoded 将代码库转换为一个自包含的交互式HTML课程。一个文件，无需设置。可以托管、共享或本地打开。阅读references/html-structure.md以了解HTML输出规范。阅读references/design-principles.md以了解视觉和内容规则。

要构建什么 一个单独的HTML文件，通过以下方式教导代码库的工作原理： 基于滚动的模块——每个部分一个概念，进度指示器 代码 + 简洁英语并排显示——仓库中的真实代码在左侧，右侧是其含义 永远不要修改或简化代码 架构概述——主要组件连接的视觉图表 数据流演练——跟踪在关键用户操作（登录、提交、搜索——任何最具代表性的操作）期间发生了什么 交互式测验——应用程序专注的，而不是记忆。"用户在切换页面后报告数据过时。您会先查看哪里？"而不是"What does API stand for？" 术语提示——悬停在任何技术术语上以获取简洁的英语定义 键盘导航——使用箭头键在部分之间移动

开始前 询问用户（或从上下文中推断）： 受众——非技术人员（产品用户、利益相关者）、开发人员入职或高级用户？ 焦点——整个代码库游览，还是特定领域（auth、数据层、特定功能）？ 要跟踪的关键操作——代码最重要的功能是什么？这成为数据流模块 如果用户说"just do it"——从代码库中推断并继续

如何生成 阅读代码库结构（目录树、关键文件） 识别：入口点、主模块、数据模型、关键用户流 选择5-8个概念来教授——从"这是什么？"到"它是如何工作的？"到"我如何使用/更改它？" 按照references/html-structure.md和references/design-principles.md编写HTML课程 输出为单个.html文件 输出名称 文件名：[repo-name]-tour.html 它必须： 离线工作（无外部CDN，无网络请求） 自包含（所有CSS和JS内联） 在Chrome、Firefox、Safari中正确渲染 可以作为静态页面托管，无需构建步骤