modern-web-app-architecture
CommunityArchitect modern web apps efficiently.
Authorratacat
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This Skill provides comprehensive guidance for designing and building modern web applications (SPA/SSR/SSG/ISR/RSC). It helps teams navigate architecture trade-offs, define state and data patterns, optimize performance, establish testing and delivery practices, and scale teams effectively.
Core Features & Use Cases
- Trade-off driven architecture: Guides per-route rendering strategy decisions (CSR/SSR/SSG/ISR/RSC) and defines stable interfaces and boundaries.
- State & data planning: Helps plan local, shared, global, server, and URL state, including caching and invalidation strategies.
- Non-functional planning: Provides guidance on performance budgets, accessibility, security, observability, and delivery practices to ship resilient apps.
- Reference patterns: Offers curated references on architecture decisions, patterns, and modularization to accelerate work.
Quick Start
- Clarify your app’s routing and rendering needs, then assign a rendering strategy per route.
- Create architecture decisions (ADRs) for major choices like SSR vs CSR per boundary and data fetching approaches.
- Produce artifacts (structure, ADRs, checklists) to guide implementation and align team ownership.
Dependency Matrix
Required Modules
None requiredComponents
references
💻 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: modern-web-app-architecture Download link: https://github.com/ratacat/claude-skills/archive/main.zip#modern-web-app-architecture 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.