Does it support modern data fetching libraries?

Yes, it focuses on TanStack Query (React/Vue), SvelteKit load functions, and Angular's HttpClient with RxJS/Signals.

How does this skill improve web performance?

It enforces strict lazy loading for heavy components, promotes code splitting, and implements 'No Early Return' patterns to prevent Cumulative Layout Shift (CLS).

Is Material UI (MUI) support included?

The skill specifically includes patterns for MUI v7, including the new Grid syntax and type-safe SxProps styling.

Which frameworks does the Frontend Development skill support?

The skill provides specialized guidance for React 18+, Vue 3 (Composition API), Svelte 5 (Runes), and Angular (Signals).

Can it help with project organization?

Absolutely. It defines a standardized 'features/' vs 'components/' directory structure to keep domain logic separated from reusable UI elements.

Frontend Development & Architecture

Name: Frontend Development & Architecture
Author: samhvw8

bysamhvw8

•

디자인 도구

Implements production-grade frontend interfaces across React, Vue, Svelte, and Angular using modern performance patterns and state management.

소개

This skill equips Claude with expert-level guidance for modern frontend engineering across all major frameworks. It provides deep technical patterns for React 18+ (Suspense, TanStack), Vue 3 (Composition API, Pinia), Svelte 5 (Runes), and Angular (Signals). By enforcing strict TypeScript standards, lazy-loading strategies, and specific UI patterns like MUI v7, it ensures that generated code is scalable, performant, and follows a domain-driven file organization that minimizes layout shifts and maximizes maintainability.

주요 기능

Type-safe component development with standardized TypeScript interfaces
1 GitHub stars
Comprehensive support for React, Vue 3, Svelte 5, and Angular
Advanced state management patterns including Signals, Pinia, and TanStack Query
Modern routing implementations using TanStack Router and framework-specific kits
Strict performance optimization with lazy loading and 'No Early Returns' rules

사용 사례

Optimizing Core Web Vitals through code splitting and Suspense-driven loading states
Architecting scalable feature-based folder structures for enterprise applications
Standardizing UI components using Material UI v7 and type-safe styling patterns

소개

주요 기능

Type-safe component development with standardized TypeScript interfaces
1 GitHub stars
Comprehensive support for React, Vue 3, Svelte 5, and Angular
Advanced state management patterns including Signals, Pinia, and TanStack Query
Modern routing implementations using TanStack Router and framework-specific kits
Strict performance optimization with lazy loading and 'No Early Returns' rules

사용 사례

Optimizing Core Web Vitals through code splitting and Suspense-driven loading states
Architecting scalable feature-based folder structures for enterprise applications
Standardizing UI components using Material UI v7 and type-safe styling patterns