Как создать стартап за 38 часов: полный гайд от идеи до продакшена с ИИ

Это видео с YouTube-канала разработчика Олега, но мы его посмотрели за вас и составили подробную инструкцию по созданию микро-стартапа с помощью AI-инструментов.

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

Разработчик решил пойти другим путём: взять проблему, которая не выглядит слишком громоздкой, собрать прототип за несколько вечеров и допилить до MVP за пару недель. В этот раз он устроил себе челлендж — создать приложение за несколько подходов, записав весь процесс на видео.

В итоге справился за 6 дней и 38 часов суммарной работы. Что же мы сделали инструкцию, а вы в итоге посмотрите, как он собрал ultrapreview.app.

Проблема и решение

В качестве проблемы автор выбрал создание превью для YouTube. Эти картинки нужны для итогового выхлопа с видео, но их сложно создавать в Photoshop — нужны серьёзные навыки и много времени на склеивание элементов.​

Однако в последнее время вышло много нейронок, которые упрощают работу с изображениями. Например, Magnific AI показала, насколько легко теперь можно редактировать картинки. Поэтому решение — простой сервис для создания превью с помощью AI-инструментов.

Критерии завершённого продукта

Завершённый сервис для автора — это решение, которое доступно для пользователей, выполняет свою функцию, имеет монетизацию и стабильно работает. Сервис должен работать без участия разработчика как минимум неделю и в теории окупаться.​

Этапы разработки

Документация и планирование (40 минут)

Первые 35 минут автор исследовал доступные по API модели в сервисе Fal.ai — какие есть и как с ними работать в коде. Для простоты остановился на одной модели Gemini 2.5 Flash, взяв её Text-to-Image и Image-to-Image версии.​

Параллельно писал документацию с помощью ChatGPT-4 Thinking, обозначая ключевые фичи и идеи. Для написания документации выбор моделей не критичен — берите любую из передовых: GPT, Claude или Gemini.​

Ещё 5 минут ушло на разбивку документации на шаги — стадии приложения, на каждой из которых оно будет запускаться и работать, но возможно ещё не иметь всех функций. Целью каждого этапа было добавление новой фичи с сохранением стабильной работы.​

GPT и другие нейронки часто загромождают документацию бесполезными примерами кода, чрезмерно сложным стеком и ненужными функциями. Это всё нужно ревьюить и чистить самостоятельно.​

Стек технологий

Автор использовал знакомый стек:​

• Backend: Python + FastAPI
• Frontend: Next.js + Tailwind
• Специфичные библиотеки: React Konva (для работы с Canvas как в Photoshop — слои, текст, картинки)

Инструменты разработки

Для написания кода использовался Claude Code со стандартным Sonnet 4. Через пару часов автор упёрся в лимит и купил подписку Max за 100 долларов, что позволило местами использовать Claude Opus.​ Но с ним нужно быть внимательным, так как на этой модели очень легко упереться в ограничения Claude по количеству запросов.

В основном он использовал дефолтный тариф, где первые 20 запросов тратится на Claude Opus, а затем Claude переключается на Sonet.

Claude Opus хорош для спидранов, так как лимиты заканчиваются редко и нет скрытых режимов с оплатой за каждый токен.​

Базовый прототип (10 часов)

Разработка базового прототипа заняла примерно 10 часов. С функционалом серьёзных проблем не было, но временами всплывали хитрые фронтенд-баги, так как приложение сильно завязано на тонкую работу в браузере.​

Прогресс по часам:

• 1 час: Базовый холст, импорт и экспорт изображений​
• 2 часа: Создание проектов, выбор для редактирования, сохранение состояния на бэкенде​
• 5 часов: Функция удаления заднего фона​
• 5,5 часов: Генерация изображений (30 минут)​
• 6 часов: AI-редактирование (40 минут)​
• 8 часов: Базовые текстовые слои (2 часа)​
• 9 часов: Изменение текстовых слоёв с помощью AI (1 час)​
• 10 часов: AI-генерация на основе картинок из нескольких слоёв (40 минут)​

Прототип работал ужасно, имел кучу багов, но выполнял функцию. Можно было управлять слоями, генерировать и редактировать AI-изображения, но превью слоёв были огромными, не было нормальной индикации генерации, странно работали кнопки Undo/Redo/Clear.

5 главных правил работы с AI при разработке

Правило 1: Выбирайте знакомые технологии

