Навайбкодил с Cursor AI рабочее приложение. В чём подвох?

Я устал писать бойлерплейт и базовые стили. В итоге заставил ИИ делать это за меня. Результаты, размышления и откровения — внутри.

О тексте в двух предложениях

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

Поехали вайбкодить, господа.

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

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

Поэтому, когда мне нужно было для моих учеников с реакта перенести приложение на vue, и не просто на vue, а на NUXT, я глубоко вздохнул. И решил: сам я этого делать не буду — попрошу ИИ, доверю ему все конфиги и бойлерплейты. Потому что этот проект — болванка для моих mentees, а реальной работы и так много. Рисков нет — одно удовольствие. Согласны?

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

Cursor AI

Пока только знакомлюсь. Пообещали, что заменит IDE и не придётся бегать в сторонние сетки. Проверю, так ли это. Пока могу сказать, что удобно подсказывает по ходу написания кода. Вообще, наконец-то использовать курсор подтолкнул коллега:

ChatGPT Plus

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

Perplexity

Если ChatGPT нашёл кейс, я иду в Perplexity и проверяю, не выдумка ли это (очень часто, к сожалению, выдумка). Он даёт ссылки, сравнивает, предлагает ещё смежные ресурсы. Нечто среднее между фактчекером и, прости господи, поисковиком. Удобно, если не хочешь нести и писать дичь.

Всё началось с открытия Cursor AI и всяких ручных нюансов: авторизации через Github, настройки экспорта проектов и репозиториев. Потом вручную, дабы совсем не борзеть, создал Nuxt-проект и запустил его. Ну а дальше ввёл промпт для курсора:

Перевод: Это будет пет-проект — музыкальный плеер. Будут страницы входа и регистрации, которые довольно похожи; разница — в количестве полей ввода и их функциональности. Также будет страница категорий для разных плейлистов, страница «Мой плейлист», основная страница с полным списком песен и страница «Не найдено».

Ну то есть абсолютная база: маршруты, структура, стилизация. Пока что только в компонентах. Результат классный, но не идеальный. Курсор, как и Claude, по дефолту начал пулять компоненты на Tailwind. Я такое не люблю, мне это неинтересно, за других говорить не могу.

Поэтому попросил переделать:

Перевод: Хочу, чтобы ты использовал scoped-стили, а не tailwind.

Что получили в итоге: базовую структуру проекта за пять минут. Скелет:

Визуал:

Так-то имба, сказал я себе и продолжил делать дело. Вернее, продолжил просить курсор делать дело и попутно залипал в тг и видосиках, пока ИИ там старается. Кодим? Вайбим.

Пока ждал результата, стало интересно, а какие вообще есть классные и неординарные кейсы с Cursor AI? Может, кто-то создал что-то крутое и уже даже выкатил в прод? В таких ситуациях я иду в ChatGPT и ищу для себя, но с вами тоже поделюсь.

Чат вывел меня на сабреддит, где пользователь спросил примерно то же самое, что и я: «Покажите реальные кейсы, без пет-проектов». И вот пост о реальном приложении, которое можно потрогать:

Перевод: В продакшене, несколько тысяч юзеров.

Мне кажется, большая ошибка думать, что эти инструменты годятся только для бойлерплейта и пет-проектов. <...> А ещё они пишут большую часть кода для моих рабочих задач…

О-о-о-ок. Чувствую себя Леонидом Каневским, который идёт по следу... Решил поюзать: по ссылке — конструктор для создания приложений с помощью ИИ. Ввёл вот такой промпт:

Зачем мне эта игра? Потому что такие комменты по-любому будут, ведь:

Этот текст написан специально для блога Minervasoft. Да, с рекламой, но по делу.

Minervasoft тоже занимается разработкой продуктов, которые упрощают работу сотрудникам. Один из них — помощник с генеративным ИИ Minerva Copilot. Он встраивается в любую систему компании, ищет информацию в базе знаний и подсказывает ответы в зависимости от контекста. С ним команды быстрее и эффективнее решают рабочие задачи — так же, как мы с вами быстрее пишем код благодаря Github Copilot. Вот так вот.

Вернёмся к игре. Ничего не получилось, к сожалению. Автор установил плату за одно приложение в 10 кредитов, а их нужно купить — за 30 баксов. Решил оставить эту затею, но потом в конце покажу, как реализовал её через курсор и бесплатно. И может, вы передумаете оставлять неприятные комментарии 🤫

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

Что-то там про ИИ, заметки — вот это всё. Регаемся:

Это что-то типа анализа моих мыслей. Вот так он интерпретировал мою заметку выше:

Ну и немножко зафакапил в разделе метрик: NaN — это по NaNшему:

Ладно, в целом понятно, кейсы есть, в это нужно поглубже копнуть. Продолжим делать приложение.

Пропустим создание UI и перейдём сразу к глобальному состоянию и API-запросам.

Промпты:

Ссылку скрыл, потому что так надо. Ещё тут пришлось вручную подкрутить, так как он не знает структуру данных, а прописать я её забыл (или не захотел). В любом случае вышло быстро и нехлопотно.

А дальше — имплементация pinia, код встроился в проект, но вот пакет курсор не подтянул. Это нужно было тоже докрутить:

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

На этом этапе с пошаговым промптингом можно закончить. Приложение получилось норм (просто норм), выглядело вот так:

Прикольно, но есть ошибки, поэтому нужно либо ходить причёсывать их самостоятельно, либо сидеть и промптить.

Например, на всех треках — одно состояние isPlaying. Если играет один трек, то показывает, что играют все.

А также нужно ходить докручивать стили, шрифты, нюансики. В общем, всё как всегда, только пропустили этап очень долгой подготовки к реальной работе.

Но на самом деле это я придираюсь, ведь из часа, пока скелет приложения делался, я потратил на промпты от силы минут… шесть? И честно скажу: не писать код руками, а проверять его — намного круче.

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

И да, это ощущается здорово даже на таком простецком приложении. На чём ещё тестировать ИИ: на коде с работы, что ли?

А ещё курсор написал для меня игру на питоне, где я могу спасаться от негативных комментариев на Хабре. Да-да, ту самую :)

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

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

Блог Minervasoft