modern-web-architect
CommunityBuild flawless, performant web apps.
Authorntuan2502
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This Skill streamlines the creation of modern, high-performance web applications by providing best practices and patterns for frontend architecture, React, and Next.js development.
Core Features & Use Cases
- Architecture & Feasibility: Calculates the Frontend Feasibility & Complexity Index (FFCI) to ensure architectural soundness.
- Modern Framework Patterns: Implements the latest patterns for React 19 and Next.js 15, including App Router, Server Components, and Suspense.
- High-Craft UI Design: Guides the creation of visually stunning and intentional user interfaces with a Design Feasibility & Impact Index (DFII).
- Performance Optimization: Focuses on Vercel performance, Turborepo, code splitting, and Core Web Vitals.
- Use Case: Develop a new e-commerce platform using Next.js 15, ensuring optimal performance, a unique UI aesthetic, and robust state management.
Quick Start
Use the modern-web-architect skill to evaluate the FFCI for a new Next.js project.
Dependency Matrix
Required Modules
zodvalibottanstack-queryzustandframer-motion
Components
scriptsreferences
💻 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-architect Download link: https://github.com/ntuan2502/piggy/archive/main.zip#modern-web-architect 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 223,000+ vetted skills library on demand.