frontend-dev

xari-plugins

Opinionated Claude Code plugins for full-stack engineering workflows. 13 plugins, 38 skills, 5 sub-agents, and 4 stack profiles.

Install

From GitHub (marketplace)

claude plugin marketplace add SilviaAre95/xari-plugins

Then install individual plugins:

claude plugin install shared@xari-plugins
claude plugin install architect@xari-plugins
claude plugin install backend-dev@xari-plugins
claude plugin install frontend-dev@xari-plugins
claude plugin install test-builder@xari-plugins
claude plugin install qa@xari-plugins
claude plugin install data-engineer@xari-plugins
claude plugin install devops@xari-plugins
claude plugin install security@xari-plugins
claude plugin install ui-designer@xari-plugins
claude plugin install ux-researcher@xari-plugins
claude plugin install tech-writer@xari-plugins
claude plugin install pm@xari-plugins

Local development

git clone https://github.com/SilviaAre95/xari-plugins.git
cd xari-plugins

# Load a single plugin
claude --plugin-dir ./plugins/architect

# Load multiple plugins
claude --plugin-dir ./plugins/shared --plugin-dir ./plugins/architect --plugin-dir ./plugins/backend-dev

Plugins

shared

Coding conventions, meta-skills, and stack profiles.

Skill	Description
/conventions	Apply xari coding style — TypeScript-first, minimal abstractions, conventional commits
/create-skill	Generate a new SKILL.md with proper frontmatter and structure

Stack profiles (auto-loaded based on project files):

• nextjs-vercel — Next.js App Router + Vercel deployment conventions
• python-gcp — FastAPI/Flask + GCP (Cloud Run, BigQuery, Pub/Sub)
• terraform — IaC module structure, state management, provider conventions
• generic — Language-agnostic fallback conventions

architect

System design and architecture decisions. Includes design-reviewer and security-reviewer sub-agents.

Skill	Description
/system-design	Design system architecture — components, data flow, infra
/tradeoff-analysis	Compare options with structured pros/cons/recommendation
/adr-writer	Generate Architecture Decision Records

backend-dev

API and database development patterns.

Skill	Description
/api-design	Design REST/GraphQL endpoints with schemas and validation
/db-schema	Design or review Prisma database schemas
/error-handling	Implement structured error handling patterns

frontend-dev

React/Next.js component development and review.

Skill	Description
/component-builder	Scaffold React components with types, a11y, and Tailwind
/styling-review	Review Tailwind usage, design consistency, and patterns
/accessibility-check	WCAG 2.1 AA audit — semantic HTML, ARIA, keyboard, contrast

test-builder

Test generation across all layers.

Skill	Description
/unit-tests	Generate isolated unit tests with edge cases and mocks
/integration-tests	Generate integration tests with real database
/e2e-tests	Generate Playwright/Cypress end-to-end tests

qa

Quality assurance and regression analysis. Includes regression-scanner sub-agent.

Skill	Description
/edge-case-finder	Identify edge cases, boundary conditions, and failure modes
/bug-review	Analyze bug reports, find root causes, verify fixes
/regression-check	Trace code changes for potential regressions

data-engineer

Data pipeline and SQL workflows.

Skill	Description
/pipeline-design	Design ETL/ELT pipelines with monitoring and error handling
/schema-review	Review schemas for normalization, indexes, naming
/sql-optimizer	Analyze and optimize SQL queries

ui-designer

Layout, design systems, and responsive behavior.

Skill	Description
/layout-review	Review visual hierarchy, spacing, alignment, responsiveness
/design-system	Audit, scaffold, or extend a Tailwind design system
/responsive-audit	Audit responsive behavior across breakpoints

ux-researcher

Usability evaluation and user experience analysis.

Skill	Description
/heuristic-eval	Nielsen's 10 heuristics evaluation with severity ratings
/user-flow-analysis	Map user flows, identify friction and drop-off risks
/accessibility-audit	UX-focused a11y audit beyond compliance checklists

devops

Infrastructure, containers, and CI/CD. Includes deploy-checker sub-agent.

Skill	Description
/dockerfile	Generate or review multi-stage Dockerfiles
/ci-pipeline	Generate CI/CD configs (GitHub Actions, Railway, Vercel)
/infra-review	Review Docker, CI, deploy, env vars, production readiness

security