Which frontend frameworks are supported?

This skill provides specific guidance and patterns for React, Vue, and Angular, including support for TypeScript (TSX) and modern hooks/composition APIs.

How does this skill handle UI testing?

It includes pre-configured validation commands for npm-based test suites and emphasizes testing user-facing behavior over implementation details.

What happens if a backend API is not yet ready?

The skill includes specialized 'Blocker Scenarios' that guide the AI to mock API responses or report the dependency issue to the orchestrator.

Does it support mobile-first development?

Yes, mobile-first responsive design is a core principle of this skill, ensuring components work across mobile, tablet, and desktop views.

Is accessibility included by default?

Accessibility is mandatory. The skill enforces the use of ARIA labels, semantic HTML, and keyboard navigation as part of its success criteria.

Frontend Implementation Expert

Name: Frontend Implementation Expert
Author: Angriff36

byAngriff36

0•

Design Tools

Implements high-quality, accessible frontend components and user interfaces using modern frameworks like React, Vue, and Angular.

The Frontend Implementation skill equips Claude with specialized knowledge for building production-grade web interfaces. It focuses on creating responsive, mobile-first designs while adhering to strict accessibility (WCAG) standards. By providing standardized patterns for component composition, state management, and API integration, this skill ensures that frontend code is not only visualy accurate but also performant and maintainable. It includes comprehensive validation protocols for testing and building, making it ideal for enterprise-level projects like the Capsule catering solution.

Key Features

01Mandatory accessibility checklist including ARIA and keyboard navigation

02Standardized component patterns for React, Vue, and Angular

03Integrated testing strategies for user-facing behavior

04Mobile-first responsive design with media query best practices

050 GitHub stars

06Robust form validation and async API integration patterns

Use Cases

01Developing complex data-driven dashboards with real-time updates

02Implementing accessible and validated enterprise form systems

03Building mobile-optimized kitchen prep and task management interfaces

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add angriff36/capsule frontend-implementation

For use in Claude.ai and ChatGPT

Download Skill