Back to Details

resource-curator

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

Skill: Resource Curator for Concept Pages

技能：概念页面资源整理师

Use this skill to find, evaluate, add, and maintain high-quality external resources (articles, videos, courses) for concept documentation pages. This includes auditing existing resources for broken links and outdated content.
使用此技能可为概念文档页面查找、评估、添加并维护高质量的外部资源（文章、视频、课程），包括审核现有资源的失效链接和过时内容。

When to Use

适用场景

  • Adding resources to a new concept page
  • Refreshing resources on existing pages
  • Auditing for broken or outdated links
  • Reviewing community-contributed resources
  • Periodic link maintenance
  • 为新的概念页面添加资源
  • 更新现有页面的资源
  • 审核失效或过时的链接
  • 审核社区贡献的资源
  • 定期维护链接

Resource Curation Methodology

资源整理方法论

Follow these five phases for comprehensive resource curation.
遵循以下五个阶段完成全面的资源整理工作。

Phase 1: Audit Existing Resources

阶段1：审核现有资源

Before adding new resources, audit what's already there:
  1. Check link accessibility — Does each link return 200?
  2. Verify content accuracy — Is the content still correct?
  3. Check publication dates — Is it too old for the topic?
  4. Identify outdated content — Does it use old syntax/patterns?
  5. Review descriptions — Are they specific or generic?
添加新资源前，先审核已有资源：
  1. 检查链接可访问性 — 每个链接是否返回200状态码？
  2. 验证内容准确性 — 内容是否仍然正确？
  3. 查看发布日期 — 对于该主题来说是否过于陈旧？
  4. 识别过时内容 — 是否使用了旧的语法/模式？
  5. 审核描述 — 描述是具体的还是泛泛而谈的？

Phase 2: Identify Resource Gaps

阶段2：识别资源缺口

Compare current resources against targets:
SectionTarget CountIcon
Reference2-4 MDN links
book
Articles4-6 articles
newspaper
Videos3-4 videos
video
Courses1-3 (optional)
graduation-cap
Books1-2 (optional)
book
Ask:
  • Are there enough resources for beginners AND advanced learners?
  • Is there visual content (diagrams, animations)?
  • Are official references (MDN) included?
  • Is there diversity in teaching styles?
将当前资源与目标进行对比：
板块目标数量图标
参考资料2-4个MDN链接
book
文章4-6篇
newspaper
视频3-4个
video
课程1-3个（可选）
graduation-cap
书籍1-2本（可选）
book
思考：
  • 是否有足够的面向初学者和进阶学习者的资源？
  • 是否包含可视化内容（图表、动画）？
  • 是否包含官方参考资料（MDN）？
  • 教学风格是否多样化？

Phase 3: Find New Resources

阶段3：查找新资源

Search trusted sources using targeted queries:
For Articles:
[concept] javascript tutorial site:javascript.info
[concept] javascript explained site:freecodecamp.org
[concept] javascript site:dev.to
[concept] javascript deep dive site:2ality.com
[concept] javascript guide site:css-tricks.com
For Videos:
YouTube: [concept] javascript explained
YouTube: [concept] javascript tutorial
YouTube: jsconf [concept]
YouTube: [concept] javascript fireship
YouTube: [concept] javascript web dev simplified
For MDN:
[concept] site:developer.mozilla.org
[API name] MDN
使用针对性查询在可信来源中搜索：
文章类：
[concept] javascript tutorial site:javascript.info
[concept] javascript explained site:freecodecamp.org
[concept] javascript site:dev.to
[concept] javascript deep dive site:2ality.com
[concept] javascript guide site:css-tricks.com
视频类：
YouTube: [concept] javascript explained
YouTube: [concept] javascript tutorial
YouTube: jsconf [concept]
YouTube: [concept] javascript fireship
YouTube: [concept] javascript web dev simplified
MDN资源：
[concept] site:developer.mozilla.org
[API name] MDN

Phase 4: Write Descriptions

阶段4：撰写描述

Every resource needs a specific, valuable description:
Formula:
Sentence 1: What makes this resource unique OR what it specifically covers
Sentence 2: Why reader should click (what they'll gain, who it's best for)
每个资源都需要具体且有价值的描述：
公式：
第一句：该资源的独特之处或具体涵盖的内容
第二句：读者点击的理由（能获得什么，适合谁）

