본문으로 건너뛰기
cccskills
무료GitHub에 공개

codebase-summarizer

Scans repository structure and generates comprehensive architecture documentation including system overview, entry points, module relationships, data flow diagrams, and "edit here for X" guides. Creates ARCHITECTURE.md for onboarding and navigation. Use when users request "document the codebase", "explain the architecture", "create onboarding docs", or "map the system".

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

설치 방법 보기

포함된 파일(1)

  • SKILL.md9.3 KB

SKILL.md(원문)

설치하기 전에 에이전트에게 전달되는 지시 내용을 확인할 수 있습니다.

Codebase Summarizer

Generate comprehensive architecture documentation from repository analysis.

Core Workflow

  1. Scan structure: Recursively analyze folder tree and file organization
  2. Identify patterns: Detect framework, architecture style, key directories
  3. Map entry points: Find main files, routes, APIs, CLI commands
  4. Trace data flow: Follow requests through layers (controllers → services → models)
  5. Document modules: Explain purpose and responsibilities of each directory
  6. Create navigation: Build "how to" guides for common tasks
  7. Generate diagrams: Add Mermaid diagrams for visual architecture

Documentation Structure

ARCHITECTURE.md Template

# Architecture Overview

## System Summary

[Project Name] is a [type] application built with [stack]. It follows [architecture pattern] and handles [primary use cases].

**Tech Stack:**

- Frontend: [framework + key libraries]
- Backend: [framework + key libraries]
- Database: [database + ORM]
- Infrastructure: [hosting + CI/CD]

## High-Level Architecture

```mermaid
graph TB
    Client[Client/Browser] --> API[API Layer]
    API --> Services[Business Logic]
    Services --> DB[(Database)]
    Services --> Cache[(Redis Cache)]
    API --> Queue[Message Queue]
```

Project Structure

src/
├── app/              # Application entry point and routing
├── components/       # Reusable UI components
├── lib/              # Utility functions and helpers
├── services/         # Business logic layer
├── models/           # Data models and schemas
└── types/            # TypeScript type definitions

Key Components

Entry Points

Main Application: src/app/page.tsx

  • Application entry point
  • Initializes providers and routing
  • Handles global error boundaries

API Routes: src/app/api/

  • RESTful API endpoints
  • Authentication middleware
  • Request validation

Core Modules

Authentication (src/services/auth/)

  • User login and registration
  • JWT token management
  • OAuth2 integration
  • Dependencies: bcrypt, jsonwebtoken

User Management (src/services/users/)

  • CRUD operations for users
  • Profile management
  • Role-based access control
  • Dependencies: Prisma, validation libraries

Data Layer (src/models/)

  • Database schemas
  • Prisma models
  • Query builders
  • Dependencies: Prisma Client

Data Flow

User Registration Flow

sequenceDiagram
    Client->>API: POST /api/auth/register
    API->>Validation: Validate input
    Validation->>Services: UserService.create()
    Services->>Database: Insert user
    Database-->>Services: User created
    Services->>Email: Send welcome email
    Services-->>API: Return JWT
    API-->>Client: 201 Created

Request Lifecycle

  1. Request arrives → API route handler (src/app/api/[endpoint]/route.ts)
  2. Middleware → Auth, validation, rate limiting
  3. Service layer → Business logic (src/services/)
  4. Data layer → Database queries (src/models/)
  5. Response → Format and return data

Common Patterns

Service Pattern

// src/services/users/user.service.ts
export class UserService {
  async findById(id: string) {
    return prisma.user.findUnique({ where: { id } });
  }

  async create(data: CreateUserDto) {
    // Validation, business logic, database operations
  }
}

Repository Pattern

// src/repositories/user.repository.ts
export class UserRepository {
  async findAll() {
    /* DB queries only */
  }
  async findById(id: string) {
    /* DB queries only */
  }
}

How To Guides

Add a New API Endpoint

  1. Create route file: src/app/api/[name]/route.ts

    export async function GET(req: Request) {
      // Implementation
    }
    
  2. Add service logic: src/services/[name].service.ts

  3. Define types: src/types/[name].ts

  4. Add tests: src/app/api/[name]/route.test.ts

  5. Update API docs: Document in OpenAPI/Swagger