Выбирайте знакомые языки и фреймворки. Попытки вайбкодить на неизвестных стеках всегда превращаются в нечитаемую кучу кода. Если не знаете ничего, начните со стека Python + FastAPI + Next.js + Tailwind.​

Правило 2: Избавляйтесь от сложных фичей

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

Правило 3: Просите то, что сами понимаете

Просите нейронку сделать только то, что вы сами понимаете, как можно сделать — конкретно и пошагово. Если вы можете нарисовать блок-схему со всеми ветвлениями и условиями, только тогда делегируйте разработку нейронке. Иначе с 90% вероятностью она сделает что-то другое или не справится.​

Правило 4: Фиксируйте через Git

Фиксируйте корректно работающие состояния проекта с помощью Git. Автор фиксирует каждый успешно разработанный шаг в виде коммита. Каждый раз, когда вызываете LLM и есть что терять — делайте коммит.​

Обычно автор коммитит промежуточные стадии, затем откатывает их через git reset soft HEAD и создаёт один общий коммит с описанием реализованного шага. Если шаг не удался — кнопка Rollback, раскоммитив неудачные изменения.​

Правило 5: Используйте агенты и промпты повторно

В Claude Code есть фича Agents — отдельно работающие чаты со своими инструментами, доступами и контекстом. Автор использовал два кастомных агента: Frontend и Backend Minimalist, в которых описал инструкции по работе с кодом. Попросил делать только минималистичные и простейшие решения без усложнения.​

Также автор не даёт Claude запускать и перезапускать сервисы, чтобы не возникало путаниц. Иначе нейронка часто натыкается на конфликты в портах и бесконечно запускает копии проекта. Лучше все запуски делать вручную.​

Авторизация (4,5 часа)

На этом этапе программа не имела юзеров и форм входа. В качестве логина автор всегда использует авторизацию через Google-аккаунт — она относительно простая в настройке, не нужно слать email, плюс надёжная в плане лимитов.​

Базовую работающую авторизацию получилось создать за 4,5 часа. Во время разработки автор заметил, что сидит на чистом React без Next.js, поэтому потратил время на рефакторинг фронтенда. Next.js нужен для удобного управления страницами и их адресами.​

Система кредитов и лимитов (1 час)

Важная часть подобных сервисов — грамотное управление кредитами и лимитами пользователей. Автор создал таблицу Credits, куда начисляются квоты после пополнения средств. Эти квоты сверяются с успешно завершёнными AI-генерациями для вычисления баланса пользователя.​

Три ключевых момента по лимитам:

1. Каждый запрос на генерацию должен проверять баланс пользователя на стороне бэкенда, чтобы минимизировать злоупотребление​
2. Баланс должен проверяться на стороне фронтенда, особенно когда его не хватает, чтобы показать пользователю сообщение о пополнении​
3. Отображение актуального баланса на фронтенде, чтобы юзер понимал, сколько генераций осталось​

На реализацию системы лимитов ушёл примерно час, и проблем с ней в дальнейшем не возникало — она оказалась надёжной.​

Интеграция платежей (2-3 часа)

Как работают оплаты

Пользователь выбирает тариф и жмёт «Оплатить». Frontend шлёт запрос на backend с ID пользователя и ID тарифа. Backend идёт к платёжному провайдеру, передавая сумму, валюту, ID пользователя или операции. В ответ провайдер возвращает ссылку для оплаты.​

Когда юзер совершает платёж, провайдер делает обратный вызов бэкенда (webhook или callback). В этом вызове приходит ID оплаты, статус платежа, ID пользователя, ID тарифа или сумма. Исходя из этих параметров, backend пополняет виртуальный баланс — докидывает запись в таблицу Credits.​

Самый главный фокус — надёжность. Нужно внимательно просматривать код, изучать алгоритм, пока не поймёте каждую строчку и логику. Без такого подхода легко напороться на дыры в безопасности.​

В качестве платёжного провайдера автор использовал LavaTop — у них просто получить доступ к API без сложных верификаций. На реализацию базового кода ушёл час, плюс ещё час-два позже на исправление и отладку.​

Дизайн (7 часов)

Автор сделал несколько попыток выработать нормальный стиль сайта. Самый удачный подход получился, когда он нашёл референсы на Pinterest и закинул примеры картинок в GPT.​

Попросил накидать два артефакта:​

1. Стайл-гайд для дизайнера с описанием цветов, шрифтов и основных подходов
2. Пример свёрстанной страницы с различными элементами, соответствующими первому гайду

Эти файлы использовались как инструкция для имплементации дизайна в код.​

Выводы по дизайну