Phase 5: Format and Organize

阶段5：格式化与组织

  • Use correct Card syntax with proper icons
  • Order resources logically (foundational first, advanced later)
  • Ensure consistent formatting
  • 使用正确的Card语法和对应的图标
  • 按逻辑顺序排列资源（基础内容在前，进阶内容在后）
  • 确保格式一致

Trusted Sources

可信来源

Reference Sources (Priority Order)

参考资料来源（优先级排序）

PrioritySourceURLBest For
1MDN Web Docsdeveloper.mozilla.orgAPI docs, guides, compatibility
2ECMAScript Spectc39.es/ecma262Authoritative behavior
3Node.js Docsnodejs.org/docsNode-specific APIs
4Web.devweb.devPerformance, best practices
5Can I Usecaniuse.comBrowser compatibility
优先级来源URL适用场景
1MDN Web Docsdeveloper.mozilla.orgAPI文档、指南、兼容性
2ECMAScript 规范tc39.es/ecma262权威行为标准
3Node.js 文档nodejs.org/docsNode专属API
4Web.devweb.dev性能优化、最佳实践
5Can I Usecaniuse.com浏览器兼容性

Article Sources (Priority Order)

文章来源（优先级排序）

PrioritySourceWhy Trusted
1javascript.infoComprehensive, exercises, well-maintained
2MDN GuidesOfficial, accurate, regularly updated
3freeCodeCampBeginner-friendly, practical
42ality (Dr. Axel)Deep technical dives, spec-focused
5CSS-TricksDOM, visual topics, well-written
6dev.to (Lydia Hallie)Visual explanations, animations
7LogRocket BlogPractical tutorials, real-world
8Smashing MagazineIn-depth, well-researched
9Digital OceanClear tutorials, examples
10Kent C. DoddsTesting, React, best practices
优先级来源可信理由
1javascript.info内容全面、带练习、维护良好
2MDN 指南官方出品、准确、定期更新
3freeCodeCamp对初学者友好、注重实践
42ality（Dr. Axel）深度技术解析、聚焦规范
5CSS-TricksDOM相关、可视化主题、文笔优秀
6dev.to（Lydia Hallie）可视化讲解、带动画
7LogRocket 博客实用教程、贴近真实场景
8Smashing Magazine内容深入、研究充分
9Digital Ocean教程清晰、示例丰富
10Kent C. Dodds测试、React、最佳实践

Video Creators (Priority Order)

视频创作者（优先级排序）

PriorityCreatorStyleBest For
1FireshipFast, modern, entertainingQuick overviews, modern JS
2Web Dev SimplifiedClear, beginner-friendlyBeginners, fundamentals
3Fun Fun FunctionDeep-dives, personalityUnderstanding "why"
4Traversy MediaComprehensive crash coursesFull topic coverage
5JSConf/dotJSExpert conference talksAdvanced, in-depth
6AcademindThorough explanationsComplete understanding
7The Coding TrainCreative, visualVisual learners
8Wes BosPractical, real-worldApplied learning
9The Net NinjaStep-by-step tutorialsFollowing along
10Programming with MoshProfessional, clearCareer-focused
优先级创作者风格适用场景
1Fireship节奏快、现代化、有趣快速概览、现代JS内容
2Web Dev Simplified清晰易懂、对初学者友好初学者、基础知识
3Fun Fun Function深度解析、富有个性理解底层原理
4Traversy Media全面的速成课程完整主题覆盖
5JSConf/dotJS专家会议演讲进阶、深度内容
6Academind讲解透彻完整理解知识点
7The Coding Train创意性、可视化视觉型学习者
8Wes Bos注重实践、贴近真实场景应用型学习
9The Net Ninja分步教程跟随操作学习
10Programming with Mosh专业、清晰职业导向学习

Course Sources

课程来源

SourceTypeNotes
javascript.infoFreeComprehensive, exercises
PiccalilliFreeWell-written, modern
freeCodeCampFreeProject-based
Frontend MastersPaidExpert instructors
Egghead.ioPaidShort, focused lessons
Udemy (top-rated)PaidCheck reviews carefully
CodecademyFreemiumInteractive
来源类型说明
javascript.info免费内容全面、带练习
Piccalilli免费文笔优秀、现代化
freeCodeCamp免费项目驱动
Frontend Masters付费专家讲师授课
Egghead.io付费简短、聚焦的课程
Udemy（高评分）付费仔细查看评价
Codecademy免费增值交互式学习

