iishenka.pro
В Pro

Мастер-класс ИИшенка Pro

Claude Code Мастер-класс

От установки и настройки до приложения на Next.js и Supabase: команды, скиллы, MCP, плагины и субагенты — всё в одном мастер-классе.

Вступить в сообществоСмотреть программу
модулей
17 модулей
разобранных тем
121 разобранных тем
тайм-кодов
131 тайм-кодов
общая длительность
≈ 1 ч 52 мин общая длительность

Программа мастер-класса

Мастер-класс состоит из 17 тем, которые последовательно проведут вас от основ Claude Code до приложения на Next.js с аутентификацией и базой данных Supabase.

Введение в Claude Code

В этом видео мы разберёмся, что такое Claude Code, зачем он нужен и как его эффективно использовать. Мы узнаем о его возможностях, отличиях от других инструментов и настроимся на продуктивную работу в рамках мастер-класса.

Ключевые темы

  • Что такое Claude Code и зачем он нужен
  • Не про программирование, а про использование инструмента
  • Нейросеть в терминале: возможности и ограничения
  • Сравнение с Gemini CLI и Cursor
  • Claude Code как трендсеттер: MCP, скиллы, кастомные команды
  • Планы на мастер-класс: NextJS и Firebase
  1. Приветствие и введение
  2. Что такое Claude Code и зачем он нужен
  3. Не про программирование, а про использование инструмента
  4. Нейросеть в терминале: возможности и ограничения
  5. Сравнение с Gemini CLI и Cursor
  6. Claude Code как трендсеттер: MCP, скиллы, кастомные команды
  7. Планы на мастер-класс: создание приложения на NextJS и Firebase

Установка и настройка Claude Code

Пошаговая инструкция по установке Claude Code на различные операционные системы. Мы также подготовим необходимое окружение: установим Git, Visual Studio Code и настроим авторизацию в Claude Code.

Ключевые темы

  • Способы установки Claude Code (документация)
  • Установка на macOS, Linux и Windows (WSL)
  • Требования к плану подписки (Pro Plan)
  • Установка через терминал и проверка версии
  • Рекомендация использовать Visual Studio Code
  • Установка Git и настройка терминала в VS Code
  • Первый запуск, выбор темы, авторизация и Security Notes
  • Интеграция с IDE (команда /ide)
  1. Способы установки Claude Code (документация)
  2. Установка на macOS, Linux и Windows (WSL)
  3. Требования к плану подписки (Pro Plan)
  4. Установка Claude Code через терминал
  5. Рекомендация использовать Visual Studio Code
  6. Установка Git
  7. Настройка терминала в VS Code
  8. Запуск установки и проверка версии
  9. Первый запуск и выбор темы
  10. Авторизация и Security Notes
  11. Интеграция с IDE (команда /ide)

Структура проекта Next.js и маршрутизация

Знакомство с базовой структурой проекта Next.js, подготовленного для мастер-класса. Разбор принципов маршрутизации, группировки маршрутов и работы с layout. Запуск dev-сервера и обзор страниц приложения.

Ключевые темы

  • Импорт базовой структуры проекта в VS Code
  • Обзор структуры: frontend и backend
  • Основы маршрутизации в Next.js
  • Папка app и группировка маршрутов (круглые скобки)
  • Маркетинговые страницы и layout
  • Страницы аутентификации (sign-in, sign-up)
  • Платформа и дашборд (защищенные маршруты)
  • Запуск сервера (npm run dev) и проверка в браузере
  1. Импорт базовой структуры проекта в VS Code
  2. Обзор структуры проекта: frontend и backend
  3. Основы маршрутизации в Next.js
  4. Папка app и группировка маршрутов (круглые скобки)
  5. Маркетинговые страницы и layout
  6. Страницы аутентификации (sign-in, sign-up)
  7. Платформа и дашборд (защищенные маршруты)
  8. Запуск сервера (npm run dev) и проверка в браузере

Основы коммуникации с Claude Code

Учимся взаимодействовать с Claude Code: задавать общие вопросы о проекте и контекстные вопросы по конкретным файлам. Разбираем способы добавления файлов в контекст и применение изменений, предложенных нейросетью.

