frontend-principles
CommunityFrontend architecture guidelines for robust UIs.
Software Engineering#ui#architecture#accessibility#frontend#patterns#state-management#api-integration
AuthorRogerioSobrinho
Version1.0.0
Installs0
System Documentation
What problem does it solve?
Clarifies frontend architecture to prevent tangled UI code by enforcing separation of concerns and well-defined layering.
Core Features & Use Cases
- Clean Architecture for Frontend: separation into Presentation, State/Application, Domain, Data layers with dependency rule.
- Smart / Dumb Component Split: rules and patterns.
- State Management Decision: when to lift state, and when to use feature/global stores.
- API Integration Pattern: guidelines for repositories, services, HTTP clients, and error handling.
- Authentication Flow: token storage, refresh, logout flows.
- Loading & Error States: consistent async state handling.
- Accessibility Baseline and Performance Baseline.
Quick Start
Apply these frontend principles to initialize a new project by aligning architecture, components, and API patterns with the guidelines.
Dependency Matrix
Required Modules
None requiredComponents
Standard package💻 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-principles Download link: https://github.com/RogerioSobrinho/codeme-copilot/archive/main.zip#frontend-principles Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.