Add a New Database Model

  1. Update schema: prisma/schema.prisma

    model NewModel {
      id String @id @default(cuid())
      // fields
    }
    
  2. Run migration: npx prisma migrate dev --name add-new-model

  3. Generate types: npx prisma generate

  4. Create service: src/services/new-model.service.ts

  5. Add CRUD routes: src/app/api/new-model/

Add a New React Component

  1. Create component: src/components/NewComponent/NewComponent.tsx
  2. Add styles: NewComponent.module.css or inline Tailwind
  3. Write tests: NewComponent.test.tsx
  4. Add stories: NewComponent.stories.tsx (if using Storybook)
  5. Export: Update src/components/index.ts

Modify Authentication

  1. Service layer: src/services/auth/auth.service.ts
  2. Middleware: src/middleware/auth.middleware.ts
  3. Routes: src/app/api/auth/
  4. Update tests: Ensure auth flows still work

Key Files Reference

FilePurposeModify For
src/app/layout.tsxRoot layout, providersGlobal layout changes
src/lib/db.tsDatabase connectionConnection config
src/lib/api.tsAPI client setupRequest interceptors
src/middleware.tsNext.js middlewareAuth, redirects
prisma/schema.prismaDatabase schemaData model changes
.env.exampleEnvironment varsAdding config values

Dependencies

Critical Dependencies

  • next - React framework
  • prisma - ORM and database toolkit
  • react - UI library
  • typescript - Type safety

Key Libraries

  • zod - Schema validation
  • bcrypt - Password hashing
  • jsonwebtoken - JWT handling
  • date-fns - Date utilities

Development Workflow

  1. Local setup: See DEVELOPMENT.md
  2. Making changes: Branch → Implement → Test → PR
  3. Running tests: pnpm test
  4. Database changes: Prisma migrate workflow
  5. Deployment: Vercel automatic deployment

Troubleshooting

Database connection errors

  • Check DATABASE_URL in .env
  • Ensure database is running
  • Run npx prisma generate

Type errors after schema changes

  • Run npx prisma generate
  • Restart TypeScript server

Build fails

  • Clear .next folder: rm -rf .next
  • Clear node_modules: rm -rf node_modules && pnpm install

Additional Resources


## Analysis Techniques

### Identify Framework
Look for telltale files:
- `next.config.js` → Next.js
- `vite.config.ts` → Vite
- `nest-cli.json` → NestJS
- `manage.py` → Django
- `Cargo.toml` → Rust

### Map Entry Points
- Frontend: `index.html`, `main.tsx`, `app.tsx`, `_app.tsx`
- Backend: `main.ts`, `server.ts`, `app.py`, `index.js`
- CLI: `cli.ts`, `__main__.py`, `main.go`

### Trace Request Flow
Follow typical paths:
1. Route/endpoint definition
2. Middleware/guards
3. Controller/handler
4. Service/business logic
5. Repository/model
6. Database query

### Module Categories
- **Core**: Essential business logic
- **Infrastructure**: Database, cache, queue
- **Utilities**: Helpers, formatters, validators
- **Features**: User-facing functionality
- **Config**: Environment, settings

## Mermaid Diagrams

