Claude Code Plugins

Community-maintained marketplace

Feedback

frontend-standards

@ms2sato/agent-console
2
0

React patterns and frontend best practices for this project. Use when implementing React components, hooks, routes, styling, or client-side logic in packages/client.

Install Skill

1Download skill
2Enable skills in Claude

Open claude.ai/settings/capabilities and find the "Skills" section

3Upload to Claude

Click "Upload skill" and select the downloaded ZIP file

Note: Please verify skill by going through its instructions before using it.

SKILL.md

name frontend-standards
description React patterns and frontend best practices for this project. Use when implementing React components, hooks, routes, styling, or client-side logic in packages/client.

Frontend Standards

Key Principles

  • Avoid useEffect - Use TanStack Query, useSyncExternalStore, or event handlers instead
  • Prefer Suspense - For loading states and async boundaries
  • useSyncExternalStore - For external state subscriptions (WebSocket, global stores)
  • Server is the source of truth - Don't maintain conflicting client state

Tech Stack

  • React 18, TanStack Router, TanStack Query, Tailwind CSS, xterm.js, Valibot

Detailed Documentation