Ключевые темы

  • Запуск Claude Code в проекте
  • Общие вопросы о проекте и разрешение на чтение файлов
  • Вопросы по конкретным файлам (через @ и sidebar)
  • Добавление фрагментов кода в контекст (выделение)
  • Запрос на изменение и применение изменений
  1. Запуск Claude Code в проекте
  2. Задаем общий вопрос: "Расскажи про этот проект"
  3. Разрешение на чтение файлов
  4. Как задавать вопросы про конкретные файлы (через @ и sidebar)
  5. Добавление фрагментов кода в контекст (выделение)
  6. Запрос на изменение текста в хедере
  7. Применение изменений и проверка результата

Выбор моделей и управление контекстом

Разбор доступных моделей в Claude Code (Sonnet, Opus, Haiku) и рекомендации по их использованию. Изучение команд для проверки статистики, управления сессиями и оптимизации контекстного окна (compact).

Ключевые темы

  • Модели в Claude Code: Sonnet, Opus, Haiku
  • Слэш-команды для управления моделями (/model)
  • Когда использовать Opus, Sonnet и Haiku
  • Лимиты использования, Extra usage и кредиты
  • Статистика использования (/stats) и контекст (/context)
  • Влияние скиллов и MCP на контекст
  • Управление сессиями: новая сессия и resume (-r)
  • Хранение сессий (папка .claude) и компактизация (/compact)
  1. Модели в Claude Code: Sonnet, Opus, Haiku
  2. Слэш-команды для управления моделями (/model)
  3. Когда использовать Opus, Sonnet и Haiku
  4. Лимиты использования и usage сессии
  5. Extra usage и кредиты
  6. Статистика использования (/stats)
  7. Просмотр заполненности контекста (/context)
  8. Влияние скиллов и MCP на контекст
  9. Управление сессиями: новая сессия и resume (-r)
  10. Где хранятся сессии (папка .claude)
  11. Компактизация контекста (/compact)

Инструменты управления Claude Code

Обзор основных способов управления Claude Code: встроенные и кастомные команды, скиллы (как эволюция команд), MCP-серверы для интеграции с внешними сервисами, хуки для продвинутой разработки и плагины, объединяющие всё вышеперечисленное.

Ключевые темы

  • Пять способов управления: команды, скиллы, MCP, хуки, плагины
  • Команды (Commands) и слэш-меню
  • Скиллы (Skills) как замена командам
  • MCP-серверы: выход во внешний мир
  • Хуки (Hooks) для разработчиков
  • Плагины (Plugins): объединение функционала
  • Команда /init и создание CLAUDE.md
  • Контроль версий и команда /rewind, конфигурация /config
  1. Пять способов управления Claude Code
  2. Команды (Commands) и слэш-меню
  3. Скиллы (Skills) как замена командам
  4. MCP-серверы: выход во внешний мир
  5. Хуки (Hooks) для разработчиков
  6. Плагины (Plugins): объединение функционала
  7. Команда /init и создание CLAUDE.md
  8. Обзор сгенерированного файла CLAUDE.md
  9. Контроль версий и команда /rewind (откат изменений)
  10. Конфигурация через /config (Theme, Thinking Mode)

Управление разрешениями и настройками

Разбор системы разрешений (permissions) в Claude Code. Понимание того, как нейросеть запрашивает доступ к инструментам (создание файлов, выполнение команд). Настройка автоматических разрешений для ускорения работы через команду /permissions и файл settings.local.json.

