SkillsAdd

smithery.ai

frontend-guidelines

Frontend coding conventions for this repo.

First seen Apr 2, 2026

Installation

$ npx skills add https://smithery.ai
View on skills.sh ↗ Website ↗

Summary

  • Frontend coding conventions for this repo.
  • Use when creating or organizing Next.js App Router features, deciding where to place React components, or structuring shared UI/utilities in frontend/.
  • Applies to collocating page-specific components under app route folders and placing shared pieces under src/.

Similar popular skills

Related neighbors and high-traction skills in the same topics — useful to compare before installing.

vercel-react-best-practices Shared topics
vercel-labs/agent-skills 697.8K installs
azure-hosted-copilot-sdk Shared topics
microsoft/azure-skills 440.4K installs
vercel-composition-patterns Shared topics
vercel-labs/agent-skills 326.5K installs
supabase Shared topics
supabase/agent-skills

Use when doing ANY task involving Supabase. Triggers: Supabase products (Database, Auth, Edge F…

263K installs
prisma-compute Shared topics
prisma/skills

Prisma Compute deployment and hosting guide. Use whenever the user mentions Prisma Compute, `pr…

253.4K installs
vercel-react-native-skills Shared topics
vercel-labs/agent-skills 205.5K installs

Also in this package

Other skills from smithery.ai · top by installs.

npx skills add https://smithery.ai
smithery-ai-cli 7.8K frontend-design 6.2K skill-creator 2.5K ck:ui-ux-pro-max 1.3K pdf 1.2K xlsx 966 pptx 894 docx 884 webapp-testing 1 web-design-reviewer 657

Browse all from smithery.ai

More details

Agent compatibility

Declared targets from SKILL.md / docs. Unmarked agents are not listed — the skill may still install via the CLI.

Claude Code Not declared
Cursor Not declared
Codex Not declared
GitHub Copilot Not declared
Windsurf Not declared
Gemini CLI Not declared
Cline Not declared
OpenCode Not declared

Package contents

Files included with this skill beyond the listing page.

  • skill md SKILL.md 1,201 B
  • docs SUMMARY.md 331 B

History

  1. First seen on skills.sh
  2. First recorded snapshot · 1 installs

SKILL.md

Frontend Guidelines

Placement rules

  • Collocate page-specific components: create a _components/ folder inside the App Router page directory (the same directory as the page.tsx, layout.tsx, etc.) and place components used only by that page there.
  • Keep shared components and utilities under frontend/src/ following the existing architecture (src/ui/, src/shared/, src/theme/, etc.).
  • Prefer shared placement when a component is reused across routes, layouts, or features.

Examples

  • frontend/app/dashboard/_components/StatsCard.tsx for a dashboard-only component.
  • frontend/src/ui/Button.tsx for a reusable button.

Notes

  • Follow existing naming conventions (PascalCase components, useX hooks) and lint/format rules.
  • When unsure about reuse, start collocated; promote to src/ when a second usage appears.