Quality Criteria

质量标准

Must Have (Required)

必备条件（强制）

  • Link works — Returns 200 (not 404, 301, 5xx)
  • JavaScript-focused — Not primarily about C#, Python, Java, etc.
  • Technically accurate — No factual errors or anti-patterns
  • Accessible — Free or has meaningful free preview
  • 链接可用 — 返回200状态码（不是404、301、5xx）
  • 聚焦JavaScript — 不主要涉及C#、Python、Java等其他语言
  • 技术准确 — 无事实错误或反模式
  • 可访问 — 免费或提供有意义的免费预览

Should Have (Preferred)

优选条件（推荐）

  • Recent enough — See publication date guidelines below
  • Reputable source — From trusted sources list or well-known creator
  • Unique perspective — Not duplicate of existing resources
  • Appropriate depth — Matches concept complexity
  • Good engagement — Positive comments, high views (for videos)
  • 时效性足够 — 参考下方发布日期指南
  • 来源可信 — 来自可信来源列表或知名创作者
  • 视角独特 — 不与现有资源重复
  • 深度适配 — 与概念复杂度匹配
  • 互动良好 — 正面评论多、播放量高（视频类）

Red Flags (Reject)

警示信号（拒绝）

Red FlagWhy It Matters
Uses 
var
everywhere		Outdated for ES6+ topics
Teaches anti-patternsHarmful to learners
Primarily other languagesWrong focus
Hard paywall (no preview)Inaccessible
Pre-2015 for modern topicsLikely outdated
Low quality commentsOften indicates issues
Factual errorsSpreads misinformation
Clickbait title, thin contentWastes reader time
警示信号原因
通篇使用
var
对于ES6+主题已过时
教授反模式对学习者有害
主要涉及其他语言焦点错误
严格付费墙（无预览）无法访问
现代主题内容发布于2015年前可能已过时
低质量评论通常存在内容问题
事实错误传播错误信息
标题党、内容空洞浪费读者时间

Publication Date Guidelines

发布日期指南

Topic CategoryMinimum YearReasoning
ES6+ Features2015+ES6 released June 2015
Promises2015+Native Promises in ES6
async/await2017+ES2017 feature
ES Modules2018+Stable browser support
Optional chaining (?.)2020+ES2020 feature
Nullish coalescing (??)2020+ES2020 feature
Top-level await2022+ES2022 feature
Fundamentals (closures, scope, this)AnyCore concepts don't change
DOM manipulation2018+Modern APIs preferred
Fetch API2017+Widespread support
Rule of thumb: For time-sensitive topics, prefer content from the last 3-5 years. For fundamentals, older classic content is often excellent.
主题分类最早年份理由
ES6+特性2015+ES6于2015年6月发布
Promises2015+ES6引入原生Promises
async/await2017+ES2017特性
ES Modules2018+浏览器稳定支持
可选链（?.）2020+ES2020特性
空值合并运算符（??）2020+ES2020特性
顶层await2022+ES2022特性
基础知识（闭包、作用域、this）任意年份核心概念不会改变
DOM操作2018+推荐使用现代API
Fetch API2017+广泛支持
经验法则： 对于时效性强的主题，优先选择近3-5年的内容。对于基础知识，经典旧内容通常依然优秀。

Description Writing Guide

描述撰写指南

The Formula

公式

Sentence 1: What makes this resource unique OR what it specifically covers
Sentence 2: Why reader should click (what they'll gain, who it's best for)
第一句：涵盖内容 / 独特之处
第二句：阅读/观看理由 / 适用人群

Good Examples

优秀示例

markdown
<Card title="JavaScript Visualized: Promises & Async/Await — Lydia Hallie" icon="newspaper" href="https://dev.to/lydiahallie/javascript-visualized-promises-async-await-5gke">
  Animated GIFs showing the call stack, microtask queue, and event loop in action. 
  The visuals make Promise execution order finally click for visual learners.
</Card>

<Card title="What the heck is the event loop anyway? — Philip Roberts" icon="video" href="https://www.youtube.com/watch?v=8aGhZQkoFbQ">
  The legendary JSConf talk that made the event loop click for millions of developers. 
  Philip Roberts' live visualizations are the gold standard — a must-watch.
