К основному содержанию
скилл Claude Code CX Codex Cursor GitHub Copilot

code-tour · affaan-m — скилл для Claude Code: что делает и как установить

Скилл создаёт CodeTour .tour-файлы с пошаговым маршрутом по коду и привязкой к файлам и строкам. Подходит для онбординга и ревью.

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

Что делает code-tour

code-tour направляет агента на создание CodeTour .tour-файлов в каталоге .tours/. Тур строится под конкретного читателя: нового участника, ревьюера PR, архитектора или специалиста по разбору сбоя. В нём есть объяснение маршрута по проекту, карта модулей и путь выполнения.

Скилл использует шаги с каталогом, файлом и строкой, выделением, шаблоном или URI. Перед записью нужно проверить существование файлов и якорей; для PR важно выбрать ref, где доступны все файлы тура. Исходный код скилл не меняет.

Ставьте его, если нужен повторно используемый маршрут по подсистеме, PR или RCA. Для разового ответа в чате он избыточен.

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

  • создать тур по архитектуре сервиса
  • провести нового разработчика по репозиторию
  • связать шаги PR-ревью с изменёнными файлами
  • показать путь сбоя для RCA
  • объяснить работу подсистемы через .tour-файл

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

  • Создай onboarding code tour для этого репозитория в `.tours/`.
  • Сделай PR tour по изменённым файлам и проверь все якоря строк.
  • Покажи путь выполнения этой подсистемы через CodeTour `.tour`-файл.

Как установить code-tour

1Через Skills CLI (Vercel)

npx skills add affaan-m/ECC --skill code-tour -a claude-code

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

~/.claude/skills/code-tour/SKILL.md

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

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

Весь набор →
video-editing affaan-m Скилл выстраивает пайплайн монтажа реального видео через ИИ. Помогает нарезать сырые записи через FFmpeg, собрать титры в Remotion и добавить озвучку в ElevenLabs. Claude Code CX Codex Cursor +1 6 500установок docker-patterns affaan-m Скилл с проверенными шаблонами Dockerfile и Docker Compose: локальная разработка, сети, тома, безопасность контейнеров. Claude Code CX Codex Cursor +1 6 300установок frontend-patterns affaan-m Скилл подсказывает паттерны для React и Next.js: компоненты, состояние, загрузка данных и производительность. Нужен при разработке и ревью интерфейса. Claude Code CX Codex Cursor +1 5 900установок backend-patterns affaan-m Скилл с паттернами бэкенда для Node.js, Express и Next.js API routes: слои, кэш, транзакции, обработка ошибок. Claude Code CX Codex Cursor +1 5 900установок coding-standards affaan-m Базовые правила кода для проектов: проверяет именование, запрещает мутации объектов и следит за простыми конструкциями. Пригодится на ревью и рефакторинге. Claude Code CX Codex Cursor +1 5 600установок api-design affaan-m Скилл задаёт правила проектирования REST API: именование эндпоинтов, выбор статус-кодов, пагинацию и формат ошибок. Помогает при создании и ревью серверных контрактов. Claude Code CX Codex Cursor +1 5 500установок rust-testing affaan-m Скилл для написания тестов на Rust: юнит-тесты, интеграционные, async, property-based, моки и покрытие. Пригодится, когда ведёшь проект по TDD. Claude Code CX Codex Cursor +1 5 500установок laravel-security affaan-m Скилл помогает проверять безопасность Laravel-приложений: аутентификацию, Eloquent, CSRF, XSS, API и настройки production. Пригодится для ревью и деплоя. Claude Code CX Codex Cursor +1 5 400установок

Другие версии code-tour

Похожие

