add-frontend-development

What problem does it solve?

This Skill provides a comprehensive, stack-agnostic framework for building robust and maintainable frontend applications, ensuring consistency and adherence to best practices across different technologies.

Core Features & Use Cases

• Architecture Guidance: Offers a clear structure for organizing frontend code, including pages, components, state management, and data fetching.
• UX Integration: Mandates adherence to UX design specifications, either from a design.md file or the ux-design skill, ensuring a user-friendly interface.
• Type Safety: Enforces strict typing by mirroring backend DTOs and using schema-based validation for forms.
• Performance Optimization: Recommends strategies like lazy loading and bundle size monitoring.
• Use Case: When developing a new feature that involves user interaction and data display, this skill guides the developer through setting up the necessary components, fetching data, managing state, and ensuring the UI aligns with design specifications.

Quick Start

Use the add-frontend-development skill to structure the frontend code for a new user profile page, ensuring it integrates with the existing design system and data fetching patterns.