Как сделать сайт с помощью ИИ без знания кода

Как новичку сделать первый сайт с помощью ИИ без знания кода: что такое вайбкодинг, как работать в Claude Code и Codex, что писать агенту и где обычно застревают.

Простой сайт с помощью ИИ без знания кода можно собрать самому, без курса программирования и без подрядчика. Вы описываете задачу обычными словами, а ИИ-агент пишет код, раскладывает файлы по папкам и правит страницу по вашим замечаниям. Такой способ работы называют вайбкодингом.

Обычно новичок упирается в практические вещи: какой инструмент поставить, что написать в первом сообщении и как не утонуть в правках. Ниже - порядок действий для первого сайта на примере Claude Code и Codex.

Если удобнее идти по готовой инструкции, у нас есть гайд «Вайбкодинг с нуля: Claude Code и Codex». О нём подробнее ближе к концу, а сначала о самом процессе.

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

Вайбкодинг - это разработка, в которой вы ставите задачу, а код пишет ИИ. Учить синтаксис HTML или JavaScript не нужно. Вы объясняете, какой сайт хотите, смотрите результат и говорите, что поправить: «сделай кнопку заметнее», «добавь блок с ценами», «на телефоне текст налезает на картинку».

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

Для первого проекта это подходит хорошо: лендинг, сайт-визитка, страница услуги или портфолио. Задача понятная, результат сразу видно в браузере, а ошибку можно поправить следующим сообщением.

Claude Code и Codex для новичка: что это и как с ними работать

Оба инструмента - ИИ-агенты для работы с кодом. Claude Code делает компания Anthropic, Codex - OpenAI. Принцип у них общий: вы открываете папку проекта, пишете задачу, агент читает файлы, предлагает изменения и вносит их.

В приложении или через VS Code

Работать с агентом можно двумя способами. Первый - в приложении: окно чата, в котором агенту доступна ваша папка с проектом. Для новичка это самый спокойный вариант, на экране нет ничего лишнего. Второй - через VS Code, бесплатный редактор кода. Там рядом с чатом видны сами файлы, и со временем вы начнёте понимать, что именно агент меняет и где.

В гайде разобраны оба пути, так что можно начать с того, который кажется проще, и перейти на второй позже.

Какой инструмент выбрать

Для первого сайта разница между ними небольшая. Оба понимают задачи на русском языке и справляются с одностраничным сайтом. Берите тот, к которому у вас уже есть доступ или который проще оформить. Переключиться потом несложно: умение ставить задачу агенту переносится из одного инструмента в другой.

Что подготовить перед первым вечером

Техническая часть занимает меньше времени, чем кажется. На результат сильнее влияет то, насколько ясно вы понимаете, какой сайт хотите. Перед стартом соберите:

  • доступ к Claude Code или Codex, установленное приложение либо VS Code;
  • пустую папку на компьютере, где будет лежать проект;
  • тексты: кто вы, что предлагаете, сколько это стоит, как с вами связаться;
  • два-три сайта, которые вам нравятся, чтобы показать агенту желаемый стиль;
  • фотографии и логотип, если они есть.

Тексты лучше написать заранее, хотя бы черновиком. ИИ сочинит их и сам, но получатся общие слова, которые подойдут любой компании. Конкретика про ваш продукт есть только у вас.

Как сделать сайт с помощью ИИ без знания кода: порядок работы

Последовательность почти всегда одна и та же. Её полезно держать в голове, даже если вы идёте по готовой инструкции.

Опишите задачу целиком

Начните с подробного первого сообщения. Напишите, для кого сайт, какие на нём блоки, какой нужен стиль и что должен сделать посетитель: позвонить, оставить заявку или написать в мессенджер. Чем меньше агенту приходится додумывать, тем ближе первая версия к тому, что вы себе представляли.

Сначала план, потом код

Попросите агента сначала описать структуру сайта и писать код только после вашего согласия. Так ошибки в понимании задачи всплывут ещё в описании, а не в готовой странице.

Проверяйте результат в браузере

Агент создаст файлы, и страницу можно открыть в браузере прямо на своём компьютере. Смотрите на неё глазами посетителя. Отдельно сузьте окно до ширины телефона: многие проблемы с вёрсткой видны только на узком экране.

Давайте правки небольшими порциями

Если отправить пятнадцать замечаний одним сообщением, агент легко выполнит часть и пропустит остальные. Лучше отправлять по две-три правки и проверять каждую. Если что-то сломалось, так проще понять, какая правка виновата, и попросить вернуть как было.

Промпты: что писать агенту, чтобы получить нужный результат

Промпт - это ваше сообщение ИИ. От формулировки зависит больше, чем от выбора между Claude Code и Codex. Слабый промпт звучит как «сделай красивый сайт для кофейни». Сильный описывает, что именно должно быть на странице:

«Сделай одностраничный сайт кофейни. Блоки: первый экран с названием и кнопкой бронирования столика, меню с ценами, фото зала, контакты с картой. Стиль тёплый, светлый фон, много свободного места. Сайт должен хорошо смотреться на телефоне. Сначала покажи структуру, код пиши после моего подтверждения».

Во втором случае агенту не нужно угадывать, и первая версия получается ближе к задуманному. Такие формулировки удобно держать под рукой как шаблоны и менять под свой проект. В гайде по вайбкодингу собрано 25 готовых промптов, в которые остаётся подставить свои данные.

Где новички застревают чаще всего

Первая ловушка - слишком общая задача. На просьбу «сделай сайт» агент выдаст шаблон, похожий на тысячи других, и дальше придётся переделывать почти всё. Проще потратить пятнадцать минут на подробное описание в начале.

Вторая - желание сделать всё за раз: личный кабинет, оплату, блог и рассылку в первом же проекте. Для первого вечера хватит одной понятной страницы. Сложные функции лучше добавлять, когда вы освоите базовый цикл «задача, результат, правка».

Третья - страх что-то сломать. Агент меняет файлы, и иногда правка портит то, что раньше работало. Так бывает у всех. Попросите агента откатить последнее изменение или объяснить, что он сделал. Со временем стоит научиться сохранять версии проекта, а для первого сайта хватит привычки проверять страницу после каждой правки.

Четвёртая - публикация. Сайт на вашем компьютере и сайт в интернете по адресу вашей компании - разные этапы. Для публикации нужны хостинг и домен. Агент подскажет шаги, но это отдельная задача, к которой стоит переходить, когда страница уже готова.

Что входит в гайд «Вайбкодинг с нуля» и сколько он стоит

Гайд написан для тех, кто никогда не программировал и хочет сделать первый сайт с ИИ за вечер. В нём разобраны Claude Code и Codex, работа в приложении и через VS Code, и есть 25 готовых промптов. Формат - PDF и онлайн-версия, текст удобно держать открытым рядом с окном агента.

Гайд стоит 990 ₽. Первая глава бесплатная: её можно прочитать на странице гайда и до оплаты решить, подходит ли вам такой формат.

Для тех, кто захочет пойти дальше, на той же странице есть дополнительные материалы. Скиллы в них - готовые инструкции для ИИ-агента под определённый тип работы.

  • Набор скиллов для дизайна и кода - 2 990 ₽.
  • Набор скиллов для видео-контента - 4 990 ₽.
  • Комплект «всё сразу»: гайд, скиллы для кода и видео-скиллы - 6 990 ₽. По отдельности те же три продукта стоят 8 970 ₽.
  • Консультация Антона Коновалова, 1 час - 10 000 ₽.

Оплата проходит через Т-Кассу, продавец - ООО «Недиджитал 3.0». После оплаты открывается доступ к купленному материалу.

Частые вопросы

Можно ли сделать сайт с помощью ИИ, если я совсем не знаю код?

Да. В вайбкодинге код пишет агент, от вас нужны понятное описание задачи и проверка результата. Гайд «Вайбкодинг с нуля» рассчитан на людей без опыта программирования.

Что выбрать новичку: Claude Code или Codex?

Для первого сайта разница небольшая. Выбирайте инструмент, к которому у вас уже есть доступ. В гайде разобраны оба, в приложении и через VS Code.

Нужно ли отдельно платить за Claude Code и Codex?

Да, гайд и сами инструменты - разные покупки. Для работы нужна подписка Claude Pro или ChatGPT Plus, её оформляют у Anthropic или OpenAI по их условиям. Официально Claude и ChatGPT в России не работают, как люди оплачивают подписку и какие тут риски, разобрано в третьей главе гайда.

В каком формате гайд и сколько он стоит?

Гайд доступен в PDF и в онлайн-версии, стоит 990 ₽. Первую главу можно бесплатно прочитать на странице гайда до покупки.

Что делать, если нет времени собирать сайт самому?

Вайбкодинг хорош, чтобы сделать первый сайт своими руками, проверить идею или собрать простую страницу. Если сайт нужен для бизнеса и времени разбираться нет, его можно заказать под ключ в агентстве Nedigital.

С чего начать

Для первого сайта с ИИ нужны доступ к Claude Code или Codex, ясное описание того, что вы хотите получить, и привычка давать правки небольшими порциями. Код напишет агент, ваша работа - ставить задачу и проверять результат.

Если хотите пройти этот путь по шагам, с готовыми промптами и разбором обоих инструментов, откройте гайд «Вайбкодинг с нуля» и начните с бесплатной первой главы.