Feature Arch

Generates a concrete target architecture blueprint when you point it at a React project that's outgrowing its structure. You get a markdown doc with the full directory tree, per-feature public APIs, an import boundary matrix, and a numbered migration plan with effort estimates. It's built on 42 prioritized rules spanning directory structure, import boundaries, data fetching patterns, and component organization. The blueprint process identifies features from your routes and code, confirms them with you, then maps everything to specific rules so you're not just shuffling folders around. Good for when you know you need feature-based architecture but want a clear migration path instead of a big bang rewrite.

skills.sh installs: 423
GitHub stars: 222
last updated: Aug 21, 2026

View on GitHub

Install

$ npx -y skills add pproenca/dot-skills --skill feature-arch --agent claude-code

Installs into .claude/skills of the current project.

Files

Feature-Based Architecture Best Practices

Comprehensive architecture guide for organizing React applications by features, enabling scalable development with independent teams. Contains 43 rules across 8 categories, prioritized by impact from critical (directory structure, imports) to incremental (naming conventions). When invoked on a real project, the skill produces a project-specific blueprint that anchors every decision in those rules.

Primary Output: The Target Architecture Blueprint

When an agent invokes this skill on a real project, the deliverable is a single markdown file persisted at docs/architecture/FEATURE-ARCH-TARGET.md (or the repo's existing docs location). The blueprint contains:

SKILL.md on GitHub

Details

Repository: github.com/pproenca/dot-skills
Categories: Frontend Development, Documentation, Code Review & Quality, AI & Agent Building, Productivity & Planning
First seen: Jun 3, 2026