</Card>

<Card title="You Don't Know JS: Scope & Closures — Kyle Simpson" icon="book" href="https://github.com/getify/You-Dont-Know-JS/blob/2nd-ed/scope-closures/README.md">
  Kyle Simpson's deep dive into JavaScript's scope mechanics and closure behavior. 
  Goes beyond the basics into edge cases and mental models for truly understanding scope.
</Card>

<Card title="JavaScript Promises in 10 Minutes — Web Dev Simplified" icon="video" href="https://www.youtube.com/watch?v=DHvZLI7Db8E">
  Quick, clear explanation covering Promise creation, chaining, and error handling. 
  Perfect starting point if you're new to async JavaScript.
</Card>

<Card title="How to Escape Async/Await Hell — Aditya Agarwal" icon="newspaper" href="https://medium.com/free-code-camp/avoiding-the-async-await-hell-c77a0fb71c4c">
  The pizza-and-drinks ordering analogy makes parallel vs sequential execution crystal clear. 
  Essential reading once you know async/await basics but want to write faster code.
</Card>
markdown
<Card title="JavaScript Visualized: Promises & Async/Await — Lydia Hallie" icon="newspaper" href="https://dev.to/lydiahallie/javascript-visualized-promises-async-await-5gke">
  展示调用栈、微任务队列和事件循环运行过程的动画GIF。 
  可视化效果让视觉型学习者终于理解Promise的执行顺序。
</Card>

<Card title="What the heck is the event loop anyway? — Philip Roberts" icon="video" href="https://www.youtube.com/watch?v=8aGhZQkoFbQ">
  这场传奇的JSConf演讲让数百万开发者理解了事件循环。 
  Philip Roberts的现场可视化是黄金标准——必看内容。
</Card>

<Card title="You Don't Know JS: Scope & Closures — Kyle Simpson" icon="book" href="https://github.com/getify/You-Dont-Know-JS/blob/2nd-ed/scope-closures/README.md">
  Kyle Simpson对JavaScript作用域机制和闭包行为的深度解析。 
  超越基础知识，深入边缘案例和心智模型，帮助真正理解作用域。
</Card>

<Card title="JavaScript Promises in 10 Minutes — Web Dev Simplified" icon="video" href="https://www.youtube.com/watch?v=DHvZLI7Db8E">
  关于Promise创建、链式调用和错误处理的快速清晰讲解。 
  是异步JavaScript新手的完美起点。
</Card>

<Card title="How to Escape Async/Await Hell — Aditya Agarwal" icon="newspaper" href="https://medium.com/free-code-camp/avoiding-the-async-await-hell-c77a0fb71c4c">
  披萨和饮料订单的类比让并行与顺序执行的区别变得非常清晰。 
  当你掌握了async/await基础但想写出更快的代码时，这篇文章是必读内容。
</Card>

Bad Examples (Avoid)

反面示例（避免）

markdown
<!-- TOO GENERIC -->
<Card title="Promises Tutorial" icon="newspaper" href="...">
  A comprehensive guide to Promises in JavaScript.
</Card>

<!-- NO VALUE PROPOSITION -->
<Card title="Learn Closures" icon="video" href="...">
  This video explains closures in JavaScript.
</Card>

<!-- VAGUE, NO SPECIFICS -->
<Card title="JavaScript Guide" icon="newspaper" href="...">
  Everything you need to know about JavaScript.
</Card>

<!-- JUST RESTATING THE TITLE -->
<Card title="Understanding the Event Loop" icon="video" href="...">
  A video about understanding the event loop.
</Card>
markdown
<!-- 过于泛泛 -->
<Card title="Promises Tutorial" icon="newspaper" href="...">
  关于JavaScript中Promises的全面指南。
</Card>

<!-- 无价值主张 -->
<Card title="Learn Closures" icon="video" href="...">
  这个视频讲解了JavaScript中的闭包。
</Card>

<!-- 模糊、无具体内容 -->
<Card title="JavaScript Guide" icon="newspaper" href="...">
  你需要了解的关于JavaScript的一切。
</Card>

<!-- 只是重复标题 -->
<Card title="Understanding the Event Loop" icon="video" href="...">
  一个关于理解事件循环的视频。
</Card>

Words and Phrases to Avoid

应避免的词汇和短语

