Вайбкодинг · Рабочее место
Вечер 1 · собираем и строим

Рабочее место и первый сайт

Кодить не нужно — ты не напишешь руками ни строчки. К концу этого вечера на твоём компьютере будет работать ИИ-агент, а в браузере — открываться твой первый сайт, собранный целиком твоими словами. Это фундамент: всё, что дальше в курсе, строится на этом же рабочем месте.

~2,5 часа 🧰 нужен: VPN и способ оплатить Claude 📦 результат: рабочее место + первый сайт в браузере
Этот вечер длинный не потому что сложный, а потому что тут одна установка. Делай по частям: закончил часть — можешь выдохнуть и вернуться позже. Единственное, что нельзя откладывать посреди установки — Часть 2, доступ к Claude, там важен порядок шагов.
Часть 1

Почему так, а не конструкторы

~20 мин

Есть соблазн зайти на готовый сайт-конструктор и накликать всё за 10 минут. Ниже — почему мы идём другим путём: он на 20 минут дольше сегодня и в разы быстрее на любом следующем проекте.

1

Пойми, что такое вайб-кодинг

5 мин
  • Ты говоришь ИИ-агенту словами, что хочешь получить — он сам пишет код, запускает его и проверяет, что не сломалось.
  • Твоя работа — не синтаксис и не английский. Твоя работа — идея, смысл, для кого и зачем этот продукт. Код тут инструмент, а не цель.
  • Раньше сайт стоил команды разработчиков и сотен тысяч рублей. Сейчас — подписка $20–200/мес и умение объяснять, чего ты хочешь.
Это не работает вслепую на всём подряд: highload-сервис на миллион пользователей, приложение в App Store без опыта публикации, банковские и медицинские системы — там всё ещё нужны живые специалисты. Для сайта, лендинга, внутреннего инструмента — справишься сам.
Чекпоинт
Ты понимаешь: не «я не программист — мне нельзя», а «я объясняю смысл — агент пишет код».
2

Собери свою мастерскую, а не заходи в чужую песочницу

10 мин

Есть два пути: конструкторы вроде Lovable, Bolt, Replit (и Cursor как «полу-конструктор») — или связка VS Code + Claude Code, официальное расширение Anthropic внутри бесплатного редактора кода. Мы идём вторым путём — вот почему.

Что важноСвоя мастерская (VS Code + Claude Code)Готовый конструктор
Кому принадлежитТебе. Редактор бесплатный, проект — файлы на твоём компеПлатформе. Ты работаешь внутри их сервиса
Что можно построитьЧто угодно, вплоть до сложного продукта с оплатой и базой данныхВ основном — простую штуку: лендинг, презентацию
ОплатаОдна подписка Claude — работает и на этом, и на любом следующем проектеОтдельная подписка платформе, часто дороже за токен
Если сервис закроют или подорожаетКод уже у тебя, переносишь куда угодноТеряешь доступ вместе с платформой
Чекпоинт
Ты понимаешь разницу: стол — твой, инструмент на нём — сменный. Заперт в чужой экосистеме не будешь.
3

Два правила-фильтра на весь курс

5 мин
  • Строй то, что после сегодня продолжит работать на тебя. Цель вечера — не «потыкать нейросеть», а рабочий сайт, который можно показать. Черновик ради черновика не в счёт.
  • 10 кривых попыток дают 1 идеальную. Агент не знает заранее, что тебе понравится — он предполагает. Первый вариант почти никогда не идеален, и это не твой провал: попроси другой, сравни, возьми от каждого лучшее.
Чекпоинт
Ты не ждёшь идеального результата с первого раза — ты закладываешь несколько кругов правок заранее.
Часть 2

Собери рабочее место

~60 мин

Дальше — руками. Четыре шага: доступ к Claude, редактор, агент внутри редактора, голос (по желанию). Не перепрыгивай порядок в шаге 4 — там важна последовательность.

4

Открой доступ к Claude из России

30 мин
  • Claude официально не работает с российских IP — доступ собирается из стандартных элементов, разово настроил и дальше не думаешь.
  • VPN одной страны — навсегда. Выбери одну (США, Казахстан, Армения) и никогда не переключай. Включай его до первого захода на claude.ai и не выключай, пока сессия открыта — ни на минуту.
    • Google-аккаунт (если новый) — сразу укажи ту же страну, что и VPN;
    • номер телефона для SMS — лучше в аренду на несколько дней, а не одноразовый сервис: потеряешь номер — потеряешь доступ к аккаунту;
    • карта для оплаты — иностранная или арендованная с рублёвым пополнением.
  • Зарегистрируйся на claude.ai под включённым VPN.
  • Не покупай подписку в день регистрации. Попользуйся бесплатным тарифом 2–3 дня, потом плати — так ниже риск блокировки свежего аккаунта.
  • Когда решишь платить — сразу бери тариф от $100/мес (это ~7 500 ₽). Бесплатный тариф и $20/мес хватает познакомиться, но в реальной работе агент упирается в лимит за 10–15 минут, и ты будешь ждать часами.
