🎯 О чём этот конспект: Разбор профессиональных техник работы в IDE Cursor, включая использование режима Plan, визуальный программинг по скриншотам, автоматизацию Git-процессов и управление контекстом LLM. В видео демонстрируются скрытые возможности второй версии Cursor для создания сложных фич с минимальным написанием кода вручную.

👤 Кому будет полезно: Вайбкодерам, разработчикам на Next.js/React и всем, кто использует AI-агентов для создания IT-продуктов и хочет делегировать нейросети проектирование и ревью кода.

✨ Что получите: Вы научитесь использовать концепции TDD и SDD внутри Cursor, настраивать кастомные команды для автоматизации рутины (коммиты, ревью) и эффективно управлять лимитами контекста Claude 3.5 Sonnet.

1. Концепция TDD (Test Driven Development) через AI

Контекст: При создании сложных функций AI может допускать логические ошибки. Чтобы гарантировать работоспособность кода, эффективнее сначала заставить Cursor написать тесты, а затем реализовывать функционал до тех пор, пока все тесты не станут «зелеными». Это избавляет от бесконечных правок в будущем и гарантирует, что краевые кейсы (edge cases) учтены.

Выгода: Сокращение времени на отладку и получение на 100% рабочего кода с первой итерации.

Как применить:

• Шаг 1: Формулировка задачи — Откройте Composer (Ctrl+I) или Chat (Ctrl+L).
• Шаг 2: Использование промпта — Введите запрос, требующий сначала создать тесты.

Напиши мне функцию для [описание задачи, например: преобразования Markdown в HTML]. 
Сначала напиши набор тестов (unit tests), учитывая все нюансы, а затем реализуй саму функцию и дорабатывай код, пока все тесты не пройдут успешно.

Результат: Cursor создаст тестовый файл, выберет библиотеку (например, Jest), пропишет 20+ тест-кейсов и выдаст финальный отчет: «All tests passed».

2. Глобальные правила (Rules for AI) и локализация

Контекст: По умолчанию Cursor может отвечать на английском или использовать избыточные вежливые фразы. Через настройки можно задать системный промпт, который будет определять поведение AI во всех чатах, включая язык ответов и стиль кодинга.

Выгода: Экономия времени на чтение лишнего текста и удобство работы на родном языке.

Как применить:

• Шаг 1: Настройка — Перейдите в Settings -> General -> Rules for AI.
• Шаг 2: Добавление правила — Нажмите Add и впишите инструкцию.

Always answer in Russian language. 
Be concise, avoid unnecessary pleasantries, and focus on providing clean, production-ready code.

Результат: Все ответы агента и чата будут приходить на русском языке в лаконичном стиле.

3. Режим Plan и концепция SDD (Spec Driven Development)

Контекст: Вместо того чтобы сразу просить AI писать код («Act»), лучше использовать режим «Plan». Это позволяет сначала спроектировать архитектуру, выбрать стек и обсудить детали реализации. Это предотвращает ситуацию, когда AI начинает писать код, не понимая до конца ваши требования.

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

Как применить:

• Шаг 1: Переключение режима — В окне Composer выберите режим Plan (вместо Act).
• Шаг 2: Описание идеи — Введите высокоуровневый запрос.
• Шаг 3: Итерация — Ответьте на уточняющие вопросы AI (выбор API, библиотек, способа рендеринга).
• Шаг 4: Реализация — После утверждения MD-плана нажмите кнопку Build.

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

4. Визуальный программинг по скриншотам

Контекст: Современные модели (Claude 3.5 Sonnet) отлично понимают изображения. Вы можете взять скриншот любого понравившегося интерфейса и попросить Cursor воспроизвести его в вашем проекте, используя текущий стек (например, Tailwind CSS).

Выгода: Мгновенное создание UI/UX на основе референсов без ручного копирования стилей.

Как применить:

• Шаг 1: Скриншот — Сделайте скриншот нужного элемента или сайта.
• Шаг 2: Загрузка — Вставьте изображение прямо в чат Cursor (Ctrl+V).
• Шаг 3: Промпт — Попросите адаптировать текущий код под дизайн на картинке.

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

Результат: AI перепишет CSS/Tailwind классы и структуру компонентов, максимально приблизив их к визуальному референсу.

5. Использование внутреннего браузера и селектора элементов

Контекст: Во второй версии Cursor появился встроенный браузер. Он позволяет не только видеть результат, но и выбирать конкретные элементы интерфейса для редактирования.

Выгода: Точечное редактирование UI без необходимости искать нужный файл и строку кода вручную.