gh cli Учит агента вызывать GitHub CLI: структурированный JSON, пагинация, поиск issues и PR, загрузка файлов. Claude Code CX Codex Cursor +1 2 600установок build-mcpb официальный Anthropic Скилл упаковывает локальный MCP-сервер вместе с Node или Python, чтобы его можно было установить без готового окружения. Claude Code 6 229установок stripe-best-practices stripe Скилл помогает выбирать API Stripe, настраивать платежи и проверять безопасность интеграции. Пригодится при разработке, тестировании и ревью. Claude Code CX Codex Cursor +1 97 800установок show-me humanlayer Объясняет код и архитектуру через схемы Mermaid, деревья вызовов, diff и HTML-файлы. Пригодится, когда нужно быстро увидеть логику или структуру вместо чтения полотен текста. Claude Code CX Codex Cursor +1 32 300установок ppt-generation bytedance Генерирует слайды для презентаций в формате PPTX через создание картинок к каждому экрану. Пригодится, когда нужно быстро собрать визуальный доклад с единым оформлением. Claude Code CX Codex Cursor +1 5 200установок solana-dev Solana Foundation Скилл для написания Solana dApp, смарт-контрактов на Anchor, управления кошельками и транзакциями. Охватывает всё: от настройки окружения до тестирования и деплоя на devnet. Claude Code CX Codex Cursor +1 98 300установок find-skills vercel-labs Ищет и устанавливает готовые скиллы для ИИ-агентов через каталог skills.sh. Пригодится, когда для рабочей задачи нужен специализированный воркфлоу. Claude Code CX Codex Cursor +1 4 000 000установок frontend-design официальный anthropics Скилл задаёт осмысленное визуальное направление для новых интерфейсов и редизайна. Подойдёт, когда стандартный шаблонный UI не устраивает. Claude Code Claude.ai 1 025 790установок

Вопросы о code-tour

Как установить code-tour в Claude Code?

Выполните npx skills add affaan-m/ECC --skill code-tour -a claude-code. Файл скилла появится по пути ~/.claude/skills/code-tour/SKILL.md.

Что делает code-tour?

Скилл помогает создавать .tour-файлы с шагами по реальным файлам и строкам. Он задаёт маршрут для онбординга, архитектурного разбора, PR-ревью или RCA.

Зачем нужен `ref` в CodeTour?

ref привязывает тур к ветке или коммиту. Для PR нужно выбрать ветку PR, иначе шаги с новыми файлами могут не открыться.

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

SKILL.md · MIT
---
name: code-tour
description: Create CodeTour `.tour` files — persona-targeted, step-by-step walkthroughs with real file and line anchors. Use for onboarding tours, architecture walkthroughs, PR tours, RCA tours, and structured "explain how this works" requests. Use when the user asks for a code tour, onboarding walkthrough, PR tour, or an explanation of how a subsystem works.
metadata:
  origin: ECC
---

# Code Tour

Create **CodeTour** `.tour` files for codebase walkthroughs that open directly to real files and line ranges. Tours live in `.tours/` and are meant for the CodeTour format, not ad hoc Markdown notes.

A good tour is a narrative for a specific reader:
- what they are looking at
- why it matters
- what path they should follow next

Only create `.tour` JSON files. Do not modify source code as part of this skill.

## When to Use

Use this skill when:
- the user asks for a code tour, onboarding tour, architecture walkthrough, or PR tour
- the user says "explain how X works" and wants a reusable guided artifact
- the user wants a ramp-up path for a new engineer or reviewer
- the task is better served by a guided sequence than a flat summary

Examples:
- onboarding a new maintainer
- architecture tour for one service or package
- PR-review walk-through anchored to changed files
- RCA tour showing the failure path
- security review tour of trust boundaries and key checks

## When NOT to Use

| Instead of code-tour | Use |
| --- | --- |
| A one-off explanation in chat is enough | answer directly |
| The user wants prose docs, not a `.tour` artifact | `documentation-lookup` or repo docs editing |
| The task is implementation or refactoring | do the implementation work |
| The task is broad codebase onboarding without a tour artifact | `codebase-onboarding` |

## Workflow

### 1. Discover

Explore the repo before writing anything:
- README and package/app entry points
- folder structure
- relevant config files
- the changed files if the tour is PR-focused

Do not start writing steps before you understand the shape of the code.

### 2. Infer the reader

Decide the persona and depth from the request.

| Request shape | Persona | Suggested depth |
| --- | --- | --- |
| "onboarding", "new joiner" | `new-joiner` | 9-13 steps |
| "quick tour", "vibe check" | `vibecoder` | 5-8 steps |
| "architecture" | `architect` | 14-18 steps |
| "tour this PR" | `pr-reviewer` | 7-11 steps |
| "why did this break" | `rca-investigator` | 7-11 steps |
| "security review" | `security-reviewer` | 7-11 steps |
| "explain how this feature works" | `feature-explainer` | 7-11 steps |
| "debug this path" | `bug-fixer` | 7-11 steps |

### 3. Read and verify anchors

Every file path and line anchor must be real:
- confirm the file exists
- confirm the line numbers are in range
- if using a selection, verify the exact block
- if the file is volatile, prefer a pattern-based anchor

Never guess line numbers.

### 4. Write the `.tour`

Write to:

```text
.tours/<persona>-<focus>.tour
```

