Фирменный знак SuperMark'а Блог
Владимир Никишин

Cursor — мой новый редактор кода с ИИ-помощником

Cursor — мой новый редактор кода с ИИ-помощником

Cursor AI — редактор кода с интегрированным ИИ-помощником. Использует модели Claude и ChatGPT для подсказок, автоматического обнаружения ошибок и оптимизации кода. «Под капотом» — Visual Studio Code — поэтому разработчик получает знакомый интерфейс и сохраняет все свои расширения.

Возможности

Автозавершение по Tab

Самое простое. То, что может делать любой другой редактор. Но Cursor делает это лучше.

ИИ-редактор Cursor

  1. Прогнозирует как короткие, так и многострочные правки, учитывая недавние изменения. Предлагает соответствующее автозаполнение.
  2. Исправляет код даже при небрежном вводе.
  3. Прогнозирует курсор и помогает плавно перемещаться по коду.

Строковый помощник — генератор кода в строке

Используй Cmd+K, чтобы открыть строковый помощник. Введи запрос, и Cursor сгенерирует код, который можно вставить в проект.

ИИ-редактор Cursor

Работа с существующим кодом

Выдели фрагмент кода и нажми Cmd+K, чтобы попросить правку или задать вопросы по выбранному коду.

ИИ-редактор Cursor

ИИ-редактор Cursor

Чат с ИИ

Открой чат сочетанием Cmd+L. Здесь можно не только генерировать код, но и задавать вопросы.

ИИ-редактор Cursor

ИИ-редактор Cursor

  1. Добавление в промт контекста с помощью ссылок на уже существующие файлы.
  2. Добавление в промт изображений для наглядности.
  3. Веб-поиск.
  4. Интеграция документации. Быстрый доступ к документации популярных библиотек, фреймворков, языков.

Добавление контекста

Используй @ для добавления в запрос контекста: ссылки на файлы, папки, веб-страницы и «репки» GitHub.

ИИ-редактор Cursor

Поддержка изображений

Чат Cursor понимает картинки. Например, мы можем набросать дизайн пользовательского интерфейса для веб-сайта и попросить сгенерировать для него HTML и CSS код. Чтобы добавить изображение, можно перетащить его в окно чата.

ИИ-редактор Cursor

Поиск по базе кода

Cursor позволяет находить нужный код по описанию его функций. Например, можно найти функцию навигации в проекте, описав ее задачи.

ИИ-редактор Cursor

«Этак и я могу, а ты мне Мурку слабай!»

Инструмент Composer (Композитор) — это пюпитр специальная форма чата для создания новых файлов и редактирования (в том числе пакетного) уже готовых.

ИИ-редактор Cursor

Клавиатурные сочетания

⌘K — Командная строка AI-помощника непосредственно в коде. Используем для небольших правок

⌘L — Чат. Используем для крупных правок

⌘I — «Композитор», командная строка AI-помощника для создания новых файлов и внесения изменений во всю базу кода

Советы

v0

  • Для каждой новой задачи начинай новый чат.

  • Давай ИИ как можно больше контекста.

  • Продумывай стратегию разработки текущего проекта и каждый промт.

  • Если нет дизайн-макетов, начинать можно не в Cursor’е, а в V0. Попроси у чатбота Vercel показать как может выглядеть тот цифровой продукт, который собираешься разрабатывать, — 10–15 промтов для достижения приемлемого результата.

  • В Cursor для создания исходного кода есть Composer, в который можно загрузить изображения. Но начинать можно и в V0, попросив сделать разметку и стили дизайн-макета — чтобы иметь альтернативное решение или сэкономить запросы на бесплатных тарифах.

  • Найди в cursor.directory стандарты кода для Cursor, согласно используемых технологий. Если нужного стека нет, найди близкий и попроси ChatGPT или Claude переделать: «Я разрабатываю веб-сайт на Twig, PHP, CSS/SCSS, JS. Мне нужен хороший промт для ИИ-помощника. Сделай похожий на этот …». Добавь правила в корневой каталог, в файл .cursorrules.

  • Добавляй в запросы в чат ссылки на документацию соответствующей технологии (@Docs → Выбрать из списка или создать). Это будет гарантией, что Cursor в своих ответах будет опираться на актуальные спецификации.

  • Если Cursor не справляется с решением проблемы, обращайся к веб-приложения с ИИ-чатами. Даже Claude может по-разному отвечать в Cursor и в родном веб-приложении.

  • Проси Cursor объяснять непонятный код простыми словами — это отличный способ учиться программированию.

  • Ищи на Github starter-шаблоны с нужными технологиями и затем работай над ними в Cursor’е.

☝️🧐 Сниппеты мне пришлось переносить из VS Code вручную. Но, возможно, в процессе установки Cursor’а, я что-то пропустил.

☝️🧐 Бесплатная альтернатива курсору: стандартный VS Code + Cline (Claude Dev) + Continue

Комментарии