Как применить:

• Шаг 1: Открытие браузера — Запустите предпросмотр проекта внутри Cursor.
• Шаг 2: Выбор элемента — Нажмите на иконку «указателя» в браузере и кликните на нужный элемент (например, кнопку или график).
• Шаг 3: Промпт для правки — Элемент автоматически попадет в контекст чата.

Поменяй шрифт в этом блоке на Roboto и сделай красивое форматирование для отображения цены (добавь разделение разрядов).

Результат: AI мгновенно внесет изменения именно в тот компонент, на который вы указали.

6. Управление контекстом: Duplicate и Summarize

Контекст: Длинные диалоги забивают контекстное окно (лимит токенов), из-за чего AI начинает «тупить» или забывать начало разговора. В Cursor есть инструменты для оптимизации этого процесса.

Выгода: Сохранение истории работы при очистке памяти для новых задач.

Как применить:

• Вариант А (Duplicate): Нажмите три точки в чате -> Duplicate Chat. Это создаст копию текущей сессии, где можно продолжить эксперименты, не портя основной чат.
• Вариант Б (Summarize): Если чат стал слишком длинным, введите команду:

/summarize

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

7. AI Code Review через контекст Git

Контекст: Вы можете использовать Cursor как опытного тимлида для проверки вашего (или сгенерированного AI) кода перед коммитом.

Выгода: Обнаружение неиспользуемых зависимостей, потенциальных багов и проблем с производительностью.

Как применить:

• Шаг 1: Обращение к Git — В чате используйте символ @ и выберите Git (Diff with Main).
• Шаг 2: Промпт для ревью — Попросите проанализировать изменения.

@Git (Diff with Main) Изучи все изменения в текущей ветке. Дай знать, что можно улучшить, есть ли потенциальные проблемы или неиспользуемый код.

Результат: Список критических замечаний и предложений по оптимизации (например, «отсутствует обработка ошибок в API-запросе»).

8. Автоматизация Git-команд через .cursor/commands

Контекст: Вы можете создавать собственные команды для автоматизации рутинных действий, таких как написание осмысленных коммитов или создание Pull Request.

Выгода: Стандартизация работы с репозиторием и экономия времени на описании изменений.

Как применить:

• Шаг 1: Создание структуры — Создайте папку .cursor/commands/.
• Шаг 2: Создание файла команды — Создайте файл commit.md.
• Шаг 3: Описание логики — Впишите инструкцию для команды.

Проанализируй все изменения в текущей ветке и сделай git commit с подробным описанием того, что было сделано, следуя правилам Conventional Commits.

• Шаг 4: Вызов — В чате введите /commit.

Результат: AI сам проанализирует изменения, сформулирует текст и выполнит команду git commit.

FAQ

В: Как понять, сколько памяти (контекста) уже израсходовано в текущем чате?

О: В окне чата (если его немного растянуть) внизу отображается индикатор в процентах. Например, для модели Claude 3.5 Sonnet лимит составляет 200 000 токенов. Если индикатор выше 70-80%, рекомендуется создать новый чат или использовать /summarize.

В: Можно ли откатить изменения, если AI-агент испортил проект в режиме Act?

О: Да, в Cursor есть встроенная система контроля версий для агента. В окне Composer/Chat доступна кнопка «Undo» или «Reject», которая возвращает файлы к состоянию до выполнения последнего промпта.

В: Где лучше прописывать правила: в глобальных настройках или в файле .cursorrules?

О: Глобальные настройки (Rules for AI) подходят для общих предпочтений (язык, краткость). Файл .cursorrules в корне проекта лучше использовать для специфических инструкций: используемые библиотеки, архитектурные паттерны или правила именования, принятые в конкретной команде.

В: Как заставить Cursor использовать конкретную версию библиотеки?

О: Лучше всего использовать символ @ и добавить файл package.json в контекст чата, а в промпте явно указать: «Используй только те версии библиотек, которые указаны в @package.json».

В: Работает ли визуальный селектор элементов с внешними сайтами?

О: Визуальный селектор лучше всего работает во внутреннем браузере Cursor с вашим локальным проектом (localhost), так как он имеет прямой доступ к маппингу между DOM-элементами и исходным кодом в вашем редакторе.

Конспект создан на основе видео «Cursor AI: 10 лайфхаков для продуктивной работы» канала [itbeard / Эййти Борода]. Все права на оригинальный материал принадлежат авторам. Источник: https://www.youtube.com/watch?v=NyZQ31Q_L_Y