AvoidWhyUse Instead
"comprehensive guide to..."Vague, overusedSpecify what's covered
"learn all about..."GenericWhat specifically will they learn?
"everything you need to know..."HyperbolicBe specific
"great tutorial on..."Subjective fillerWhy is it great?
"explains X"Too basicHow does it explain? What's unique?
"in-depth look at..."VagueWhat depth? What aspect?
避免使用原因替代表达
"comprehensive guide to..."模糊、被过度使用明确说明涵盖的内容
"learn all about..."泛泛而谈具体说明能学到什么
"everything you need to know..."夸张保持具体
"great tutorial on..."主观冗余说明它优秀的原因
"explains X"过于基础说明讲解方式、独特之处
"in-depth look at..."模糊说明深度和侧重点

Words and Phrases That Work

推荐使用的词汇和短语

Good PhraseExample
"step-by-step walkthrough""Step-by-step walkthrough of building a Promise from scratch"
"visual explanation""Visual explanation with animated diagrams"
"deep dive into""Deep dive into V8's optimization strategies"
"practical examples of""Practical examples of closures in React hooks"
"the go-to reference for""The go-to reference for array method signatures"
"finally makes X click""Finally makes prototype chains click"
"perfect for beginners""Perfect for beginners new to async code"
"covers X, Y, and Z""Covers creation, chaining, and error handling"
推荐短语示例
"step-by-step walkthrough""从零开始构建Promise的分步讲解"
"visual explanation""带动画图表的可视化讲解"
"deep dive into""深入解析V8的优化策略"
"practical examples of""React Hooks中闭包的实用示例"
"the go-to reference for""数组方法签名的首选参考资料"
"finally makes X click""终于让原型链的概念清晰易懂"
"perfect for beginners""非常适合异步代码新手"
"covers X, Y, and Z""涵盖创建、链式调用和错误处理"

Link Audit Process

链接审核流程

Step 1: Check Each Link

步骤1：检查每个链接

For each resource in the concept page:
  1. Click the link — Does it load?
  2. Note the HTTP status:
StatusMeaningAction
200OKKeep, continue to content check
301/302RedirectUpdate to final URL
404Not FoundRemove or find replacement
403ForbiddenCheck manually, may be geo-blocked
5xxServer ErrorRetry later, may be temporary
对于概念页面中的每个资源：
  1. 点击链接 — 是否能加载？
  2. 记录HTTP状态码：
状态码含义操作
200正常保留，继续检查内容
301/302重定向更新为最终URL
404未找到删除或寻找替代资源
403禁止访问手动检查，可能是地域限制
5xx服务器错误稍后重试，可能是临时问题

Step 2: Content Verification

步骤2：内容验证

For each accessible link:
  1. Skim the content — Is it still accurate?
  2. Check the date — When was it published/updated?
  3. Verify JavaScript focus — Is it primarily about JS?
  4. Look for red flags — Anti-patterns, errors, outdated syntax
对于每个可访问的链接：
  1. 浏览内容 — 是否仍然准确？
  2. 检查发布日期 — 何时发布/更新？
  3. 验证JavaScript聚焦度 — 是否主要关于JS？
  4. 查找警示信号 — 反模式、错误、过时语法

Step 3: Description Review

步骤3：描述审核

For each resource:
  1. Read current description — Is it specific?
  2. Compare to actual content — Does it match?
  3. Check for generic phrases — "comprehensive guide", etc.
  4. Identify improvements — How can it be more specific?
对于每个资源：
  1. 阅读当前描述 — 是否具体？
  2. 与实际内容对比 — 是否匹配？
  3. 检查泛泛之词 — 如"comprehensive guide"等
  4. 确定改进方向 — 如何让描述更具体？

Step 4: Gap Analysis

步骤4：缺口分析

After auditing all resources:
  1. Count by section — Do we meet targets?
  2. Check diversity — Beginner AND advanced? Visual AND text?
  3. Identify missing types — No MDN? No videos?
  4. Note recommendations — What should we add?
审核完所有资源后：
  1. 按板块统计数量 — 是否达到目标？
  2. 检查多样性 — 是否覆盖初学者和进阶者？是否包含可视化和文本资源？
  3. 识别缺失类型 — 没有MDN资源？没有视频？
  4. 记录建议 — 应该添加什么？

Resource Section Templates

资源板块模板

Reference Section

参考资料板块