Первое: Писать ChatGPT "сделай крутой дизайн" не работает. Он рисует средний заезженный сайт. Лучше кидать референсы в виде картинок — это даёт более уникальные результаты.​

Второе: Оформление сложно применить ко всему сайту в один промпт. Нейронка всегда что-то упускает. Лучше делать это постранично.​

На создание и применение дизайна ушло 7 часов — много из-за того, что автор пробовал разные стили.​

Деплой на сервер

Docker и Docker Compose

Самая важная вещь для деплоя — Docker. Docker — это что-то вроде виртуальной машины, которая запускает в себе любые программы. В дополнение автор берёт Docker Compose, чтобы запускать целые связки программ: backend, frontend, базу данных.​

Параметры запуска (глобальные переменные, API-ключи, секреты, пароли) хранятся в env-переменных в файле .env. На сервере лежат одни значения, на домашнем компе — другие.​

Для всех проектов автор прописывает Dockerfile, Docker Compose YAML и проверяет работу всех сервисов в Docker. Если всё работает — пуляет файлы в GitHub-репозиторий, чтобы подтянуть их на сервак.​

Выбор хостинга и домена

Автор взял бомж-сервак на 1 CPU и 4 GB оперативки на Hostinger. Локация Германия, система Ubuntu. По цене дороговато, но без проблем с верификацией и документами.​

Домен выбирал долго, остановился на ultrapreview.app — взял за 10 долларов в год на GoDaddy.

Dokploy для раскатки

Для раскатки Docker Compose на сервере автор использовал новую для него штуку — Dokploy. Она устанавливается просто и позволяет деплоить и запускать сервисы через интерфейс. Можно подключить GitHub, чтобы клонировать код — всё через простые кнопочки, без хардкорных конфигов.​

В разделе Environment автор заполнил секреты и пути, задеплоил через кнопку Deploy. В Dokploy легко прикрутить любой домен к нужному сервису, прописав порт и указав, что нужен HTTPS-сертификат.​

Шлифовка и отладка (6 часов)

Примерно 6 часов автор потратил на фиксинг мелких UI-моментов, багов с авторизацией и проблем с оплатой. Также значительно упростил UI, избавившись от лишних кнопок и панелей.​

В качестве вишенки на торте сделал забавную главную страницу — достаточно необычную, чтобы посетителю захотелось узнать, что внутри.​

В качестве финала прикрутил Plausible как аналог Google Analytics, а также Grafana с Loki для анализа логов на бэке. Это важно для расследования инцидентов.​

Фейлы и проблемы

Проблема с кэшированием

Во время применения дизайна автор заметил, что любые изменения кода не влияют на результат в браузере — сайт воспроизводился из кэша. После исследования конфигов обнаружил параметры кэширования. После отключения столкнулся с огромным количеством ошибок.​

Оказалось, пару коммитов назад он подчистил лишние файлы и папки, которые выглядели бесполезными. Но после отключения кэша понял, что они были нужны. Пришлось откатить через Git и разобраться, какие файлы действительно нужны. Потратил пару часов.​

Невнимательность в промптах

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

Иногда проблемы возникают из-за невнимательности. Вместо того чтобы уговаривать модель всё исправить, проще откатиться и написать нормальный понятный промпт.​

Выводы по работе с AI

Пишите подробный фидбек

Многие ленятся писать фидбек для нейронки нормально и развёрнуто. Как результат получают поверхностный код, который работает непонятно как.​

Автор предлагает писать обратную связь так, как будто она человек. Не просто закидывать копипаст ошибки на 100 строк, а описывать весь флоу: какие кнопки нажал, где вылетела ошибка. Такой подход работает хорошо.​

Пирамида разработки

Разработка микропроектов происходит в виде пирамиды. На первом этапе вы долго делаете очень ужасную полурабочую версию за 20 часов. Затем ещё 10 часов — и проект становится менее ужасным. Ещё за 5 он приобретает приятный и рабочий вид.​

Первый этап самый тяжёлый, а на последнем вайбкодинг идёт с кайфом — это просто фиксинг мелких моментов. Не нужно стараться всё сделать идеально. Лучше сделать основу, а потом пройтись по ней много раз, улучшая результат.​

Нужны базовые знания

Вайбкодинг на текущем этапе не требует знания языков программирования или фреймворков. Однако для создания чего-то большего, чем простой скрипт, требуется понимание базовых концептов: backend, frontend, JSON, API. Также нужен опыт в дебаггинге: просмотр конфигов и логов, использование DevTools в браузере. Эти навыки можно быстро развить, сделав несколько своих проектов.​

