Traction scoreGitHub stars can be faked, so popularity alone can be misleading. Traction Score looks for broader signs of recent attention, adoption, and active maintenance.
Claude Code Config bundles five skills that bring structure to AI-assisted development. Frontend engineers write performant React and Next.js code guided by Vercel performance rules. Technical leads enforce coding rigor and audit UI compliance automatically. Every complex task starts with a persistent plan file that keeps the session focused through context resets. The collection treats the agent as a deliberate engineer rather than a fast typist.
WHO IT'S FOR
Frontend Engineers (React/Next.js)
writing and reviewing performant React/Next.js code
Technical Leads
enforcing coding standards and ensuring code quality
AI Coding Assistant Users
structuring complex tasks with persistent plan files
UI/UX Developers
auditing web interfaces for compliance with guidelines
Compatible AgentsThe repository documents support for these agents. The skills may also work with other agents that can load SKILL.md files, but they may need some setup or small changes.
Follow the documented setup, then try a first task.
Claude Code copy-paste installation
Installs: The documented Claude Code configuration bundle, including its rules, two explicitly listed skills, custom agents, slash command, hooks, and global instructions. · Claude Code
Before you start
Claude Code
curl
In a Claude Code agent session—not a terminal—paste the following prompt exactly. Before replacing any existing destination file, choose Skip, Overwrite, or Merge when Claude Code asks; the prompt expressly prohibits overwriting without consent.
Install Claude Code configuration from https://github.com/jarrodwatts/claude-code-config
Fetch and install these files to ~/.claude/:
**Rules** (path-scoped instructions):
- https://raw.githubusercontent.com/jarrodwatts/claude-code-config/master/rules/typescript.md → ~/.claude/rules/typescript.md
- https://raw.githubusercontent.com/jarrodwatts/claude-code-config/master/rules/testing.md → ~/.claude/rules/testing.md
- https://raw.githubusercontent.com/jarrodwatts/claude-code-config/master/rules/comments.md → ~/.claude/rules/comments.md
- https://raw.githubusercontent.com/jarrodwatts/claude-code-config/master/rules/forge.md → ~/.claude/rules/forge.md
**Skills** (model-invoked capabilities):
- https://raw.githubusercontent.com/jarrodwatts/claude-code-config/master/skills/planning-with-files/SKILL.md → ~/.claude/skills/planning-with-files/SKILL.md
- https://raw.githubusercontent.com/jarrodwatts/claude-code-config/master/skills/planning-with-files/examples.md → ~/.claude/skills/planning-with-files/examples.md
- https://raw.githubusercontent.com/jarrodwatts/claude-code-config/master/skills/planning-with-files/reference.md → ~/.claude/skills/planning-with-files/reference.md
- https://raw.githubusercontent.com/jarrodwatts/claude-code-config/master/skills/react-useeffect/SKILL.md → ~/.claude/skills/react-useeffect/SKILL.md
- https://raw.githubusercontent.com/jarrodwatts/claude-code-config/master/skills/react-useeffect/alternatives.md → ~/.claude/skills/react-useeffect/alternatives.md
- https://raw.githubusercontent.com/jarrodwatts/claude-code-config/master/skills/react-useeffect/anti-patterns.md → ~/.claude/skills/react-useeffect/anti-patterns.md
**Agents** (custom subagents):
- https://raw.githubusercontent.com/jarrodwatts/claude-code-config/master/agents/codebase-search.md → ~/.claude/agents/codebase-search.md
- https://raw.githubusercontent.com/jarrodwatts/claude-code-config/master/agents/media-interpreter.md → ~/.claude/agents/media-interpreter.md
- https://raw.githubusercontent.com/jarrodwatts/claude-code-config/master/agents/open-source-librarian.md → ~/.claude/agents/open-source-librarian.md
- https://raw.githubusercontent.com/jarrodwatts/claude-code-config/master/agents/tech-docs-writer.md → ~/.claude/agents/tech-docs-writer.md
**Commands** (slash commands):
- https://raw.githubusercontent.com/jarrodwatts/claude-code-config/master/commands/interview.md → ~/.claude/commands/interview.md
**Hooks** (event-triggered scripts):
- https://raw.githubusercontent.com/jarrodwatts/claude-code-config/master/hooks/keyword-detector.py → ~/.claude/hooks/keyword-detector.py
- https://raw.githubusercontent.com/jarrodwatts/claude-code-config/master/hooks/check-comments.py → ~/.claude/hooks/check-comments.py
- https://raw.githubusercontent.com/jarrodwatts/claude-code-config/master/hooks/todo-enforcer.sh → ~/.claude/hooks/todo-enforcer.sh
**Global Instructions**:
- https://raw.githubusercontent.com/jarrodwatts/claude-code-config/master/CLAUDE.md → ~/.claude/CLAUDE.md
**CRITICAL: Do NOT overwrite existing files.**
Before installing each file:
1. Check if the destination file already exists
2. If it does NOT exist → install it
3. If it DOES exist → ask the user what to do:
- **Skip**: Keep their existing file unchanged
- **Overwrite**: Replace with the new version
- **Merge**: Intelligently combine both versions, preserving user customizations while adding new content
This is especially important for ~/.claude/CLAUDE.md which contains personal workflow preferences. Never overwrite without explicit user consent.
Create directories as needed, fetch files with curl, and make hook scripts executable.
Restart Claude Code or begin a new session so the installed configuration takes effect.
Optionally verify the installation by asking Claude Code: “What skills/agents are available?”
Installs: The complete claude-code-config repository cloned as the ~/.claude configuration directory; this includes all repository skills, not only the bounded skillPaths selection shown here. · Claude Code
Before you start
Git
Run this command in a terminal to clone the complete configuration repository into ~/.claude.
Installs: The documented selective procedure clones the complete repository to /tmp/claude-config and copies its rules, complete skills bundle, and agents into the corresponding ~/.claude directories. · Claude Code
Before you start
Git
Run this complete code block in a terminal. It clones the repository to /tmp/claude-config and then copies the documented rules, skills, and agents into ~/.claude.
# Clone elsewhere first
git clone https://github.com/jarrodwatts/claude-code-config.git /tmp/claude-config
# Copy what you need
cp -r /tmp/claude-config/rules/* ~/.claude/rules/
cp -r /tmp/claude-config/skills/* ~/.claude/skills/
cp -r /tmp/claude-config/agents/* ~/.claude/agents/
The working directory where task_plan.md should be created
Use the planning-with-files skill to create a task_plan.md for [brief project or task] in [working directory]. Define the goal, a short set of phases with checkboxes, key questions, and the current status. For this first result, create only the plan; do not begin executing the project.
Path to a React component containing useEffect code
Use the react-useeffect skill to review [React component file] for one small first result. For each useEffect, state whether it is justified for external-system synchronization, a subscription, display-triggered analytics or logging, or data fetching. Suggest a documented alternative only when the effect is instead transforming data for rendering, handling a user event, deriving state, or chaining state updates. Flag any data-fetching effect that lacks proper cleanup. Do not edit the file.
Path to a React component or Next.js page to review
Use the vercel-react-best-practices skill to review [React or Next.js file] for a quick first result. Limit the review to the two CRITICAL categories: eliminating waterfalls and bundle-size optimization. Report the applicable issues and suggested changes without editing the file.
Claude