Сделать сайт с помощью Claude можно за вечер, если начать с одной страницы и одного действия: например, формы заявки. Я, Арина Михална, для такого старта сначала собираю простой лендинг, а затем решаю, нужна ли ему база, личный кабинет или интеграции. Это и есть граница между страницей-визиткой и MVP, который уже выполняет рабочую задачу.
Что сделать с помощью Claude сначала: лендинг или MVP
Разница простая: лендинг объясняет предложение и собирает обращение. MVP — минимальная версия продукта, которая уже выполняет одну полезную функцию. Например, клиент регистрируется, отправляет заявку, а владелец видит её в панели.
Не надо выбирать между «сайт за вечер» и «разработка на полгода». Сначала собери минимальный сценарий и проверь его. Вот как меняется объём работы:
| Задача | Claude может подготовить | Где нужен человек |
|---|---|---|
| Лендинг услуги | Структуру, тексты, компоненты, адаптивную вёрстку | Проверить обещания, визуальный стиль и отображение на телефоне |
| Форма заявки | Поля, проверки, обработчик и подключение к выбранному сервису | Уточнить, куда уходят данные, и протестировать отправку |
| Регистрация и роли | Черновую схему пользователей, экран входа и проверки доступа | Проверить сценарии доступа, восстановление пароля и защиту данных |
| Контентная часть | Страницы, повторяемые блоки, подключение к CMS по заданию | Выбрать CMS и правила публикации, проверить роли и резервное копирование |
| Платежи и сложные интеграции | Подготовить код по документации и описанию API | Разработчику стоит проверить безопасность, ошибки оплаты и обработку исключений |
На лендинг можно идти сразу. Для регистрации, базы, платежей и личного кабинета сначала распиши пользовательский сценарий: кто что делает, какие данные видит и что происходит при ошибке. «Добавь авторизацию» — слишком короткое ТЗ. Claude может сделать экран входа, но один экран ещё не доказывает, что доступы устроены правильно.
Я, Арина Михална, начинаю с вопроса: что должен сделать первый посетитель? Записаться, купить, отправить заявку? Если ответа нет, никакая красивая вёрстка страницу не спасёт.
Опиши план сайта для {{услуга или продукт}}. Аудитория:
{{кто и в какой ситуации}}.
Главное действие посетителя: {{заявка / запись / покупка}}.
Сначала перечисли страницы и блоки, затем опиши путь
пользователя.
Отдельно укажи, какие данные нужны, где они хранятся и какие
части требуют
внешнего сервиса. Пока не создавай файлы и не подключай
интеграции.Claude создать лендинг: сначала каркас, потом функция
Когда план понятен, попроси Claude Code создать страницу по блокам: первый экран, описание услуги, доказательства, ответы на вопросы, форма. Для проектов с несколькими страницами разделение на компоненты помогает менять отдельные части, не переделывая всё подряд.
Вместо одной команды «сделай красиво» давай короткие задачи: создай каркас; покажи первый экран; добавь мобильную версию; подключи форму; проверь ошибки. После каждого шага проси перечислить изменённые файлы и объяснить, как проверить результат.
Если ты только начинаешь работать в терминале, сначала посмотри материал про Claude Code для непрограммистов. Claude Code работает с файлами проекта через командную строку, поэтому важно понимать, где лежат исходники и что именно меняется.
Сначала изучи текущую папку и предложи план файлов для
сайта.
Раздели повторяемые блоки интерфейса, страницы, интеграции с
API и стили.
Не создавай лишние абстракции. Для каждого файла объясни его
назначение.
После моего подтверждения создай только каркас и покажи, как
запустить проект.У страницы заявки и MVP с аккаунтами разная цена ошибки. Для первой достаточно проверить, что форма отправляется и письмо или запись действительно приходит. Для личного кабинета добавляются состояния пользователя, права доступа, ошибки и восстановление доступа. Тут «у меня открылся экран» — ещё не тест.
Как перейти от формы к рабочему MVP
Представим задачу: посетитель оставляет имя, почту и сообщение. Владелец должен увидеть заявку, а пользователь — получить подтверждение. Это уже сценарий, а не просто поле на странице.
До подключения базы уточни четыре вещи: какие поля собираем, кто может смотреть заявки, куда отправляется подтверждение и что делать при ошибке. Попроси Claude предложить структуру данных и показать путь заявки от формы до места хранения. Не начинай с реальных ключей доступа.
Нужно принять заявку с полями name, email и message.
Опиши путь данных от отправки формы до хранения в выбранной
базе.
Предложи таблицу, проверки обязательных полей и обработку
ошибок.
Отдельно перечисли правила доступа: кто может создавать
заявку и кто может
её читать. Секреты не вставляй в код, назови нужные
переменные окружения.
Сначала дай план, код пока не меняй.Если проект использует Supabase, попроси Claude работать по официальной документации Supabase. Для публикации проекта и переменных окружения ориентируйся на документацию выбранного хостинга, например Vercel. Сам факт, что код собрался, не подтверждает, что правила доступа настроены правильно.
Форма — только первый кусок MVP: теперь важно, чтобы заявка попадала куда нужно и не открывала чужие данные.
В канале «А.М. решает вопросы» я показываю рабочие примеры с Claude и разбираю, где красивый результат ещё требует проверки.
Посмотреть канал и забрать идеи для своего проектаКакая архитектура помогает расширять сайт
Не нужно строить сложную систему ради одной страницы. Но когда появляются формы, база и внешние сервисы, полезно разделять интерфейс и работу с данными. Тогда, например, смена CRM не требует переписывать кнопку отправки и весь экран целиком.
Для небольшого проекта попроси Claude объяснить структуру до изменений. Ориентир может быть таким:
src/
components/ — повторяемые блоки интерфейса
pages/ — страницы сайта
lib/ — функции для API и внешних сервисов
styles/ — общие стили и переменныеНазвания и папки зависят от выбранного шаблона проекта. Не нужно переносить эту схему в каждый проект механически. Смысл в том, чтобы интерфейс, страницы и интеграции не оказались случайно перемешаны в одном файле.
Попроси добавить README с командами запуска, описанием папок и названиями нужных переменных окружения. А правила проекта можно записать в CLAUDE.md: Claude Code читает этот Markdown-файл при запуске новой сессии. Например, укажи в нём не менять интеграции без подтверждения и не размещать секреты в исходниках.
Если понадобится изменить правила проекта, полезно разобраться, как устроен файл CLAUDE.md. А когда логика разрастается на несколько самостоятельных частей, сначала зафиксируй сценарии и границы доступа, а потом проси модель менять код.
Где Claude справится, а где нужен разработчик
Для первого лендинга можно собрать страницу самостоятельно и проверить её на телефоне. Для MVP с регистрацией уже нужны тестовые сценарии и понятные правила доступа. Платежи, персональные данные и интеграции, от которых зависит работа бизнеса, стоит отдельно поручить разработчику на проверку.
В документации Claude Code описана работа с файлами, командами и тестами. Это помогает быстрее пройти от плана к рабочей версии, но не снимает ответственности за то, что именно запущено и какие данные обрабатываются.
Если нужен только лендинг, не усложняй его базой и регистрацией «на будущее». Если же сайту предстоит расти, заранее отдели повторяемые блоки и интеграции, а каждую новую функцию добавляй отдельным шагом. Подробности работы с самим инструментом есть в материале как использовать Claude Code.
Что проверить перед публикацией
Перед тем как привести на страницу первых людей, пройди короткий сценарий руками:
- форма отправляет заявку и показывает понятный результат;
- на странице нет тестовых текстов и незаполненных заглушек;
- сайт читается на телефоне, кнопки и ссылки работают;
- данные заявки видит только тот, кому положено;
- секреты не попали в исходники и публичные файлы;
- для ошибок интеграций есть понятное поведение, а не пустой экран.
Этот список можно дать Claude и попросить проверить проект по пунктам. Но если речь о регистрации, платежах или данных клиентов, одной проверки кода недостаточно: пройди сценарий как пользователь и попроси разработчика оценить критичные места.
По материалам: документация Claude Code, документация Supabase, документация Vercel.
Начни с одной страницы и одной функции: оффер плюс форма или понятный пользовательский сценарий. Так ты увидишь, где Claude действительно ускоряет работу, а где проекту нужен отдельный взгляд на данные, доступы и интеграции. В канале «А.М. решает вопросы» разбираю такие рабочие ситуации и показываю, что происходит между первым промптом и результатом. Зайти в канал и посмотреть разборы