markdown
undefined
markdown
undefined

Reference

参考资料

<CardGroup cols={2}> <Card title="[Main Topic] — MDN" icon="book" href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/..."> Official MDN documentation covering [specific aspects]. The authoritative reference for [what it's best for]. </Card> <Card title="[Related API/Concept] — MDN" icon="book" href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/..."> [What this reference covers]. Essential reading for understanding [specific aspect]. </Card> </CardGroup> ```
<CardGroup cols={2}> <Card title="[主主题] — MDN" icon="book" href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/..."> 官方MDN文档涵盖[具体方面]。 是[适用场景]的权威参考资料。 </Card> <Card title="[相关API/概念] — MDN" icon="book" href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/..."> [该参考资料涵盖的内容]。 是理解[具体方面]的必读内容。 </Card> </CardGroup> ```

Articles Section

文章板块

markdown
undefined
markdown
undefined

Articles

文章

<CardGroup cols={2}> <Card title="[Article Title]" icon="newspaper" href="..."> [What makes it unique/what it covers]. [Why read this one/who it's for]. </Card> <Card title="[Article Title]" icon="newspaper" href="..."> [Specific coverage]. [Value proposition]. </Card> <Card title="[Article Title]" icon="newspaper" href="..."> [Unique angle]. [Why it's worth reading]. </Card> <Card title="[Article Title]" icon="newspaper" href="..."> [What it covers]. [Best for whom]. </Card> </CardGroup> ```
<CardGroup cols={2}> <Card title="[文章标题]" icon="newspaper" href="..."> [独特之处/涵盖内容]。 [阅读理由/适用人群]。 </Card> <Card title="[文章标题]" icon="newspaper" href="..."> [具体覆盖内容]。 [价值主张]。 </Card> <Card title="[文章标题]" icon="newspaper" href="..."> [独特视角]。 [值得阅读的原因]。 </Card> <Card title="[文章标题]" icon="newspaper" href="..."> [涵盖内容]。 [适用人群]。 </Card> </CardGroup> ```

Videos Section

视频板块

markdown
undefined
markdown
undefined

Videos

视频

