Як користуватися Cursor AI: від встановлення до своєї програми

Що таке Cursor і що він робить із твоїми словами

Cursor — редактор коду з вбудованим ШІ. Ти відкриваєш папку, пояснюєш задачу, а помічник може читати файли, створювати нові й змінювати програму. Замість пересилання шматків коду між чатом і редактором робота відбувається поруч із самими файлами. Але запуск і перевірка залишаються частиною процесу: переконливе «готово» ще не означає, що кнопка працює.

Цей гайд — для людини, яка хоче вперше написати програму за допомогою ШІ. Зробимо невеликий лічильник тексту: вставляєш український текст — бачиш кількість слів, символів і абзаців. Він стане у пригоді для дописів, описів товарів і коротких оголошень. Наш навчальний варіант не потребує сервера чи ключа API. Якщо потрібен конструктор, який одразу публікує сайт, спочатку подивись маршрут створення сайту з ШІ.

Чат із моделлю, редактор і готова програма — різні речі. Cursor допомагає написати код. Сам лічильник після цього працює за звичайними правилами браузера: кожне натискання не звертається до нейромережі. Підписка на інструмент розробки не означає, що майбутні користувачі твоєї програми також мають її купувати.

Крок 1. Встанови Cursor та відкрий окрему папку

1. Перейди на офіційну сторінку завантаження. Обери Windows, macOS або Linux і відповідну архітектуру комп’ютера. Встанови програму та увійди в акаунт.
2. Створи звичайну порожню папку text-counter, наприклад у «Документах». У Cursor відкрий File → Open Folder та вибери саме її. Не потрібно відкривати весь диск чи папку з особистими документами.
3. Відкрий панель Agent. В офіційному quickstart для неї вказано Ctrl + I у Windows/Linux та Cmd + I у macOS. Якщо власні гарячі клавіші відрізняються, знайди Agent через меню редактора.
4. Для цього першого прикладу не встановлюй Node.js, Python, базу даних або десяток розширень. Ми свідомо обираємо один HTML-файл, який відкривається браузером.

Завантаження редактора й використання його ШІ — окремі етапи. Якщо квота акаунта закінчилася, це не помилка твоєї папки. Збережені файли можна продовжувати відкривати та запускати.

Крок 2. Дай ШІ маленьке й зрозуміле завдання

«Зроби круту програму» залишає забагато невідомого. Краще одразу назвати користувача, одну корисну дію, обмеження й спосіб перевірки. Нижче наш авторський бриф; його можна адаптувати під інший невеликий інструмент.

Створи в цій порожній папці програму «Лічильник тексту» в одному index.html. Інтерфейс українською: велике текстове поле, кількість слів, символів із пробілами та абзаців, кнопка очищення. Слово — послідовність літер або цифр, апостроф і дефіс усередині дозволені. Символи рахуй як кодові точки Unicode; абзаци розділяються порожніми рядками. Потрібен зручний вигляд на телефоні та підписи полів. Без сервера, зовнішніх бібліотек, шрифтів із мережі, аналітики, сховища, API та платних сервісів. Не встановлюй пакети. Спочатку коротко поясни план, потім створи файл і дай просту інструкцію запуску подвійним кліком. Покажи, як перевірити порожнє поле, «Привіт, Україно!», слово з апострофом і два абзаци. Не заявляй, що перевірив у браузері, якщо не запускав його.

Спочатку прочитай відповідь. Якщо помічник пропонує сервер, реєстрацію чи платний сервіс, уточни: потрібен саме локальний файл без цих складових. Після створення у списку файлів має з’явитися index.html.

Крок 3. Відкрий програму поза редактором

Знайди index.html у своїй папці через Провідник Windows або Finder і відкрий браузером. Якщо бачиш текст коду замість сторінки, перевір повне ім’я: файл має закінчуватися на .html, а не .html.txt. Після наступної правки збережи файл і онови вкладку.

Поки що це програма для тебе на твоєму комп’ютері. Вона не з’явиться в Google, бо відкриття локального файла не публікує його в інтернеті. Спільний доступ — наступний окремий крок; для нього є гайд про публікацію, домен і пошук.

Не вір опису — перевір на короткому тексті

Ось наш власний навчальний лічильник для порівняння з результатом ШІ. Текст у цьому блоці не надсилається з поля, не зберігається і не потрапляє в аналітику. Під «символом» тут розуміємо кодову точку Unicode: складене емодзі може складатися з кількох таких символів. Слово — послідовність літер або цифр; апостроф і дефіс усередині слова дозволені.

Таблицю можна гортати вбік →

Інший редактор може рахувати слова інакше — наприклад, ділити слово з дефісом. Спочатку домовся про правило, а потім перевіряй реалізацію. Для ліміту конкретної соцмережі орієнтуйся на її власний редактор: спосіб підрахунку емодзі може відрізнятися.

Крок 4. Змінюй одну річ за раз

Після першого запуску легко попросити «ще темну тему, історію, акаунти й оплату». Тоді вже незрозуміло, яка саме зміна все зламала. Спочатку зроби копію робочої папки, наприклад text-counter-working. Потім попроси одну невелику доробку.

У робочому index.html додай окремий показник символів без пробільних знаків. Решту поведінки збережи. Не додавай залежностей або мережевих запитів. Після зміни переліч конкретні перевірки, які ти виконав, і окремо те, що я маю перевірити вручну.

