[
  {
    "notice": "只有 title 和 text 字段是必填，其他字段可删除不填。填写时，请从第三条数据开始填写，第二条数据是示例，填写完成之后，不要删除前面两条",
    "notice1": "只有 title 和 text 字段是必填，其他字段可删除不填。填写时，请从第三条数据开始填写，第二条数据是示例，填写完成之后，不要删除前面两条",
    "notice2": "只有 title 和 text 字段是必填，其他字段可删除不填。填写时，请从第三条数据开始填写，第二条数据是示例，填写完成之后，不要删除前面两条",
    "title": "这里填标题，必填必填必填必填必填必填必填必填必填必填必填必填必填必填必填必填必填必填必填必填",
    "titleTranslate": "这里填标题翻译",
    "text": "这里填原文，一句一个换行符，一段两个换行符，必填必填必填必填必填必填必填必填必填必填必填必填必填必填必填必填必填必填必填必填",
    "textTranslate": "这里填原文翻译，一句一个换行符，一段两个换行符",
    "audioSrc": "这里填音频的url/在线地址"
  },
  {
    "title": "How are you today?",
    "titleTranslate": "今天好吗？",
    "text": "STEVEN:Hello, HELEN.\n\nHELEN:Hi, Steven.\n\nSTEVEN:How are you today?\n\nHELEN:I'm very well, thank you. And you?\n\nSTEVEN:I'm fine, thanks.\n\nSTEVEN:How is Tony?\n\nHELEN:He's fine, thanks. How's Emma?\n\nSTEVEN:She's very well, too, Helen.\n\nSTEVEN:Goodbye, Helen.Nice to see you.\n\nHELEN:Nice to see you, too, Steven. Goodbye.",
    "textTranslate": "史蒂文：你好，海伦 \n\n海 伦：你好，史蒂文 \n\n史蒂文：你今天好吗？ \n\n海 伦：很好，谢谢你。你好吗？ \n\n史蒂文：很好，谢谢。 \n\n史蒂文：托尼好吗？ \n\n海 伦：他很好，谢谢。埃玛好吗？ \n\n史蒂文：她也很好，海伦。 \n\n史蒂文：再见，海伦。见到你真高兴。 \n\n海 伦：我见到你也很高兴，史蒂文。再见。",
    "audioSrc": "/sound/article/nce1/009&010－How Are You Today.mp3"
  },
  {
    "title": "11A Finding the Part That Needs to Change",
    "titleTranslate": "第11课A｜找到并说明具体对象",
    "text": "Before changing a feature, I want to find the file or component that controls the behavior I can see on the page.\nA project may contain many folders, so a clear question is more useful than opening unrelated files and guessing where to begin.\nI describe the visible element, name the page where it appears, and explain which action or state I am trying to understand.\nFor example, I may need the component that renders the course cover and the function that chooses which image to display.\nThe answer should connect those pieces and show how information moves from the source data into the final rendered page.\nA directory name can provide a clue, but it does not prove that every file inside has the same responsibility or purpose.\nI also look for existing helpers that handle the same problem, because using the established approach can keep related pages consistent.\nWhen the relevant code is found, I ask for a short explanation of its inputs, outputs, and important connections to other modules.\nThis makes it easier to identify the smallest meaningful change and understand which behavior might need to be checked afterward.\nThe goal is not to memorize the entire repository, but to build a useful map of the parts involved in the current task.",
    "textTranslate": "修改功能前，我想找到控制页面可见行为的文件或组件。\n项目目录很多，清晰提问比乱开文件猜起点更有用。\n我描述可见元素、所在页面，并解释想理解的操作或状态。\n例如可能需要找到渲染课程封面的组件及决定图片的函数。\n回答应连接这些部分，说明信息如何从源数据进入最终页面。\n目录名可以提供线索，却不能证明内部文件职责相同。\n我也找处理同类问题的既有辅助函数，沿用现有方法保持页面一致。\n找到代码后，我会要求简述输入、输出和与其他模块的重要联系。\n这样更易找到最小有意义改动，并理解后续检查哪些行为。\n目标不是背下整个仓库，而是建立当前任务相关部分的实用地图。"
  },
  {
    "title": "11B Explaining How the Pieces Fit Together",
    "titleTranslate": "第11课B｜找到并说明具体对象",
    "text": "A good explanation of an implementation describes responsibilities and relationships before going through every line of a long function.\nSuppose that the application shows a list of lessons, and each lesson has a title, an image, and a short description.\nOne module retrieves the data, another prepares the display values, and a component renders the information that the user sees.\nThe file containing the query may be different from the file containing the markup, even though both affect the same page.\nIf an image is missing, we need to understand whether the stored path is empty or the rendering logic uses it incorrectly.\nThese possibilities suggest different changes, so locating the visible component alone may not identify the actual source of the problem.\nI prefer examples that follow one piece of data through the relevant functions and explain what each step adds or changes.\nTechnical names are useful when they identify a specific object, but the explanation should also describe its role in ordinary language.\nA simple diagram or a short sequence can sometimes explain the relationship more clearly than a large block of copied code.\nOnce the connection is clear, we can discuss the change without treating the whole project as one mysterious and inseparable system.",
    "textTranslate": "好的实现说明先描述职责和关系，再逐行解释长函数。\n假设应用显示课程列表，每课有标题、图片和简短描述。\n一个模块取数据，一个准备显示值，组件则渲染用户看到的信息。\n查询文件可能不同于页面标记文件，虽然都影响同一页面。\n图片缺失时，要区分存储路径为空，还是渲染逻辑用错。\n两种可能对应不同修改，所以只找到组件未必找到问题根源。\n我偏好沿一条数据经过相关函数，说明每步添加或改变什么。\n技术名称可定位具体对象，但还应以普通语言解释作用。\n简单图示或短流程有时比大段复制代码更清楚。\n关系清楚后，就能讨论修改，不把项目视作神秘不可分整体。"
  },
  {
    "title": "11C Working Conversation",
    "titleTranslate": "第11课C｜找到并说明具体对象",
    "text": "Me: Could you find the component that shows the course cover and explain where its image path comes from before changing the layout?\nDeveloper: The display component receives prepared lesson data, while a separate module retrieves the record and chooses the values used on the page.\nMe: Please show me the function that prepares those values, because I want to understand whether the missing image is a data problem.\nDeveloper: I will trace one lesson from the database record to the rendered card and identify the step where the path becomes empty.\nMe: Is there an existing helper that handles the same kind of image on other pages, or does this component use separate logic?\nDeveloper: There is a shared helper; I will explain its current contract and compare this page with another page that already uses it.\nMe: Good; propose the smallest change that restores the image and keeps the related pages consistent, then explain what should be reviewed.\nDeveloper: I will describe the relevant inputs, outputs, and affected views so that the change is understandable before implementation begins.",
    "textTranslate": "我：改布局前，能找到课程封面组件并解释图片路径来源吗？\n开发者：显示组件接收整理过的课程数据，另一个模块取记录并选择页面值。\n我：请展示准备值的函数，我想知道图片缺失是否为数据问题。\n开发者：我会跟踪一课从数据库到卡片的过程，找到路径变空的步骤。\n我：其他页面是否有处理同类图片的辅助函数，还是此组件另写逻辑？\n开发者：有共享辅助函数，我会解释其约定并与已使用它的页面比较。\n我：好，提出恢复图片并保持相关页面一致的最小改动，再说明检查内容。\n开发者：会说明相关输入、输出和受影响视图，使实现前就能理解改动。"
  },
  {
    "title": "11D Sentence Review",
    "titleTranslate": "第11课D｜找到并说明具体对象",
    "text": "Before changing a feature, I want to find the file or component that controls the behavior I can see on the page.\nI describe the visible element, name the page where it appears, and explain which action or state I am trying to understand.\nThe answer should connect those pieces and show how information moves from the source data into the final rendered page.\nWhen the relevant code is found, I ask for a short explanation of its inputs, outputs, and important connections to other modules.\nA good explanation of an implementation describes responsibilities and relationships before going through every line of a long function.\nOne module retrieves the data, another prepares the display values, and a component renders the information that the user sees.\nThese possibilities suggest different changes, so locating the visible component alone may not identify the actual source of the problem.\nA simple diagram or a short sequence can sometimes explain the relationship more clearly than a large block of copied code.\nCould you find the component that shows the course cover and explain where its image path comes from before changing the layout?\nPlease show me the function that prepares those values, because I want to understand whether the missing image is a data problem.\nIs there an existing helper that handles the same kind of image on other pages, or does this component use separate logic?\nGood; propose the smallest change that restores the image and keeps the related pages consistent, then explain what should be reviewed.",
    "textTranslate": "修改功能前，我想找到控制页面可见行为的文件或组件。\n我描述可见元素、所在页面，并解释想理解的操作或状态。\n回答应连接这些部分，说明信息如何从源数据进入最终页面。\n找到代码后，我会要求简述输入、输出和与其他模块的重要联系。\n好的实现说明先描述职责和关系，再逐行解释长函数。\n一个模块取数据，一个准备显示值，组件则渲染用户看到的信息。\n两种可能对应不同修改，所以只找到组件未必找到问题根源。\n简单图示或短流程有时比大段复制代码更清楚。\n我：改布局前，能找到课程封面组件并解释图片路径来源吗？\n我：请展示准备值的函数，我想知道图片缺失是否为数据问题。\n我：其他页面是否有处理同类图片的辅助函数，还是此组件另写逻辑？\n我：好，提出恢复图片并保持相关页面一致的最小改动，再说明检查内容。"
  },
  {
    "title": "11E Vocabulary in Context",
    "titleTranslate": "第11课E｜找到并说明具体对象",
    "text": "The editor can insert a line, create a new prompt, and organize related prompts into a small collection.\nThe template engine handles generation, while the browser must render the resulting page and complete hydration before some interactions work.\nThe code uses nesting to group conditions, and the keys identify the values inside the generated object.\nThe script adds tags to each document and creates a readable slug for its public URL.\nThe source tree contains folders, scripts, and documents, and each file should have a clearly described responsibility.\nA code comment explains why the branch exists, while the surrounding comments describe the unusual edge cases.\nThe function receives an array of items and returns a non-null value that matches the declared type.\nA union type allows several variants, and each variant carries attributes that identify its particular role.\nThe node has two children, and the root keeps a reference to the start of the whole structure.\nThe generator imports a template, inserts the data, and stores the resulting document in the workspace.\nA loader and a fetcher handle different stages of loading, so their names should make that distinction clear.\nThe listener receives signals, while a router maps the incoming request to the function that handles it.\nA lint command checks common code issues, and a diff shows which lines changed during the revision.\nThe script can print an index, indent nested output, and truncate a line that is longer than the display allows.\nAn adapter connects the shared interface to a provider, while the integration keeps external details out of the central module.\nThe runtime can bind a handler, generate a key, and pass the result through a pipe to another process.\nThe framework may bootstrap the application before initializing components and attaching the event listeners that they require.\nThe test harness uses a mock response so that execution does not depend on a real external service.\nA schema describes the expected fields, while the actual record contains the values that were stored.\nThe executor runs the submitted action, and the execution report records whether that action was executed successfully.\nThe technical note distinguishes a variable, a property, and an attribute using examples from the current implementation.\nThe file was referenced by another module, and several references need to be updated if its path changes.",
    "textTranslate": "编辑器可插入行、创建提示词，并把相关提示词组织成小集合。\n模板引擎处理生成，浏览器需渲染页面并完成水合，部分交互才可用。\n代码以嵌套组织条件，键标识生成对象中的值。\n脚本为文档加标签，并生成公开网址的可读标识。\n源树含目录、脚本和文档，每个文件应有清楚职责。\n代码注释解释分支存在原因，周围注释说明特殊边界情况。\n函数接收条目数组，返回匹配声明类型的非空值。\n联合类型允许多个变体，各变体有标识角色的属性。\n节点有两个子项，根保留整个结构起点引用。\n生成器导入模板、插入数据，并把结果文档存工作区。\n加载器和取数器处理不同阶段，名称应清楚区分。\n监听器接收信号，路由器把请求映射到处理函数。\n静态检查命令查常见问题，差异对比显示修订中改了哪些行。\n脚本可打印索引、缩进嵌套输出，并截断超过显示长度的行。\n适配器连接共享接口与服务商，集成将外部细节隔离于中央模块。\n运行时可绑定处理器、生成键，并通过管道传给另一个进程。\n框架可能先引导启动应用，再初始化组件并附加所需监听器。\n测试框架用模拟响应，使执行不依赖真实外部服务。\n结构定义描述预期字段，实际记录则含已存的值。\n执行器运行提交动作，执行报告记录是否执行成功。\n技术笔记用当前实现例子区分变量、属性和特征字段。\n该文件被别的模块引用，路径变化时多处引用需更新。"
  }
]