Keep the path deterministic and readable.

### 5. Validate

Before finishing:
- every referenced path exists
- every line or selection is valid
- the first step is anchored to a real file or directory
- the `ref` points at a branch or commit that actually has every file the tour references (see below)
- the tour tells a coherent story rather than listing files

## The `ref` Field

`ref` ties the tour to a git branch or commit. It matters more than it looks: when `ref` is not the branch the reader has checked out, CodeTour opens each step's file from that revision in git, not from the files on disk. If a file is not in that revision, the step will not open — the reader sees *"The editor could not be opened because the file was not found"* even though the file is sitting right there. The tour and its comments still show, so the real cause is easy to miss.

Pick `ref` by tour type:

| Tour type | Set `ref` to |
| --- | --- |
| PR tour | the PR branch — never the base branch |
| Onboarding / architecture | the branch the reader will be on (often `main`), or leave it out |
| Not sure | leave `ref` out, so CodeTour reads files straight from disk |

The PR case is the common trap: a PR usually adds new files, and new files do not exist on the base branch yet. Point `ref` at the base (e.g. `develop`) and every step on a new file fails to open.

Before finishing, confirm each step's file actually exists at the `ref` you chose.

## Step Types

### Content

Use sparingly, usually only for a closing step:

```json
{ "title": "Next Steps", "description": "You can now trace the request path end to end." }
```

Do not make the first step content-only.

### Directory

Use to orient the reader to a module:

```json
{ "directory": "src/services", "title": "Service Layer", "description": "The core orchestration logic lives here." }
```

### File + line

This is the default step type:

```json
{ "file": "src/auth/middleware.ts", "line": 42, "title": "Auth Gate", "description": "Every protected request passes here first." }
```

### Selection

Use when one code block matters more than the whole file:

```json
{
  "file": "src/core/pipeline.ts",
  "selection": {
    "start": { "line": 15, "character": 0 },
    "end": { "line": 34, "character": 0 }
  },
  "title": "Request Pipeline",
  "description": "This block wires validation, auth, and downstream execution."
}
```

### Pattern

Use when exact lines may drift:

```json
{ "file": "src/app.ts", "pattern": "export default class App", "title": "Application Entry" }
```

### URI

Use for PRs, issues, or docs when helpful:

```json
{ "uri": "https://github.com/org/repo/pull/456", "title": "The PR" }
```

## Writing Rule: SMIG

Each description should answer:
- **Situation**: what the reader is looking at
- **Mechanism**: how it works
- **Implication**: why it matters for this persona
- **Gotcha**: what a smart reader might miss

Keep descriptions compact, specific, and grounded in the actual code.

## Narrative Shape

Use this arc unless the task clearly needs something different:
1. orientation
2. module map
3. core execution path
4. edge case or gotcha
5. closing / next move

The tour should feel like a path, not an inventory.

## Example

```json
{
  "$schema": "https://aka.ms/codetour-schema",
  "title": "API Service Tour",
  "description": "Walkthrough of the request path for the payments service.",
  "ref": "main",
  "steps": [
    {
      "directory": "src",
      "title": "Source Root",
      "description": "All runtime code for the service starts here."
    },
    {
      "file": "src/server.ts",
      "line": 12,
      "title": "Entry Point",
      "description": "The server boots here and wires middleware before any route is reached."
    },
    {
      "file": "src/routes/payments.ts",
      "line": 8,
      "title": "Payment Routes",
      "description": "Every payments request enters through this router before hitting service logic."
    },
    {
      "title": "Next Steps",
      "description": "You can now follow any payment request end to end with the main anchors in place."
    }
  ]
}
```

## Anti-Patterns

| Anti-pattern | Fix |
| --- | --- |
| Flat file listing | Tell a story with dependency between steps |
| Generic descriptions | Name the concrete code path or pattern |
| Guessed anchors | Verify every file and line first |
| Too many steps for a quick tour | Cut aggressively |
| First step is content-only | Anchor the first step to a real file or directory |
| Persona mismatch | Write for the actual reader, not a generic engineer |

## Best Practices

- keep step count proportional to repo size and persona depth
- use directory steps for orientation, file steps for substance
- for PR tours, cover changed files first
- for monorepos, scope to the relevant packages instead of touring everything
- close with what the reader can now do, not a recap

## Related Skills

- `codebase-onboarding`
- `coding-standards`
- `council`
- official upstream format: `microsoft/codetour`

© affaan-m · MIT · affaan-m/ECC

Смотрите также

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

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