resource-curator▌
leonardomso/33-js-concepts · updated Apr 8, 2026
MDX-style export adds YAML metadata + attribution linking explainx.ai and this canonical listing URL.
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.
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:
- Check link accessibility — Does each link return 200?
- Verify content accuracy — Is the content still correct?
- Check publication dates — Is it too old for the topic?
- Identify outdated content — Does it use old syntax/patterns?
- Review descriptions — Are they specific or generic?
Phase 2: Identify Resource Gaps
Compare current resources against targets:
| Section | Target Count | Icon |
|---|---|---|
| Reference | 2-4 MDN links | book |
| Articles | 4-6 articles | newspaper |
| Videos | 3-4 videos | video |
| Courses | 1-3 (optional) | graduation-cap |
| Books | 1-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?
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)
| Priority | Source | URL | Best For |
|---|---|---|---|
| 1 | MDN Web Docs | developer.mozilla.org | API docs, guides, compatibility |
| 2 | ECMAScript Spec | tc39.es/ecma262 | Authoritative behavior |
| 3 | Node.js Docs | nodejs.org/docs | Node-specific APIs |
| 4 | Web.dev | web.dev | Performance, best practices |
| 5 | Can I Use | caniuse.com | Browser compatibility |
Article Sources (Priority Order)
| Priority | Source | Why Trusted |
|---|---|---|
| 1 | javascript.info | Comprehensive, exercises, well-maintained |
| 2 | MDN Guides | Official, accurate, regularly updated |
| 3 | freeCodeCamp | Beginner-friendly, practical |
| 4 | 2ality (Dr. Axel) | Deep technical dives, spec-focused |
| 5 | CSS-Tricks | DOM, visual topics, well-written |
| 6 | dev.to (Lydia Hallie) | Visual explanations, animations |
| 7 | LogRocket Blog | Practical tutorials, real-world |
| 8 | Smashing Magazine | In-depth, well-researched |
| 9 | Digital Ocean | Clear tutorials, examples |
| 10 | Kent C. Dodds | Testing, React, best practices |
Video Creators (Priority Order)
| Priority | Creator | Style | Best For |
|---|---|---|---|
| 1 | Fireship | Fast, modern, entertaining | Quick overviews, modern JS |
| 2 | Web Dev Simplified | Clear, beginner-friendly | Beginners, fundamentals |
| 3 | Fun Fun Function | Deep-dives, personality | Understanding "why" |
| 4 | Traversy Media | Comprehensive crash courses | Full topic coverage |
| 5 | JSConf/dotJS | Expert conference talks | Advanced, in-depth |
| 6 | Academind | Thorough explanations | Complete understanding |
| 7 | The Coding Train | Creative, visual | Visual learners |
| 8 | Wes Bos | Practical, real-world | Applied learning |
| 9 | The Net Ninja | Step-by-step tutorials | Following along |
| 10 | Programming with Mosh | Professional, clear | Career-focused |
Course Sources
| Source | Type | Notes |
|---|---|---|
| javascript.info | Free | Comprehensive, exercises |
| Piccalilli | Free | Well-written, modern |
| freeCodeCamp | Free | Project-based |
| Frontend Masters | Paid | Expert instructors |
| Egghead.io | Paid | Short, focused lessons |
| Udemy (top-rated) | Paid | Check reviews carefully |
| Codecademy | Freemium | Interactive |
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)
| Red Flag | Why It Matters |
|---|---|
Uses var everywhere |
Outdated for ES6+ topics |
| Teaches anti-patterns | Harmful to learners |
| Primarily other languages | Wrong focus |
| Hard paywall (no preview) | Inaccessible |
| Pre-2015 for modern topics | Likely outdated |
| Low quality comments | Often indicates issues |
| Factual errors | Spreads misinformation |
| Clickbait title, thin content | Wastes reader time |
Publication Date Guidelines
| Topic Category | Minimum Year | Reasoning |
|---|---|---|
| ES6+ Features | 2015+ | ES6 released June 2015 |
| Promises | 2015+ | Native Promises in ES6 |
| async/await | 2017+ | ES2017 feature |
| ES Modules | 2018+ | Stable browser support |
| Optional chaining (?.) | 2020+ | ES2020 feature |
| Nullish coalescing (??) | 2020+ | ES2020 feature |
| Top-level await | 2022+ | ES2022 feature |
| Fundamentals (closures, scope, this) | Any | Core concepts don't change |
| DOM manipulation | 2018+ | Modern APIs preferred |
| Fetch API | 2017+ | 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.
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
| Avoid | Why | Use Instead |
|---|---|---|
| "comprehensive guide to..." | Vague, overused | Specify what's covered |
| "learn all about..." | Generic | What specifically will they learn? |
| "everything you need to know..." | Hyperbolic | Be specific |
| "great tutorial on..." | Subjective filler | Why how to use resource-curator How to use resource-curator on CursorAI-first code editor with Composer 1 PrerequisitesBefore installing skills in Cursor, ensure your development environment meets these requirements:
2 Execute installation commandExecute the skills CLI command in your project's root directory to begin installation: $npx skills add https://github.com/leonardomso/33-js-concepts --skill resource-curator The skills CLI fetches 3 Select Cursor when promptedThe CLI will show a list of available agents. Use arrow keys to navigate and space to select Cursor: ◆ Which agents do you want to install to? │ │ ── Universal (.agents/skills) ── always included ──── │ • Amp │ • Antigravity │ • Cline │ • Codex │ ●Cursor(selected) │ • Cursor │ • Windsurf 4 Verify installationConfirm successful installation by checking the skill directory location: .cursor/skills/resource-curator Reload or restart Cursor to activate resource-curator. Access the skill through slash commands (e.g., ⚠ Security & Verification NoticeWe perform automated surface-level scans (Gen AI Scanner, Socket, Snyk) during installation. These checks detect common vulnerabilities but do not guarantee complete security. Always review skill source code and verify the publisher's reputation before production use. Skills execute code in your development environment. Always verify the publisher's identity, review recent commits, and test in isolated environments before production deployment. List & Monetize Your SkillSubmit your Claude Code skill and start earning Use Cases▌User Story & Requirements GenerationCreate detailed user stories, acceptance criteria, and feature specs Example Generate user stories for 'password reset feature' with acceptance criteria, edge cases, and test scenarios ✓ Reduce spec writing time by 50%, ensure comprehensive coverage Competitive AnalysisResearch competitors, compare features, identify gaps Example Analyze 5 competitor products, create feature comparison matrix, suggest differentiation opportunities ✓ Complete competitive research in 2 hours instead of 2 days Roadmap PrioritizationEvaluate features using frameworks (RICE, ICE, Kano) and create prioritized backlogs Example Score 20 feature ideas using RICE framework, generate prioritized roadmap with rationale ✓ Make data-driven prioritization decisions faster Stakeholder CommunicationDraft PRDs, status updates, and stakeholder presentations Example Create executive summary of Q3 roadmap, monthly progress report, feature launch announcement ✓ Save 3-5 hours/week on communication overhead Implementation Guide▌Prerequisites
Time Estimate30-60 minutes to see productivity improvements Installation Steps
Common Pitfalls
Best Practices▌✓ Do
✗ Don't
💡 Pro Tips
When to Use This▌✓ Use WhenUse for user story writing, competitive research, roadmap prioritization, stakeholder communication, and PRD drafting. Best for reducing repetitive documentation and research work. ✗ Avoid WhenAvoid for strategic product vision (requires deep customer empathy), pricing decisions (needs market and financial expertise), or when face-to-face customer discovery is more valuable than speed. Learning Path▌
DiscussionProduct Hunt–style comments (not star reviews)
general reviews Ratings4.6★★★★★45 reviews
showing 1-10 of 45 1 / 5 |