Железное правило: одна страна VPN навсегда, не выключать никогда во время работы с Claude. Поймал российский IP хоть на секунду в открытой сессии — аккаунт могут забанить без возможности восстановить.

Чем платить, если российская карта не проходит. Это главный затык новичка. Рабочие варианты — от простого:

СпособКак это работаетНюанс
Иностранная картаЕсли она у тебя уже есть — просто привязываешьСтрана карты должна совпадать со страной VPN
Виртуальная карта в арендуЧерез телеграм-боты выпуска карт: выпускаешь карту нужной страны, пополняешь рублямиВыпуск ~1000 ₽ + сама подписка. Бери карту страны своего VPN
Через App Store / Google PlayОформляешь подписку как мобильную, с аккаунта магазинаБанится реже, чем прямая оплата картой
Подарочная подписка (Gift)На площадках цифровых товаров покупаешь «Gift на существующий аккаунт», даёшь свою почту — продавец дарит подписку тебе🚨 Брать только «на существующий аккаунт». Лоты «готовый новый аккаунт» — НЕ брать: их продают нескольким людям, аккаунт отберут
🚨 Как не потерять аккаунт (это важнее, чем сэкономить)

Страна карты = страна VPN. Платишь картой одной страны, а заходишь из другой — блокировка почти гарантирована в первый же месяц.

Один аккаунт — один человек. Не давай доступ друзьям и коллегам: заходы с разных устройств и адресов считываются как взлом.

Не прыгай по странам в VPN (сегодня Германия, завтра Канада) — это самый быстрый способ потерять доступ.

Не покупай «готовые аккаунты» с рук — их перепродают по кругу.

Если аккаунт забанили

Не пиши в поддержку и не пытайся восстановить — бесполезно. Заводи новый аккаунт с нуля по тем же шагам, но строже следи за VPN.

План Б, если с оплатой совсем никак. Есть китайские модели (например GLM от Zhipu) — работают из России без VPN, стоят в 3–5 раз дешевле и подключаются к тому же агенту-редактору. Качество чуть ниже, но для первых проектов хватает. Это запасной путь, не основной.

Чекпоинт
Открыт claude.ai под VPN, аккаунт зарегистрирован, подписка от $100/мес активна.
5

Установи VS Code — «стол» для твоего агента

5 мин

Что это. VS Code — бесплатная программа-редактор. Звучит страшно, но код в ней писать тебе НЕ придётся — писать будет агент. Тебе она нужна как стол, на котором агент работает.

Зачем она, если можно просто в чате. Чат Claude в браузере — это собеседник: он может рассказать и показать текст, но у него нет доступа к твоему компьютеру. Он не сохранит тебе файлы сайта, не запустит его, не проверит, что получилось.

VS Code + агент внутри него — это уже мастерская: агент видит папку проекта, создаёт и правит файлы, запускает сайт и сам проверяет, что не сломалось. Разница как между «посоветовал по телефону» и «приехал и сделал».

  • Зайди на code.visualstudio.com → кнопка Download → скачается версия под твою систему.
  • Установи как обычную программу: двойной клик → «Далее» → «Готово».
  • Запусти — должно открыться тёмное окно редактора кода.
Чекпоинт
VS Code открывается, ты видишь тёмный интерфейс редактора.
6

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

15 мин
  • В VS Code слева найди иконку Extensions (четыре кубика) или нажми Cmd / Ctrl + Shift + X.
  • В поиске введи claude, выбери официальное расширение от Anthropic (значок verified, миллионы установок) → Install.
  • После установки нажми на иконку Claude в сайдбаре — откроется браузер, авторизуйся своим аккаунтом из шага 4.
  • Вернись в VS Code, нажми шестерёнку настроек Claude Code и выстави на максимум:
    • Permission Mode — Bypass Permissions;
    • Default Mode — Bypass Permissions;
    • Effort — Max;
    • Thinking — On;
    • Model — самая мощная доступная (Opus).
Если в настройках нет нужных пунктов

Скорее всего старая версия расширения. Открой Extensions → Claude → правая кнопка → Reload или Update. Закрой VS Code полностью (Cmd / Ctrl + Q, не просто сверни) и открой заново — настройки появятся.

