Как войти в vibe coding через Claude Code и собрать реальный проект, а не просто посмотреть на слайды

Минимальная структура проекта

/app/page.tsx                          → лендинг
/scripts/publish-telegram-post.ts      → отправка через Telegram Bot API
/lib/telegram/send-message.ts          → helper для sendMessage / sendPhoto
/.claude/skills/tg-post/SKILL.md       → единый playbook поста
/.claude/agents/tg-content-agent.md    → редактор под Telegram
/CLAUDE.md                             → правила и контекст проекта
/.env.local                            → TELEGRAM_BOT_TOKEN, TELEGRAM_CHAT_ID

Опционально:
 /lib/supabase.ts
 /supabase/migrations/*

# CLAUDE.md — пример для этого workshop

Мы делаем один сквозной MVP:
- публичный лендинг
- Telegram-бот
- content-agent и skill для Telegram-постов
- preview и production deployment

Главная ценность:
владелец продукта отправляет brief Claude в терминале и получает готовый пост,
который потом уходит через Telegram-бота.

Рабочий путь по умолчанию:
Next.js + Vercel + Telegram Bot API + Claude Code subagent/skill.
Supabase добавляем только когда нужна история, review и publish log.

Принципы:
- сначала показывай пользователю видимый результат
- не усложняй архитектуру раньше времени
- каждую значимую итерацию заканчивай commit
- перед изменениями коротко формулируй ожидаемый user-visible output
- длинные повторяемые процедуры выноси в skills

---
name: tg-post
description: Пиши и улучшай Telegram-посты для этого проекта. Используй, когда нужно превратить brief в короткий, ясный и полезный пост.
---

Когда используешь этот skill:
1. Сначала найди главный angle поста.
2. Дай 3 версии: short, standard, punchy.
3. Для каждой версии добавь:
   - hook
   - основной текст
   - CTA
4. Не пиши канцеляритом.
5. Не раздувай объём ради “умности”.
6. Если данных мало, делай разумные предположения и явно помечай их.

---
name: tg-content-agent
description: Telegram content editor. Use proactively when a brief needs angle, sharper hook, stronger CTA, or tighter editing.
tools: Read, Skill
model: sonnet
---

Ты редактор Telegram-контента.
Твоя задача:
- находить сильный angle
- сокращать лишнее
- делать первый экран цепким
- сохранять простой продуктовый язык
- не скатываться в пустой маркетинг

Схема на человеческом языке

1. Ты пишешь brief в Claude Code
2. Claude при необходимости вызывает tg-content-agent
3. Skill /tg-post возвращает short / standard / punchy
4. Ты выбираешь или правишь финальный вариант
5. Claude запускает script отправки
6. Бот отправляет текст в личку, канал или review-чат

Минимальная связка

package.json
"scripts": {
  "tg:send": "tsx scripts/publish-telegram-post.ts"
}

.env.local
TELEGRAM_BOT_TOKEN=your-bot-token
TELEGRAM_DRAFT_CHAT_ID=your-chat-id
TELEGRAM_CHANNEL_ID=your-channel-id

Логика:
- draft mode → отправляем в личку
- publish mode → отправляем в канал

Vercel MCP:
claude mcp add --transport http vercel https://mcp.vercel.com

Идея подключения:
Claude видит Vercel изнутри сессии, а не только по твоим словам.