frontend-principles

Community

Frontend architecture guidelines for robust UIs.

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 required

Components

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.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.