Чекпоинт
В сайдбаре открыт чат с Claude Code, все пять настроек выставлены на максимум.
7

Подключи голосовой ввод

10 мин · опционально

Печатаем со скоростью ~40 слов в минуту, говорим — ~150. Для длинных промптов это разница в разы, а формулировать мысль голосом обычно проще. Шаг можно пропустить и вернуться к нему позже — на остальной курс не влияет.

  • Скачай Wispr Flow (wisprflow.ai) или Super Whisper — на выбор, обе работают на Mac.
  • Дай программе доступ к микрофону при первом запуске.
  • Назначь горячую клавишу: зажал → говоришь → отпустил → текст сам вставляется в поле.
  • Проверка: открой чат Claude Code, зажми клавишу, скажи вслух «всем привет, проверка связи» — текст должен появиться в поле ввода.
Чекпоинт
Тестовая фраза, сказанная голосом, появилась текстом в поле ввода Claude Code.
Часть 3

Первый сайт за вечер

~50 мин

Рабочее место готово — переходим к делу. Дальше ты не пишешь код: ты объясняешь агенту, что хочешь увидеть, и правишь результат, показывая ему картинки вместо длинных описаний.

8

Попроси агента собрать первый сайт

20 мин
  • Создай на компьютере пустую папку, например мой-сайт, и открой её в VS Code: File → Open Folder.
  • Открой чат Claude Code и опиши сайт своими словами — не нужно уточнять технологии или структуру файлов, агент решит это сам.
  • Нажми Enter и подтверждай команды, которые агент будет предлагать по ходу — он объяснит каждую простыми словами перед запуском.
Промпт · первый сайтСобери мне простой одностраничный сайт-визитку. О чём сайт: [опиши в двух словах, для кого и о чём — например «мастерская по ремонту велосипедов в своём районе» или «личный блог о путешествиях»]. Нужны блоки: · шапка с названием и коротким описанием, чем занимаюсь; · 3–4 карточки с услугами, товарами или темами; · блок с преимуществами или отзывами; · контакты внизу — телефон или почта, кнопка «написать». Стиль: [опиши на свой вкус — например «спокойный, светлый, минимализм» или «яркий, дерзкий, крупные шрифты»]. Сделай так, чтобы сайт нормально выглядел с телефона. Когда всё будет готово — запусти его и скажи, как мне открыть его в браузере.
Если что-то сломалось в процессе установки

Это норма, не признак провала — просто следующее сообщение агенту. Не гугли, не пиши в поддержку: скопируй текст ошибки и отправь его в тот же чат.

Промпт · почини ошибкуУ меня вылезла такая ошибка: [вставь текст ошибки или опиши словами, что произошло] Объясни простыми словами, что это значит и почему так вышло. Если можешь исправить сам — исправляй, не спрашивай лишний раз. Если нужны мои действия — распиши их по шагам.
Чекпоинт
В браузере на локальном адресе открывается сайт с текстом и блоками, о которых ты просил.
9

Доводи сайт скриншотами — минимум 3 круга

30 мин

Описывать дизайн словами — долго и неточно. Быстрее показать: скриншот переносит цвета, шрифты и отступы за один раз, там, где текстом это ушло бы на абзац.

  • Сделай скриншот в буфер обмена: Cmd + Shift + Ctrl + 4 на Mac (выдели область) или Win + Shift + S на Windows.
  • Вставь его прямо в чат Claude Code — Cmd / Ctrl + V — и коротко напиши, что не так: «вот тут кнопка слишком крупная», «подвинь блок с отзывами выше», «сделай отступы просторнее».
  • Повтори цикл скриншот → правка → снова скриншот минимум три раза подряд — с первого раза идеально не бывает, и это ожидаемо.
Тот же приём работает и наоборот: увидел красивый сайт в интернете — сделай его скриншот, вставь в чат и напиши «укради этот стиль оформления, только под мою тему». Быстрее любого словесного описания.
Чекпоинт
Сделано минимум 3 круга правок по скриншотам, и текущая версия сайта заметно лучше самой первой.
Итог

Чек-лист вечера

отмечай ✓
Дальше

Вайб-кодинг по-взрослому

Рабочее место готово, первый сайт есть. Дальше — как вайб-кодить не игрушки, а вещи, которые продолжают работать на тебя без твоего участия: контекст-инжиниринг, автономные задачи по расписанию и правило «10 попыток → 1 идеальная» в деле.

Открыть Вечер 2 — курс 990 ₽Мой кабинет
Вайбкодинг — первые шаги · Вечер 1