modern-javascript-patterns — Claude Code skill: what it does
This skill applies modern ES6+ syntax and functional patterns to JavaScript. Use it for legacy refactors, async code, and data transformation pipelines.
/plugin marketplace add wshobson/agents
/plugin install javascript-typescript@claude-code-workflowsWhat modern-javascript-patterns does
The skill covers async/await, destructuring, spread operators, arrow functions, promises, modules, iterators, and generators. It also guides functional programming patterns and data transformation pipelines, with advice aimed at readable and maintainable JavaScript.
Its recommendations include using const by default, template literals, optional chaining, nullish coalescing, array methods, pure functions, and small single-purpose functions. Worked examples are in references/details.md; references/advanced-patterns.md covers this binding, promise anti-patterns, and memory leaks.
Install it when you are modernizing legacy JavaScript or working with asynchronous operations. It is a poor fit for projects that do not use JavaScript.
What it helps with
- replace callbacks with Promises and async/await
- modernize legacy JavaScript with ES6+ syntax
- build a data transformation pipeline
- organize code with modules and pure functions
- inspect this binding and promise pitfalls
Example prompts for the agent
- Rewrite this callback code with async/await and handle errors with try/catch.
- Review `src/data.js` and apply destructuring, optional chaining, and array methods.
- Refactor this legacy code using the guidance from `modern-javascript-patterns`.
How to install modern-javascript-patterns
1Plugin marketplace
/plugin marketplace add wshobson/agents/plugin install javascript-typescript@claude-code-workflowsThis installs the whole javascript-typescript plugin with all its skills
2Skills CLI (Vercel)
npx skills add wshobson/agents --skill modern-javascript-patterns -a claude-code3Manually: put the files in place
~/.claude/skills/modern-javascript-patterns/SKILL.mdCopy the whole skill folder; for one project use .claude/skills/modern-javascript-patterns/
1Skills CLI (Vercel)
npx skills add wshobson/agents --skill modern-javascript-patterns -a codex2Manually: put the files in place
.agents/skills/modern-javascript-patterns/SKILL.mdFor all projects use ~/.agents/skills/
1Skills CLI (Vercel)
npx skills add wshobson/agents --skill modern-javascript-patterns -a cursor2Manually: put the files in place
.cursor/skills/modern-javascript-patterns/SKILL.mdCursor also reads .agents/skills/ and .claude/skills/
1GitHub CLI
gh skill install wshobson/agents modern-javascript-patterns2Manually: put the files in place
.github/skills/modern-javascript-patterns/SKILL.mdPlatform CLI
gemini skills install https://github.com/wshobson/agents --path plugins/javascript-typescript/skills/modern-javascript-patternsManually: put the files in place
.devin/skills/modern-javascript-patterns/SKILL.mdThe legacy .windsurf/skills/ path still works
Claude.ai
Zip the folder and upload it in Settings → Capabilities → Skills
From the same set213
The whole set →Similar
Questions about modern-javascript-patterns
How do I install modern-javascript-patterns in Claude Code?
Add the marketplace with /plugin marketplace add wshobson/agents , then install the plugin with /plugin install javascript-typescript@claude-code-workflows . You can also add the skill with npx skills add wshobson/agents --skill modern-javascript-patterns -a claude-code.
What does modern-javascript-patterns do?
It guides JavaScript refactoring with ES6+ features and functional programming patterns. It is intended for legacy code, asynchronous work, modules, and data transformation.
Where are the worked examples and advanced pitfalls documented?
Worked examples are in references/details.md. The references/advanced-patterns.md file covers this binding, promise anti-patterns, and memory leaks.
Source text
SKILL.md · MIT
--- name: modern-javascript-patterns description: Master ES6+ features including async/await, destructuring, spread operators, arrow functions, promises, modules, iterators, generators, and functional programming patterns for writing clean, efficient JavaScript code. Use when refactoring legacy code, implementing modern patterns, or optimizing JavaScript applications. --- # Modern JavaScript Patterns Comprehensive guide for mastering modern JavaScript (ES6+) features, functional programming patterns, and best practices for writing clean, maintainable, and performant code. ## When to Use This Skill - Refactoring legacy JavaScript to modern syntax - Implementing functional programming patterns - Optimizing JavaScript performance - Writing maintainable and readable code - Working with asynchronous operations - Building modern web applications - Migrating from callbacks to Promises/async-await - Implementing data transformation pipelines ## Detailed patterns and worked examples Detailed pattern documentation lives in `references/details.md`. Read that file when the navigation tier above is insufficient. ## Best Practices 1. **Use const by default**: Only use let when reassignment is needed 2. **Prefer arrow functions**: Especially for callbacks 3. **Use template literals**: Instead of string concatenation 4. **Destructure objects and arrays**: For cleaner code 5. **Use async/await**: Instead of Promise chains 6. **Avoid mutating data**: Use spread operator and array methods 7. **Use optional chaining**: Prevent "Cannot read property of undefined" 8. **Use nullish coalescing**: For default values 9. **Prefer array methods**: Over traditional loops 10. **Use modules**: For better code organization 11. **Write pure functions**: Easier to test and reason about 12. **Use meaningful variable names**: Self-documenting code 13. **Keep functions small**: Single responsibility principle 14. **Handle errors properly**: Use try/catch with async/await 15. **Use strict mode**: `'use strict'` for better error catching For common pitfalls (this binding, promise anti-patterns, memory leaks), see [references/advanced-patterns.md](references/advanced-patterns.md).
© Seth Hobson · MIT · wshobson/agents