Ключевые темы

  • Как работают permissions в Claude Code
  • Типы инструментов и их разрешения (Bash, Edit)
  • Три опции ответа: Yes, Skip, Don't ask again
  • Режим Accept Edits On (Shift+Tab)
  • Команды websearch и webfetch
  • Папка .claude и файл settings.local.json
  • Управление разрешениями через /permissions
  • Добавление правил для Bash-команд (пример с git)
  1. Как работают permissions в Claude Code
  2. Типы инструментов и их разрешения (Bash, Edit)
  3. Три опции ответа на запрос разрешения (Yes, Skip, Don't ask again)
  4. Режим "Accept Edits On" (Shift+Tab)
  5. Команды websearch и webfetch
  6. Папка .claude и файл settings.local.json
  7. Управление разрешениями через /permissions
  8. Добавление правил для Bash-команд (пример с git)

Создание собственных команд

Практическое руководство по созданию кастомных команд в Claude Code. Создание директории .claude/commands, структура markdown-файла команды (description, arguments, tools). Пример создания команды /create-spec для генерации спецификаций в стиле Spec Driven Development.

Ключевые темы

  • Зачем нужны кастомные команды
  • Хранение команд (папка .claude)
  • Создание файла команды (create-spec.md)
  • Структура команды: Frontmatter (Description)
  • Spec Driven Development: подход к разработке
  • Аргументы в командах ($1, $2...)
  • Pre-authorized tools: прописываем разрешения заранее
  • Создание шаблона для спецификации (template.md)
  • Использование референсов (Figma) в командах
  1. Зачем нужны кастомные команды
  2. Где хранятся команды (папка .claude)
  3. Создание файла команды (create-spec.md)
  4. Структура команды: Frontmatter (Description)
  5. Spec Driven Development: подход к разработке
  6. Аргументы в командах ($1, $2...)
  7. Pre-authorized tools: прописываем разрешения заранее
  8. Создание шаблона для спецификации (template.md)
  9. Использование референсов (Figma) в командах

Разработка через спецификации и Git

Демонстрация полного цикла разработки: создание спецификации с помощью кастомной команды, проверка изменений, и использование Git для фиксации версий. Использование команды /rewind как аналога git reset для отката изменений.

Ключевые темы

  • Основы Git: add, commit, push (кратко)
  • Команда git add и git commit
  • Откат изменений: git reset vs /rewind
  • Изменение спецификации вручную и git status
  • Переключение в Bash Mode (!)
  • Ручной коммит изменений спецификации
  • Запуск кастомной команды /create-spec
  • Fetching URL для анализа структуры (Trello landing)
  • Генерация спецификации на основе шаблона и референса
  1. Основы Git: add, commit, push (кратко)
  2. Команда git add .
  3. Команда git commit
  4. Откат изменений: git reset vs /rewind
  5. Изменение спецификации вручную и git status
  6. Переключение в Bash Mode (!)
  7. Ручной коммит изменений спецификации
  8. Запуск кастомной команды /create-spec
  9. Fetching URL для анализа структуры (Trello landing)
  10. Генерация спецификации на основе шаблона и референса

Обновление контекста и CLAUDE.md

Важность переинициализации проекта после внесения значимых изменений. Как обновлять файл CLAUDE.md, чтобы нейросеть всегда имела актуальное представление о структуре и компонентах проекта, экономя время и токены.

Ключевые темы

  • Когда нужно обновлять CLAUDE.md
  • Переключение модели на Sonnet для экономии токенов
  • Повторный запуск /init
  • Сравнение старого и нового CLAUDE.md
  • Влияние актуального контекста на качество работы нейросети
  1. Когда нужно обновлять CLAUDE.md
  2. Переключение модели на Sonnet для экономии токенов
  3. Повторный запуск /init
  4. Сравнение старого и нового CLAUDE.md
  5. Влияние актуального контекста на качество работы нейросети

MCP-серверы: теория и Context

Глубокое погружение в Model Context Protocol (MCP). Что это такое, зачем нужно и как позволяет нейросети взаимодействовать с внешним миром (файловой системой, API, базами данных). Установка MCP-сервера Context (Context 7) для доступа к актуальной документации библиотек (NextJS, Shadcn UI и др.). Разбор скоупов (Local, Project, User).

Ключевые темы

  • Что такое MCP-сервер (Model Context Protocol)
  • Как MCP связывает нейросеть с внешними системами
  • Context (Context 7) — сервер с документациями
  • Процесс установки MCP-сервера в Claude Code
  • Понятие Scope (Local, Project, User)
  • Получение API Key для Context
  • Проверка установки сервера
  1. Что такое MCP-сервер (Model Context Protocol)
  2. Как MCP связывает нейросеть с внешними системами
  3. Context (Context 7) — сервер с документациями
  4. Процесс установки MCP-сервера в Claude Code
  5. Понятие Scope (Local, Project, User)
  6. Получение API Key для Context
  7. Проверка установки сервера

Интеграция с Figma через MCP

Подключение MCP-сервера для работы с Figma (Framelink/Figma MCP). Это позволяет нейросети «видеть» структуру макетов, слоев и свойств из Figma напрямую, минуя скриншоты. Генерация Personal Access Token в Figma и настройка интеграции.

Ключевые темы

  • Зачем нужен Figma MCP (генерация кода из дизайна)
  • Выбор и установка MCP-сервера (Framelink)
  • Разница между локальным и удаленным (Remote) запуском
  • Получение Personal Access Token в Figma
  • Команда /mcp: проверка подключенных серверов
  • Инструменты сервера: get Figma Data, Download Images
  1. Зачем нужен Figma MCP (генерация кода из дизайна)
  2. Выбор и установка MCP-сервера (Framelink)
  3. Разница между локальным и удаленным (Remote) запуском
  4. Получение Personal Access Token в Figma
  5. Команда /mcp: проверка подключенных серверов
  6. Инструменты сервера: get Figma Data, Download Images

Создание Dashboard с помощью MCP

Практическое применение MCP-серверов. Создание страницы Dashboard на Next.js по макету из Figma. Использование Figma MCP для анализа дизайна и Context/Shadcn MCP для генерации правильного кода компонентов. Полный цикл: Промт -> План (Spec) -> Имплементация -> Проверка.

Ключевые темы

  • Обзор задачи: создание Dashboard
  • Подготовка макета в Figma (Shadcn style)
  • Копирование ссылки на фрейм
  • Составление промта с Figma MCP и Shadcn MCP
  • Анализ макета нейросетью через MCP
  • Генерация и утверждение плана (Implementation Plan)
  • Имплементация кода (режим принятия изменений)
  • Демонстрация результата в браузере
  1. Обзор задачи: создание Dashboard
  2. Подготовка макета в Figma (Shadcn style)
  3. Копирование ссылки на фрейм
  4. Составление промта с использованием Figma MCP и Shadcn MCP
  5. Анализ макета нейросетью через MCP
  6. Генерация и утверждение плана (Implementation Plan)
  7. Имплементация кода (режим принятия изменений)
  8. Демонстрация результата в браузере

Скиллы (Skills) vs Команды (Commands)

В чем разница между командами и скиллами? Скиллы как расширенная версия команд с поддержкой скриптов и данных. Автоматическое попадание описания скиллов в контекст (Auto-discovery). Установка готового скилла «UI UX Pro Max» для улучшения дизайна. Структура папки .claude/skills.

Ключевые темы

  • Экосистема: Команды, Скиллы, Плагины, Агенты
  • Почему команда /create-spec лежит в /skills
  • Структура скилла: skill.md, скрипты, данные
  • Главное отличие: нейросеть сама решает, когда вызвать скилл
  • Ручное создание структуры скилла
  • Пример скилла: UI UX Pro Max (правила дизайна)
  • Глобальная установка скилла
  1. Экосистема: Команды, Скиллы, Плагины, Агенты
  2. Почему команда /create-spec лежит в /skills?
  3. Структура Скилла: skill.md, скрипты, данные
  4. Главное отличие: Нейросеть сама решает, когда вызвать Скилл
  5. Ручное создание структуры Скилла
  6. Пример мощного скилла: UI UX Pro Max (правила дизайна)
  7. Глобальная установка скилла

Субагенты (Sub-agents)

Что такое субагенты и чем они отличаются от линейного выполнения команд. Итеративный подход к решению задач: агент сам проверяет результат и переделывает, если нужно. Создание кастомного агента «Accessibility Checker» для проверки доступности интерфейсов. Настройка инструментов и модели для агента.

Ключевые темы

  • Введение в субагенты
  • Итеративность: главное отличие агента от команды
  • Встроенные агенты: Planning, Explore, Bash
  • Создание своего агента через /agents
  • Пример: агент для проверки Accessibility (доступности)
  • Настройка инструментов (Tools) и модели (Opus, Sonnet)
  • Скоуп агента (Project vs User)
  1. Введение в Субагенты
  2. Итеративность: главное отличие агента от команды
  3. Встроенные агенты: Planning, Explore, Bash
  4. Создание своего агента через /agents
  5. Пример: Агент для проверки Accessibility (доступности)
  6. Настройка инструментов (Tools) и модели (Opus, Sonnet) для агента
  7. Скоуп агента (Project vs User)

Плагины (Plugins) и Supabase

Плагины в Claude Code — это «коробка», объединяющая команды, скиллы, MCP-серверы и агентов. Установка плагина Supabase из официального маркетплейса. Настройка интеграции с базой данных Supabase через плагин.

Ключевые темы

  • Плагины — «главный босс» в Claude Code
  • Из чего состоит плагин (Commands, Skills, MCP, Agents)
  • Маркетплейсы плагинов (Official & Community)
  • Установка Supabase Plugin
  • Создание и привязка проекта Supabase через Claude
  1. Плагины — «главный босс» в Claude Code
  2. Из чего состоит плагин (Commands, Skills, MCP, Agents)
  3. Маркетплейсы плагинов (Official & Community)
  4. Установка Supabase Plugin
  5. Создание и привязка проекта Supabase через Claude

Аутентификация и БД с Supabase

Практическое внедрение базы данных и аутентификации. Использование Supabase Plugin для планирования архитектуры БД (Таблицы: Profiles, Boards, Lists, Cards) и настройки Auth (Sign Up, Log In). Генерация SQL-схем и RLS-политик с помощью нейросети. Проверка регистрации пользователей.

Ключевые темы

  • Планирование архитектуры БД через Supabase Plugin
  • Анализ спецификации: таблицы и RLS (Row Level Security)
  • Таблицы: Profiles, Boards, Lists, Cards
  • Настройка Auth (Sign Up, Log In)
  • Внедрение изменений (создание таблиц)
  • Проверка схемы в Supabase Dashboard
  • Проверка регистрации и создания пользователя
  1. Планирование архитектуры БД через Supabase Plugin
  2. Анализ спецификации: Таблицы и RLS (Row Level Security)
  3. Внедрение изменений (создание таблиц)
  4. Проверка схемы базы данных в Supabase Dashboard
  5. Проверка регистрации и создания пользователя

Этот мастер-класс — часть Pro

Одна подписка открывает доступ ко всем мастер-классам и к базе знаний сообщества.

Мастер-класс по n8n

9 модулей: от первого workflow до RAG-агента с интеграцией нейросетей.

Мастер-класс по Google Antigravity

15 модулей: Workflows, Skills, MCP-серверы, Stitch и Agent Manager.

Мастер-класс по Codex

16 модулей: Sites, плагины, скиллы, субагенты, расписания, Supabase и Computer Use.

Pro-сообщество

База знаний, разборы, шаблоны агентов и живое общение с практиками.

Присоединяйся к Pro-сообществу сегодня

Одна подписка — все мастер-классы, база знаний и живое общение с практиками.

Выберите тариф

Цены действуют со скидкой для ранних участников.

Что входит

  • Доступ ко всем текущим и будущим материалам
  • Мастер-класс по n8n для новичков
  • Мастер-класс по Claude Code
  • Мастер-класс по Google Antigravity
  • Регулярно пополняющаяся база знаний про ИИ
  • Приватное сообщество
  • Шаблоны и ресурсы для ИИ-агентов

Бонусом

  • Эксклюзивные знания про ИИ-агентов
  • Эксклюзивный нетворкинг

Вы выбрали: годовая подписка — 59 900 ₽ в год

Вступить в Pro
  • Оплата и выбор тарифа — в Telegram-боте.
  • Доступ открывается сразу после подтверждения оплаты.
  • Подписка продлевается автоматически; отменить можно в любой момент до начала следующего периода.
  • Условия оферты.