<CardGroup cols={2}> <Card title="[Video Title] — [Creator]" icon="video" href="https://www.youtube.com/watch?v=..."> [What it covers/unique approach]. [Why watch/who it's for]. </Card> <Card title="[Video Title] — [Creator]" icon="video" href="https://www.youtube.com/watch?v=..."> [Specific focus]. [What makes it stand out]. </Card> <Card title="[Video Title] — [Creator]" icon="video" href="https://www.youtube.com/watch?v=..."> [Coverage]. [Value]. </Card> </CardGroup> ```
<CardGroup cols={2}> <Card title="[视频标题] — [创作者]" icon="video" href="https://www.youtube.com/watch?v=..."> [涵盖内容/独特方法]。 [观看理由/适用人群]。 </Card> <Card title="[视频标题] — [创作者]" icon="video" href="https://www.youtube.com/watch?v=..."> [具体侧重点]。 [突出优势]。 </Card> <Card title="[视频标题] — [创作者]" icon="video" href="https://www.youtube.com/watch?v=..."> [覆盖内容]。 [价值]。 </Card> </CardGroup> ```

Books Section (Optional)

书籍板块（可选）

markdown
<Card title="[Book Title] — [Author]" icon="book" href="...">
  [What the book covers and its approach]. 
  [Who should read it and what they'll gain].
</Card>
markdown
<Card title="[书籍标题] — [作者]" icon="book" href="...">
  [书籍涵盖内容及讲解方式]。 
  [目标读者及收获]。
</Card>

Courses Section (Optional)

课程板块（可选）

markdown
<CardGroup cols={2}>
  <Card title="[Course Title] — [Platform]" icon="graduation-cap" href="...">
    [What the course covers]. 
    [Format and who it's best for].
  </Card>
</CardGroup>
markdown
<CardGroup cols={2}>
  <Card title="[课程标题] — [平台]" icon="graduation-cap" href="...">
    [课程涵盖内容]。 
    [课程形式及适用人群]。
  </Card>
</CardGroup>

Resource Audit Report Template

资源审核报告模板

Use this template to document audit findings.
markdown
undefined
使用此模板记录审核结果。
markdown
undefined

Resource Audit Report: [Concept Name]

资源审核报告：[概念名称]

File: 
/docs/concepts/[slug].mdx
Date: YYYY-MM-DD Auditor: [Name/Claude]
文件： 
/docs/concepts/[slug].mdx
日期： YYYY-MM-DD 审核人： [姓名/Claude]

Summary

摘要

MetricCount
Total ResourcesXX
Working Links (200)XX
Broken Links (404)XX
Redirects (301/302)XX
Outdated ContentXX
Generic DescriptionsXX
指标数量
总资源数XX
可用链接（200）XX
失效链接（404）XX
重定向链接（301/302）XX
过时内容XX
泛泛描述XX

Resource Count vs Targets

资源数量与目标对比

SectionCurrentTargetStatus
Reference (MDN)X2-4✅/⚠️/❌
ArticlesX4-6✅/⚠️/❌
VideosX3-4✅/⚠️/❌
CoursesX0-3✅/⚠️/❌
板块当前数量目标数量状态
参考资料（MDN）X2-4✅/⚠️/❌
文章X4-6✅/⚠️/❌
视频X3-4✅/⚠️/❌
课程X0-3✅/⚠️/❌

Broken Links (Remove or Replace)

失效链接（删除或替换）

ResourceLineURLStatusAction
[Title]XX[URL]404Remove
[Title]XX[URL]404Replace with [alternative]
资源行号URL状态码操作
[标题]XX[URL]404删除
[标题]XX[URL]404替换为[替代资源]

Redirects (Update URLs)

重定向链接（更新URL）

ResourceLineOld URLNew URL
[Title]XX[old][new]
资源行号旧URL新URL
[标题]XX[旧URL][新URL]

Outdated Resources (Consider Replacing)

过时资源（考虑替换）

ResourceLineIssueRecommendation
[Title]XXPublished 2014, uses var throughoutReplace with [modern alternative]
[Title]XXPre-ES6, no mention of let/constFind updated version or replace
资源行号问题建议
[标题]XX2014年发布，通篇使用var替换为[现代替代资源]
[标题]XX早于ES6，未提及let/const寻找更新版本或替换

Description Improvements Needed

需要改进的描述

ResourceLineCurrentSuggested
[Title]XX"A guide to closures""[Specific description with value prop]"
[Title]XX"Learn about promises""[What makes it unique]. [Why read it]."
资源行号当前描述建议描述
[标题]XX"闭包指南""[带价值主张的具体描述]"
[标题]XX"学习Promise""[独特之处]. [阅读理由]."

Missing Resources (Recommendations)

缺失资源（推荐补充）

TypeGapSuggested ResourceURL
ReferenceNo main MDN link[Topic] — MDN[URL]
ArticleNo beginner guide[Title] — javascript.info[URL]
VideoNo visual explanation[Title] — [Creator][URL]
ArticleNo advanced deep-dive[Title] — 2ality[URL]
类型缺口推荐资源URL
参考资料无主MDN链接[主题] — MDN[URL]
文章无初学者指南[标题] — javascript.info[URL]
视频无可视化讲解[标题] — [创作者][URL]
文章无进阶深度解析[标题] — 2ality[URL]

Non-JavaScript Resources (Remove)

非JavaScript资源（删除）

ResourceLineIssue
[Title]XXPrimarily about C#, not JavaScript
资源行号问题
[标题]XX主要涉及C#，与JavaScript无关

Action Items

行动项

High Priority (Do First)

高优先级（优先处理）

  1. Remove broken link: [Title] (line XX)
  2. Add missing MDN reference: [Topic]
  3. Replace outdated resource: [Title] with [alternative]
  1. 删除失效链接： [标题]（第XX行）
  2. 添加缺失的MDN参考资料： [主题]
  3. 替换过时资源： [标题] 替换为 [替代资源]

Medium Priority

中优先级

  1. Update redirect URL: [Title] (line XX)
  2. Improve description: [Title] (line XX)
  3. Add beginner-friendly article
  1. 更新重定向URL： [标题]（第XX行）
  2. 改进描述： [标题]（第XX行）
  3. 添加初学者友好的文章

Low Priority

低优先级

  1. Add additional video resource
  2. Consider adding course section
  1. 添加额外视频资源
  2. 考虑添加课程板块

Verification Checklist

验证清单

After making changes:
  • All broken links removed or replaced
  • All redirect URLs updated
  • Outdated resources replaced
  • Generic descriptions rewritten
  • Missing resource types added
  • Resource counts meet targets
  • All new links verified working
  • All descriptions are specific and valuable

---
完成修改后：
  • 所有失效链接已删除或替换
  • 所有重定向URL已更新
  • 过时资源已替换
  • 泛泛描述已重写
  • 缺失类型的资源已添加
  • 资源数量达到目标
  • 所有新链接已验证可用
  • 所有描述都具体且有价值

---

Quick Reference

快速参考

Icon Reference

图标参考

Content TypeIcon Value
MDN/Official docs
book
Articles/Blog posts
newspaper
Videos
video
Courses
graduation-cap
Books
book
Related conceptsContext-appropriate
内容类型图标值
MDN/官方文档
book
文章/博客
newspaper
视频
video
课程
graduation-cap
书籍
book
相关概念上下文适配图标

Character Guidelines

字符指南

ElementGuideline
Card titleKeep concise, include creator for videos
Description sentence 1What it covers / what's unique
Description sentence 2Why read/watch / who it's for
元素指南
卡片标题保持简洁，视频类需包含创作者
描述第一句涵盖内容 / 独特之处
描述第二句阅读/观看理由 / 适用人群

Resource Ordering

资源排序

Within each section, order resources:
  1. Most foundational/beginner-friendly first
  2. Official references before community content
  3. Most highly recommended prominently placed
  4. Advanced/niche content last
在每个板块内，按以下顺序排列资源：
  1. 最基础/对初学者友好的内容在前
  2. 官方参考资料优先于社区内容
  3. 最受推荐的内容放在显眼位置
  4. 进阶/小众内容在后

Quality Checklist

质量检查清单

Link Verification

链接验证

  • All links return 200 (not 404, 301)
  • No redirect chains
  • No hard paywalls without notice
  • All URLs are HTTPS where available
  • 所有链接返回200状态码（不是404、301）
  • 无重定向链
  • 无未标注的严格付费墙
  • 所有可用URL均为HTTPS

Content Quality

内容质量

  • All resources are JavaScript-focused
  • No resources teaching anti-patterns
  • Publication dates appropriate for topic
  • Mix of beginner and advanced content
  • Visual and text resources included
  • 所有资源聚焦JavaScript
  • 无教授反模式的资源
  • 发布日期符合主题时效性要求
  • 包含初学者和进阶内容
  • 包含可视化和文本资源

Description Quality

描述质量

  • All descriptions are specific (not generic)
  • Descriptions explain unique value
  • No "comprehensive guide to..." phrases
  • Each description is 2 sentences
  • Descriptions match actual content
  • 所有描述都具体（非泛泛而谈）
  • 描述说明了独特价值
  • 无"comprehensive guide to..."类短语
  • 每个描述为2句话
  • 描述与实际内容匹配

Completeness

完整性

  • 2-4 MDN/official references
  • 4-6 quality articles
  • 3-4 quality videos
  • Resources ordered logically
  • Diversity in teaching styles
  • 包含2-4个MDN/官方参考资料
  • 包含4-6篇优质文章
  • 包含3-4个优质视频
  • 资源按逻辑顺序排列
  • 教学风格多样化

Summary

总结

When curating resources for a concept page:
  1. Audit first — Check all existing links and content
  2. Identify gaps — Compare against targets (2-4 refs, 4-6 articles, 3-4 videos)
  3. Find quality resources — Search trusted sources
  4. Write specific descriptions — What's unique + why read/watch
  5. Format correctly — Proper Card syntax, icons, ordering
  6. Document changes — Use the audit report template
Remember: Resources should enhance learning, not pad the page. Every link should offer genuine value. Quality over quantity — a few excellent resources beat many mediocre ones.
整理概念页面资源时：
  1. 先审核 — 检查所有现有链接和内容
  2. 识别缺口 — 与目标对比（2-4个参考资料、4-6篇文章、3-4个视频）
  3. 寻找优质资源 — 在可信来源中搜索
  4. 撰写具体描述 — 说明独特之处 + 阅读/观看理由
  5. 正确格式化 — 使用标准Card语法、图标和排序规则
  6. 记录变更 — 使用审核报告模板
记住： 资源应提升学习效果，而非填充页面。每个链接都应提供真正的价值。质量优先于数量——少量优秀资源胜过大量平庸资源。