### Architecture Diagram
```mermaid
graph LR
    Client --> NextJS
    NextJS --> API
    API --> Services
    Services --> Prisma
    Prisma --> PostgreSQL

Data Flow

sequenceDiagram
    participant Client
    participant API
    participant Service
    participant DB
    Client->>API: Request
    API->>Service: Process
    Service->>DB: Query
    DB-->>Service: Data
    Service-->>API: Result
    API-->>Client: Response

Module Relationships

graph TB
    API[API Layer] --> Auth[Auth Service]
    API --> Users[User Service]
    Auth --> DB[(Database)]
    Users --> DB
    Users --> Cache[(Cache)]

Best Practices

  1. Start high-level: Overview before details
  2. Visual first: Use diagrams for complex flows
  3. Be specific: Reference actual file paths
  4. Show examples: Include code snippets
  5. Link related docs: Reference other documentation
  6. Keep updated: Update as architecture evolves
  7. Developer-focused: Write for onboarding and daily use

Output Checklist

Every codebase summary should include:

  • System overview and tech stack
  • High-level architecture diagram
  • Project structure explanation
  • Entry points identification
  • Module/directory purposes
  • Data flow diagrams
  • Common patterns documented
  • "How to" guides for common tasks
  • Key files reference table
  • Dependencies explanation
  • Troubleshooting section

리뷰

아직 리뷰가 없습니다. 사용해 본 소감을 남겨 주세요.

댓글

로그인 없이 쓸 수 있습니다. 사용 후기, 질문, 작동하지 않은 환경 등을 편하게 남겨 주세요.

아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.

보내면 바로 공개됩니다. 이메일 주소나 전화번호 같은 개인 정보는 쓰지 마세요. URL은 2개까지입니다.

0 / 1,000자

이 양식은 reCAPTCHA로 보호되며 Google 개인정보처리방침 및 서비스 약관이 적용됩니다.

같은 저장소의 스킬

Audits and implements web accessibility (a11y) following WCAG 2.1 guidelines with ARIA patterns, keyboard navigation, screen reader support, and contrast checking. Use when users request "accessibility audit", "a11y review", "WCAG compliance", "screen reader support", or "keyboard navigation".

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

sathishssj3/Stereix-Engine22026년 10월 4일 업데이트

Creates Architecture Decision Records documenting key technical decisions with context, alternatives considered, tradeoffs, consequences, and decision owners. Use when documenting "architecture decisions", "technical choices", "design decisions", or "ADRs".

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

sathishssj3/Stereix-Engine22026년 10월 4일 업데이트

Designs multi-step agent workflows with tool usage, retry logic, state management, and budget controls. Provides orchestration diagrams, tool execution order, fallback strategies, and cost limits. Use for "AI agents", "agentic workflows", "multi-step AI", or "autonomous systems".

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

sathishssj3/Stereix-Engine22026년 10월 4일 업데이트

MUST USE when user wants to 调研/research/搜索/search/查/找/look up anything on the internet — e.g. 全网调研 X / 帮我调研一下 X / 查一下 X / 搜搜 X / 看看大家怎么评价 X / X 上有什么讨论 / research this topic。 Also MUST USE when user mentions any platform or shares any URL/链接: 小红书/xiaohongshu/xhs, Twitter/推特/X, B站/bilibili, Reddit, Facebook, Instagram, V2EX, LinkedIn/领英/招聘/求职/jobs, YouTube, GitHub code search, 小宇宙播客, 雪球/股票行情, RSS feeds, or any web URL. 15 platforms, multi-backend routing (OpenCLI / per-platform CLIs / APIs). Zero config for 6 channels. Run `agent-reach doctor --json` to see which backend serves each platform right now. NOT for: 写报告/数据分析/翻译等内容加工(本 skill 只负责从互联网获取内容); 发帖/评论/点赞等写操作;已有专门 skill 的平台(先用专门 skill)。 【路由方式】SKILL.md 包含路由表和常用命令,复杂场景需按需阅读对应分类的 references/*.md。 分类:search / social (小红书/推特/B站/V2EX/Reddit/Facebook/Instagram) / career(LinkedIn) / dev(github) / web(网页/文章/RSS) / video(YouTube/B站/播客) / finance(雪球/股票)。

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

sathishssj3/Stereix-Engine22026년 10월 4일 업데이트

Orchestrates multi-agent AI systems with task delegation, agent communication, shared memory, and workflow coordination. Use when users request "multi-agent system", "agent orchestration", "AI agents", "agent coordination", or "autonomous agents".

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

sathishssj3/Stereix-Engine22026년 10월 4일 업데이트

Creates SLO-based alerts and operational dashboards with key charts, alert thresholds, and runbook links. Use for "alerting", "dashboards", "SLO", or "monitoring".

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

sathishssj3/Stereix-Engine22026년 10월 4일 업데이트

sathishssj3의 스킬 모두 보기

이 스킬의 문제 신고