skills.rest
lyraarteltda
lyraarteltdaCOMMUNITY
Explore all skills by this author →
GitHub

frontend-development

Implement frontend patterns for state management, API integration, forms, and routing.

Updated Aug 23, 2026
Search Tags:#typescript#state management#frontend#react#api integration#ui development#ux integration
One-click install
npx skills add https://github.com/lyraarteltda/MEGA-BRAIN-JARVIS-v2 --skill frontend-development-lyraarteltda
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: frontend-development
Source: https://github.com/lyraarteltda/MEGA-BRAIN-JARVIS-v2/tree/main/.fnd/skills/frontend-development
Command: npx skills add https://github.com/lyraarteltda/MEGA-BRAIN-JARVIS-v2 --skill frontend-development-lyraarteltda

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill streamlines the process of building user interfaces by providing a structured approach to frontend development, ensuring consistency, maintainability, and integration with design standards.

Core Features & Use Cases

  • Pattern Implementation: Enforces project-specific patterns for state management, API integration, type definitions, hooks, forms, and routing.
  • UX Design Integration: Guarantees adherence to UX/UI guidelines by either following design.md specifications or leveraging the ux-design skill.
  • Use Case: Develop a new user settings page by defining types, creating a form with validation, integrating with the backend API to fetch and save data, and setting up the necessary routes, all while ensuring it matches the provided UX design specifications.

Quick Start

Use the frontend-development skill to create a new user page, ensuring it follows the defined structure and integrates with the ux-design skill.

Frequently Asked Questions about frontend-development

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I structure React state management and API integration when building a new UI?▼

To structure React state management and API integration, implement established project patterns for hooks, type definitions, and forms. This ensures maintainable frontend applications with consistent UI and adherence to UX design specifications.

What is the best way to ensure my frontend types and forms match UX design specifications?▼

The best way to ensure frontend types and forms match UX design specifications is by integrating with design documentation or the ux-design skill. This enforces UI consistency and validates structured component organization during development.

Can I use this approach to build a user settings page with TypeScript and routing?▼

Yes, you can build a TypeScript user settings page by defining types, creating validation forms, fetching API data, and setting up routes. This approach supports structured component organization and full-stack API integration.

Does frontend development require predefined design docs to maintain UI consistency?▼

Frontend development requires either predefined design.md specifications or integration with the ux-design skill to maintain UI consistency. This ensures adherence to UX guidelines and accurate design implementation across all components.

Why does my frontend application need structured component organization and validation?▼

Your frontend application needs structured component organization and validation to streamline the process of building user interfaces. This structured approach ensures maintainability, state management consistency, and reliable API integration.

Are there limitations when implementing routing and hooks without a dedicated frontend skill?▼

Without a dedicated frontend skill, implementing routing and hooks lacks enforced project-specific patterns for state management and type definitions. This can lead to inconsistent UI, poor maintainability, and disjointed API integration across components.

Related Skills

Explore More Software Engineering Skills→
allthingslinuxallthingslinux
4

designing-zod-schemas

Design Zod schemas for validation and TypeScript type inference.

Official
Intermediate
ivanyeorsivanyeors

integration

Validate frontend-backend API contracts against OpenAPI specifications.

Community
Advanced
rachel353rachel353

design

Generate a DESIGN.md document with design requirements and typography from IA structure.

Community
Intermediate
dt418dt418

Docs Pack

Build documentation platforms with versioned docs, search, navigation, code highlighting, and API reference generation.

Community
Intermediate