skills.rest
hiro0218
hiro0218COMMUNITY
Explore all skills by this author →
Website𝕏@hiro0218GitHub

architecture-review

Analyze Next.js project architectures for layer dependency and zero-margin compliance.

8|1|Updated Dec 28, 2018
Search Tags:#architecture#dependencies#Next.js#review#static-analysis#layering
One-click install
npx skills add https://github.com/hiro0218/b.0218.jp --skill architecture-review-hiro0218
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: architecture-review
Source: https://github.com/hiro0218/b.0218.jp/tree/main/.claude/skills/architecture-review
Command: npx skills add https://github.com/hiro0218/b.0218.jp --skill architecture-review-hiro0218

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill automatically reviews a Next.js project's architecture for compliance with layered architecture rules, component placement, and the zero-margin principle, helping code reviews catch architectural issues early and reduce later rework.

Core Features & Use Cases

  • Layer dependencies validation: Enforces App → Page → UI/Functional boundaries.
  • Component placement & naming: Verifies correct directory structure and file placement.
  • Zero-margin principle check: Ensures UI components do not introduce self-managed margins; spacing controlled by parents.
  • Static review guidance: Provides decision criteria for Server/Client Components, imports, and TypeScript quality.
  • Use Case: Run during PR reviews to surface architecture violations in Next.js apps.

Quick Start

Run the skill against codebase files such as src/app/layout.tsx, src/pages/_app.tsx, and src/components/UI/Button/Button.tsx to validate architecture conformance.

Frequently Asked Questions about architecture-review

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I validate Next.js architecture compliance for layered dependencies?▼

Architecture review validates Next.js projects against layered dependency rules, enforcing App → Page → UI/Functional layer boundaries and identifying import violations that cross architectural layers during code reviews.

What is the zero-margin principle in Next.js component architecture?▼

The zero-margin principle ensures UI components do not apply self-managed margins; spacing is controlled by parent components only, preventing cascading layout issues and maintaining predictable component spacing behavior.

Can I automatically check Server and Client component usage in Next.js?▼

Yes, architecture review analyzes Server/Client component placement, verifies correct usage patterns, and provides decision criteria to ensure components are designated appropriately within your layered structure.

How do I catch component placement and naming violations in Next.js projects?▼

Run the review against your codebase files to verify correct directory structure, file naming conventions, and component placement across App, Page, UI, and Functional layers, surfacing violations during pull requests.

When should I run architecture reviews on my Next.js codebase?▼

Run reviews during PR reviews or when creating new components to catch architectural issues early, validate TypeScript typings, and ensure cross-layer import rules are enforced before code merges.

What TypeScript quality issues does architecture review identify?▼

The review enforces explicit TypeScript typings across layers, identifies gaps in type coverage, and ensures technical requirements are met to maintain type safety and reduce runtime errors in Next.js applications.

Related Skills

Explore More Software Engineering Skills→
Siamese001Siamese001

layer-boundary-guard

Analyzes AST dependency graphs to enforce import gravity rules across agentic_core and application layers.

Community
Advanced
addxaiaddxai
42

security-compliance-review

Detects secret leaks, PII exposure, and compliance violations in code, configuration, and documentation.

Official
Advanced
pax-kpax-k
3

architecture-boundary-enforcer

Enforce and document architecture boundaries using dependency-cruiser, ESLint, import-linter, and custom scripts.

Community
Advanced
aaronbassettaaronbassett

code-review

Run automated linting, complexity, and code smell analysis on codebases.

Community
Advanced