Спидран vs марафон

Спидран-подход хорош тем, что за несколько дней вы получаете готовый сервис, который решает проблему и даёт ценность пользователям. Однако разработка без перерывов более 10 часов сильно теряет в эффективности — мозг устаёт быстро.​

В вайбкодинге часто нет состояния потока, процесс выглядит иначе: 1 минута усиленных размышлений плюс 10 минут ожиданий, пока нейронка не закончит работу. По ощущениям автора, лучше спидранить проекты по 2-5 часов в день в течение недели, чтобы не перегружать мозг.​

Нейронки сейчас способны на многое — они могут писать тысячи строк рабочего кода за один промпт, запускать и останавливать программы, доставать и анализировать массивы информации. Однако чтобы делать с помощью AI что-то действительно цельное и полезное, нужно очень хорошо понимать процессы и концепции, которыми вы собираетесь манипулировать.​

Чтобы работать эффективно, теперь нужно знать всё: домен, в котором выполняете работу, AI-подходы и инструменты, их устройство, плюс общие принципы создания проектов и управления ресурсами.​

Автор создал рабочий сервис ultrapreview.app за 38 часов — с авторизацией, платежами, AI-генерацией, развёрнутый на сервере под доменом. Что он в итоге использовал? Собрали в отдельный список:

Подготовка и планирование

• Начинайте с подробной документации, но чистите её от бесполезных примеров кода и избыточных фич, которые генерирует AI​
• Разбивайте разработку на этапы, где каждый завершается работающей версией приложения​
• Выбирайте только знакомые языки и фреймворки — вайпкодинг на неизвестном стеке превращается в нечитаемую кучу кода​

Работа с AI-инструментами

• Используйте Claude Code, ChatGPT или аналоги для генерации кода, но контролируйте структуру папок, адреса, порты и библиотеки​
• Создавайте кастомных агентов с инструкциями для минималистичных решений без усложнения кода​
• Пишите подробный фидбек для нейронки, как для человека: описывайте весь флоу, какие кнопки нажали, где вылетела ошибка​
• Просите AI делать только то, что вы сами можете описать пошагово с блок-схемой​

Управление кодом

• Фиксируйте каждый успешный шаг через Git-коммиты — всегда есть возможность откатиться​
• Не давайте AI запускать и перезапускать сервисы — делайте это вручную, чтобы избежать конфликтов портов​
• При проблемах откатывайтесь и переписывайте промпт, а не уговаривайте модель исправить ошибку​

Приоритизация функций

• Избавляйтесь от сложных малоценных фичей — делайте их в последнюю очередь или вообще не делайте​
• Следуйте пирамиде разработки: 20 часов на ужасную версию, 10 часов на менее ужасную, 5 часов на приятный результат​
• Не стремитесь к идеалу сразу — сделайте основу, затем улучшайте итеративно​

Критичные модули

• Авторизация: используйте готовые решения (Google OAuth), это быстро и надёжно​
• Платежи: внимательно изучайте каждую строчку кода, понимайте логику, иначе будут дыры в безопасности​
• Лимиты: проверяйте баланс на бэкенде при каждом запросе и на фронтенде для UX​

Дизайн

• Не просите AI "сделать крутой дизайн" — это даёт заезженный результат​
• Кидайте референсы картинок из Pinterest или других источников для уникального стиля​
• Применяйте дизайн постранично, а не ко всему сайту сразу​

Деплой

• Используйте Docker и Docker Compose для воспроизводимости окружения​
• Попробуйте Dokploy для простого деплоя через UI без хардкорных конфигов​
• Настройте мониторинг (Plausible, Grafana) и логирование (Loki) сразу​

Режим работы

• Спидран-разработка по 2-5 часов в день эффективнее, чем 10+ часов без перерывов​
• Вайпкодинг не требует знания языков, но требует понимания базовых концептов: backend, frontend, JSON, API, дебаггинг​
• Эти навыки развиваются быстро через практику на нескольких проектах​

Итоговый стек для старта

• Backend: Python + FastAPI
• Frontend: Next.js + Tailwind
• AI-инструмент: Claude Code (Sonnet 4 или Opus)
• Деплой: Docker + Dokploy
• Хостинг: любой VPS (автор использовал Hostinger)
• Домен: GoDaddy или аналоги​. 

Делитесь своими комментами или результатами, или отправьте видео, которые вы хотите, чтобы мы собрали в понятную инструкцию!