frontend-change-builder

Community

Ship accessible, secure frontend changes.

Authormachenjie
Version1.0.0
Installs0

System Documentation

What problem does it solve?

It solves the problem of shipping frontend changes that work in the real world: correct state handling, accessible interactions, secure rendering, and resilient API error UX—rather than breaking on edge cases after handoff.

Core Features & Use Cases

  • Cross-boundary UI implementation guidance: design component, routing, state, forms, and interaction flows so they behave correctly across success, empty, loading, error, disabled, validation, and permission-denied states.
  • Security and correctness guardrails: prevent XSS (avoid unsafe HTML injection), handle auth/session safety, and ensure client-side changes reflect server-enforced authorization.
  • Performance and regression readiness: enforce Core Web Vitals-aware structure such as code splitting for route-critical modules and require evidence via appropriate tests or manual artifacts.

Quick Start

Use frontend-change-builder to plan and review an upcoming UI change by describing the screen/route, the state it touches, the related API calls and error cases, and the interactive elements that must meet WCAG 2.1 AA.

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: frontend-change-builder
Download link: https://github.com/machenjie/rd-skills/archive/main.zip#frontend-change-builder

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 471,000+ vetted skills library on demand.