← ClaudeAtlas

specgen-react-muilisted

Generate a detailed specification document for building a React SPA (Single Page Application) using React 19, TypeScript 5, Vite 6, Material UI (MUI) v6, React Router v7, TanStack Query v5, Zustand v5, React Hook Form v7, and Zod v3. Authentication (Keycloak OAuth2/OIDC PKCE, generic OIDC, or none), API integration (REST via Axios), and optional features (WebSocket, i18n, MUI X Data Grid, MUI X Charts) are configurable based on user input. Standardized input: application name (mandatory), version (mandatory), module (optional). Use this skill whenever the user asks to create a spec, specification, blueprint, or technical design document for a new React SPA or frontend application. Also trigger when the user says things like "spec out a new React project", "design a React SPA", "write a technical spec for my new frontend app", "scaffold spec for a React MUI app", or any request for a specification document describing a React + MUI + TypeScript application. Even if the user only mentions a subset of the stack (
rashidee/co2-skills · ★ 3 · Web & Frontend · score 79
Install: claude install-skill rashidee/co2-skills
# React SPA Specification Generator This skill generates a comprehensive specification document (Markdown) that serves as a blueprint for building a React Single Page Application. The spec is intended to be followed by a developer or a coding agent to produce a fully functional project scaffold. The specification does NOT generate code. It produces a detailed, opinionated technical document describing every layer of the application — from Vite configuration to MUI theme to React Query patterns — so that implementation becomes a mechanical exercise. ## Technology Stack ### Core Stack (Always Included) These are the fixed versions the spec targets. Do not deviate unless the user explicitly requests different versions. | Component | Version | |----------------------|-----------| | React | 19.x | | TypeScript | 5.x | | Vite | 6.x | | Material UI (MUI) | 6.x | | MUI Icons | 6.x | | MUI System | 6.x | | React Router | 7.x | | TanStack Query | 5.x | | Zustand | 5.x | | React Hook Form | 7.x | | Zod | 3.x | | Axios | 1.x | | Node.js | 22.x LTS | ### Optional Integration Versions Include in the version table only when the corresponding integration is selected. | Component | Version | When Selected | |----------------------|----