У перегляді змін, який часто називають diff, видно додані та прибрані рядки. Навіть без знання мови програмування перевір, чи не з’явилися сторонні адреси, незрозумілі залежності або зміни в чужих файлах. Для завдання про один підпис не має знадобитися перебудова всього проєкту.

Якщо щось не працює, повідом конкретний симптом: який текст вставив, що натиснув, що отримав і чого очікував. Додай текст помилки без паролів чи особистих даних. «Кнопка не працює після вставлення двох абзаців» корисніше за «ти знову все зламав».

У нашому лічильнику є помилка. Вхід: п’ять синьо-жовтих. Очікую 2 слова за правилом, яке ми погодили. Фактично отримую: [впиши число]. Знайди причину в поточному файлі, запропонуй мінімальне виправлення й перевір також порожній текст, пробіли та «Привіт, Україно!». Не переписуй інтерфейс.

Коли базового прикладу мало: правила, Git і перевірки

Для складнішого завдання увімкни Plan Mode: спочатку обговори план, потім дозволяй реалізацію. У поточній документації перемикання доступне через Shift + Tab у полі агента. Особливо це допомагає, коли змінюються кілька файлів або є кілька можливих способів виконати задачу.

Постійні домовленості винеси в AGENTS.md у корені проєкту. Cursor підтримує цей простий файл інструкцій; для правил зі складнішим вибором файлів є .cursor/rules. Так не доведеться щоразу повторювати мову інтерфейсу й порядок перевірки. Інструкція — контекст для моделі, а не технічний захист від помилок.

# Домовленості про проєкт
Це локальний лічильник тексту в одному index.html.
Інтерфейс і пояснення — українською.
Без мережевих запитів, залежностей і збереження введеного тексту.
Не розширюй задачу без пояснення причини.
Після зміни перевір порожнє поле, українські слова, апострофи, дефіс та абзаци.
Відрізняй виконані перевірки від рекомендацій для ручного тесту.
Перед видаленням даних чи перезаписом робочої версії поясни наслідки.

Коли проєкт росте, заміни ручні копії на Git: збережи робочу версію перед новою функцією, переглянь зміни, зроби окремий коміт після перевірки. Попроси агента пояснити команду перед виконанням, якщо не розумієш її наслідків. Не починай навчання з команд, які примусово стирають незбережені зміни.

Для наявного React, Python чи іншого проєкту спочатку з’ясуй його спосіб запуску. Попроси використати вже наявні тести та збірку, а новий тест додавати під конкретну поведінку. Перевірка коду тим самим ШІ корисна як додатковий погляд, але не замінює запуск і ручний сценарій. Більше про збереження контексту — в короткому пакеті контексту для проєкту.

Що безкоштовне, за що платять і куди йде код

У Cursor є Free з обмеженим використанням ШІ. На відкритій сторінці тарифів під час перевірки вказано Plus за $8/місяць із моделями Grok та Premium за $30/місяць; використання сторонніх моделей оплачується окремо. Податки й збори можуть додаватися. Перевір чинний тариф перед оплатою: старе «Pro за $20» зі сторонньої інструкції не варто автоматично переносити на свій акаунт.

Для нашої вправи не потрібен платний API усередині створеної програми. Витрата на допомогу ШІ при розробці та витрата на AI-функцію для відвідувачів — різні бюджети. Потужна відеокарта тут теж не обов’язкова: робота зі звичайним HTML не є запуском великої мовної моделі на твоєму ПК.

Установлений на комп’ютері Cursor не означає повністю локальний ШІ. Запити й потрібний контекст можуть оброблятися сервісом. Privacy Mode обмежує використання даних для навчання, але не перетворює редактор на офлайн-модель; у політиці є окремі застереження щодо перевірки зловживань. Не додавай до навчальної папки паролі, бази клієнтів чи секретні ключі. Залиш стандартні підтвердження чутливих дій увімкненими.

Що має бути готове наприкінці

• Ти знаєш, у якій папці лежить програма й який файл її відкриває.
• Порожній текст, українські слова та два абзаци дають очікуваний результат.
• Є робоча копія, до якої можна повернутися.
• Ти можеш пояснити, де ШІ допоміг написати код, а де код працює самостійно.

Наступний проєкт обирай за своєю задачею, а не за кількістю модних функцій. Для телефона є окремий гайд зі створення мобільного застосунку. Якщо застряг — принеси маленький приклад і конкретну помилку в український чат вайбкодингу.

Джерела й межі перевірки

Можливості редактора та тарифи звірено з офіційними джерелами. Промпти, навчальний лічильник і контрольні приклади — власні матеріали редакції. Роботу лічильника перевірено окремо; платну сесію Cursor та якість відповідей усіх моделей у цьому матеріалі не тестували.

1. Cursor: офіційне завантаження
2. Cursor Quickstart: папка, Agent, перші зміни
3. Cursor Plan Mode
4. Cursor Rules та AGENTS.md
5. Cursor: перегляд змін і перевірки
6. Cursor: чинні тарифи та окрема оплата сторонніх моделей
7. Cursor: обробка даних і Privacy Mode
8. Cursor: безпека агента та підтвердження дій