spex-frontend

Community

Build accessible, typed, tested web UI.

Authorjohangm90
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill automates the creation and maintenance of web user interfaces, ensuring they are accessible, well-typed, and thoroughly tested.

Core Features & Use Cases

  • Stack Identification: Automatically detects and configures the project's frontend stack (React/Next.js, Vue/Nuxt, SvelteKit).
  • State Management: Implements robust state management using recommended libraries like Zustand or Pinia.
  • Form Handling: Integrates form handling with schema validation using React Hook Form + Zod or VeeValidate + Zod.
  • Accessibility & Testing: Enforces accessibility best practices and writes unit and E2E tests.
  • Offline Support: Implements offline-first patterns for resilient user experiences.
  • Use Case: Implement the entire user interface for a new e-commerce product listing page, including product details, image gallery, add-to-cart functionality, and user reviews, ensuring it's responsive and accessible.

Quick Start

Implement the frontend for the user authentication flow using React and Next.js.

Dependency Matrix

Required Modules

None required

Components

references

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: spex-frontend
Download link: https://github.com/johangm90/spex/archive/main.zip#spex-frontend

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.