resource-curator（资源管理员）

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

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?

Phase 2: Identify Resource Gaps

Compare current resources against targets:

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?

Phase 3: Find New Resources

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

Phase 4: Write Descriptions

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

• Use correct Card syntax with proper icons
• Order resources logically (foundational first, advanced later)
• Ensure consistent formatting

Trusted Sources

Reference Sources (Priority Order)

Article Sources (Priority Order)

Video Creators (Priority Order)

Course Sources

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

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)

Publication Date Guidelines

Rule of thumb: For time-sensitive topics, prefer content from the last 3-5 years. For fundamentals, older classic content is often excellent.

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

<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>

Bad Examples (Avoid)

<!-- 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>

Words and Phrases to Avoid

Words and Phrases That Work

Link Audit Process

Step 1: Check Each Link

For each resource in the concept page:

1. Click the link — Does it load?
2. Note the HTTP status:

Step 2: Content Verification

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

Step 3: Description Review

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?

Step 4: Gap Analysis

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?

Resource Section Templates

Reference Section

## 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>

Articles Section

## 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>

Videos Section

## 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>

Books Section (Optional)

<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>

Courses Section (Optional)

<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>

Resource Audit Report Template

Use this template to document audit findings.

# Resource Audit Report: [Concept Name]

**File:** `/docs/concepts/[slug].mdx`
**Date:** YYYY-MM-DD
**Auditor:** [Name/Claude]

---

## Summary

| Metric | Count |
|--------|-------|
| Total Resources | XX |
| Working Links (200) | XX |
| Broken Links (404) | XX |
| Redirects (301/302) | XX |
| Outdated Content | XX |
| Generic Descriptions | XX |

## Resource Count vs Targets

| Section | Current | Target | Status |
|---------|---------|--------|--------|
| Reference (MDN) | X | 2-4 | ✅/⚠️/❌ |
| Articles | X | 4-6 | ✅/⚠️/❌ |
| Videos | X | 3-4 | ✅/⚠️/❌ |
| Courses | X | 0-3 | ✅/⚠️/❌ |

---

## Broken Links (Remove or Replace)

| Resource | Line | URL | Status | Action |
|----------|------|-----|--------|--------|
| [Title] | XX | [URL] | 404 | Remove |
| [Title] | XX | [URL] | 404 | Replace with [alternative] |

---

## Redirects (Update URLs)

| Resource | Line | Old URL | New URL |
|----------|------|---------|---------|
| [Title] | XX | [old] | [new] |

---

## Outdated Resources (Consider Replacing)

| Resource | Line | Issue | Recommendation |
|----------|------|-------|----------------|
| [Title] | XX | Published 2014, uses var throughout | Replace with [modern alternative] |
| [Title] | XX | Pre-ES6, no mention of let/const | Find updated version or replace |

---

## Description Improvements Needed

| Resource | Line | Current | Suggested |
|----------|------|---------|-----------|
| [Title] | XX | "A guide to closures" | "[Specific description with value prop]" |
| [Title] | XX | "Learn about promises" | "[What makes it unique]. [Why read it]." |

---

## Missing Resources (Recommendations)

| Type | Gap | Suggested Resource | URL |
|------|-----|-------------------|-----|
| Reference | No main MDN link | [Topic] — MDN | [URL] |
| Article | No beginner guide | [Title] — javascript.info | [URL] |
| Video | No visual explanation | [Title] — [Creator] | [URL] |
| Article | No advanced deep-dive | [Title] — 2ality | [URL] |

---

## Non-JavaScript Resources (Remove)

| Resource | Line | Issue |
|----------|------|-------|
| [Title] | XX | Primarily about C#, not 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]

### Medium Priority
1. **Update redirect URL:** [Title] (line XX)
2. **Improve description:** [Title] (line XX)
3. **Add beginner-friendly article**

### Low Priority
1. **Add additional video resource**
2. **Consider adding course section**

---

## 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

Quick Reference

Icon Reference

Character Guidelines

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

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

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

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

Completeness

• 2-4 MDN/official references
• 4-6 quality articles
• 3-4 quality videos
• Resources ordered logically
• Diversity in teaching styles

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.