К основному содержанию
скилл CX Codex

codebase-summarizer — скилл для Claude Code: архитектура

Скилл сканирует репозиторий и собирает ARCHITECTURE.md: точки входа, связи модулей, диаграммы и подсказки, куда лезть за правкой.

Установить в Claude Code · Через Skills CLI (Vercel) Все способы и платформы ↓
npx skills add patricio0312rev/skills --skill codebase-summarizer -a claude-code
Открыть на GitHub

Что делает codebase-summarizer

Скилл проходит по дереву папок рекурсивно, определяет фреймворк и стиль архитектуры, находит главные файлы, маршруты, API и CLI-команды. Дальше он прослеживает путь запроса по слоям — от контроллеров через сервисы к моделям — и описывает назначение каждой директории.

На выходе получается ARCHITECTURE.md с готовой структурой: сводка по системе и стеку, схема верхнего уровня на Mermaid, дерево проекта, разбор ключевых модулей и таблица «файл — назначение — что в нём менять». Отдельный блок — how-to для типовых задач: добавить эндпоинт, добавить модель Prisma, добавить React-компонент, поправить аутентификацию. Примеры в шаблоне привязаны к стеку Next.js, Prisma и TypeScript, поэтому на другом фреймворке разделы придётся переписывать под себя.

Скилл работает по файлам репозитория и не запускает ваш код, так что для генерации достаточно открытого проекта. Установка идёт через npx skills add с флагом под конкретную платформу.

Какие задачи решает

  • объяснить новому разработчику, как устроен проект
  • найти точки входа и маршруты в незнакомом репозитории
  • описать связи модулей и путь запроса по слоям
  • собрать how-to по типовым правкам в одном файле
  • нарисовать схему архитектуры для документации

Примеры запросов агенту

  • Задокументируй кодовую базу и создай ARCHITECTURE.md
  • Объясни архитектуру проекта и нарисуй схему модулей
  • Сделай онбординг-документ: точки входа, слои, куда вносить правки

Как установить codebase-summarizer

1Через Skills CLI (Vercel)

npx skills add patricio0312rev/skills --skill codebase-summarizer -a claude-code

2Вручную: положить файлы

~/.claude/skills/codebase-summarizer/SKILL.md

Папка скилла целиком; для одного проекта — .claude/skills/codebase-summarizer/

По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов

Вопросы о codebase-summarizer

Как установить codebase-summarizer в Claude?

Выполните npx skills add patricio0312rev/skills --skill codebase-summarizer -a claude-code. Скилл окажется в ~/.claude/skills/codebase-summarizer/SKILL.md.

Что делает codebase-summarizer?

Сканирует структуру репозитория и генерирует ARCHITECTURE.md: сводку по системе, точки входа, связи модулей, диаграммы потоков данных и подсказки, какой файл править под конкретную задачу.

С какими платформами он совместим?

Claude, Codex, Cursor, GitHub Copilot, Gemini CLI и OpenCode. Для каждой платформы в репозитории есть своя команда установки.

Исходный текст

SKILL.md · MIT
---
name: codebase-summarizer
description: 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".
---

# 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

````markdown
# 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

```mermaid
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

```typescript
// 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

```typescript
// 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`

   ```typescript
   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`

   ```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

| File                   | Purpose                | Modify For            |
| ---------------------- | ---------------------- | --------------------- |
| `src/app/layout.tsx`   | Root layout, providers | Global layout changes |
| `src/lib/db.ts`        | Database connection    | Connection config     |
| `src/lib/api.ts`       | API client setup       | Request interceptors  |
| `src/middleware.ts`    | Next.js middleware     | Auth, redirects       |
| `prisma/schema.prisma` | Database schema        | Data model changes    |
| `.env.example`         | Environment vars       | Adding 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](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

- [API Documentation](./API.md) - Endpoint reference
- [Development Guide](./DEVELOPMENT.md) - Setup and workflow
- [Contributing Guide](./CONTRIBUTING.md) - Code standards
- [Database Schema](./DATABASE.md) - Data model details

````

## 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

```mermaid
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

```mermaid
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

© patricio0312rev · MIT · patricio0312rev/skills

Похожие скиллы

Всё по теме «Тексты и документация» →
codebase-documenter mhattingpete Разбирает незнакомый репозиторий и пишет по нему документацию: архитектура, компоненты, поток данных, гайд по разработке. Пригодится при онбординге и передаче проекта. CX Codex +1 587установок describe-design Garrick Aden-Buie (@gadenbuie) Скилл исследует кодовую базу и пишет markdown-документ о том, как устроена фича или система. Пригодится для онбординга и передачи знаний. CX Codex +1 785установок codebase-onboarding spencerpauly Запускает пять субагентов параллельно, чтобы разобрать архитектуру, модели данных, API, авторизацию и деплой, и собирает из этого документ онбординга. CX Codex +1 476установок acquire-codebase-knowledge официальный github Скилл разбирает существующий репозиторий и собирает документы о его структуре, архитектуре, тестах и рисках. Подходит для знакомства с новым проектом. 2 200установок research parcadei Исследует кодовую базу и описывает текущую архитектуру без критики и рефакторинга. Запускает субагентов для анализа файлов и сохраняет отчёт в каталог thoughts. CX Codex +1 485установок mermaid-diagrams davila7 Скилл учит агента писать диаграммы Mermaid: классы, последовательности, ERD, C4, флоучарты. Пригодится, когда нужно задокументировать архитектуру или схему БД. 1 180установок

Из того же набора26

animation-micro-interaction-pack Набор готовых паттернов движения для интерфейса: ховеры, входы и выходы элементов, отклик на жесты. Пригодится, когда UI выглядит статично и хочется оживить его без ручного подбора таймингов. CX Codex +1 499установок explaining-code Разбирает незнакомый код по шагам: аналогия из быта, ASCII-схема потока, потом построчный разбор. Пригодится, когда чужой проект надо понять быстро. CX Codex +1 473установок conventional-commits Скилл пишет коммиты по спецификации Conventional Commits: тип, область, тело и футеры. Пригодится, когда нужен автоматический версионинг и changelog. CX Codex +1 469установок nginx-config-optimizer Скилл собирает конфиги Nginx: reverse proxy, балансировка, кэш, SSL и лимиты запросов. Пригодится, когда нужно поднять или переписать конфиг сервера. CX Codex +1 433установок redis-patterns Скилл для ИИ-агента, который помогает писать код на Redis: кэширование, сессии, лимиты запросов, pub/sub и распределённые блокировки. CX Codex +1 361установок accessibility-auditor Скилл проверяет вёрстку на доступность и правит её: семантика, ARIA, клавиатура, контраст. Пригодится перед релизом формы или модалки. CX Codex +1 355установок ai-agent-orchestrator Скилл помогает собрать систему из нескольких ИИ-агентов: роли, передача задач, общая память и супервизор. CX Codex +1 352установок responsive-design-system Скилл для ИИ-агента, который помогает строить мобильную вёрстку: брейкпоинты, container queries, текучая типографика и адаптивные сетки на Tailwind CSS. CX Codex +1 343установок

Спонсоры проекта

Компании, которые помогают держать аналитику открытой