Summary
This is a comprehensive style guide for teams building React apps with TanStack Query and Router. It pushes hard on Suspense-based patterns with useSuspenseQuery instead of manual loading states, lazy loading for code splitting, and a features-based directory structure that keeps domain logic organized. The rule against early returns for loading spinners is opinionated but solves real layout shift problems. You get checklists for new components and features, import alias references, and full examples covering forms, DataGrid wrappers, and API service layers. Best used as a reference when onboarding developers or establishing consistency across a codebase that's already committed to this modern React stack.
Install to Claude Code
npx -y skills add davila7/claude-code-templates --skill frontend-dev-guidelines --agent claude-codeInstalls into .claude/skills of the current project.
Keep your Mac awake while Claude Code and 40+ AI agents run. Sleeps when they're idle.
One time payment $9 →
Integrate web data into your AI product. One API to scrape website & brand data.
Get API Key Now →
Agent, run crypto. Access onchain data & trade routes via 1inch.
Install now →
On Capafy, your Skill runs online 24/7 as an agent product, and you get paid every time someone uses it.
Start earning →
Files
SKILL.md
Select a file.
Featured
Keep your Mac awake while Claude Code and 40+ AI agents run. Sleeps when they're idle.
One time payment $9 →Integrate web data into your AI product. One API to scrape website & brand data.
Get API Key Now →Agent, run crypto. Access onchain data & trade routes via 1inch.
Install now →On Capafy, your Skill runs online 24/7 as an agent product, and you get paid every time someone uses it.
Start earning →
