We use cookies to enhance your experience on the site
Privacy Policy
OK
CodeWorlds

Ahoy! Welcome aboard! ⚓

Welcome @name! I'm Captain Redbeard and I'll be your guide on the journey of learning to code. Today I'll show you Cursor - a modern code editor with built-in artificial intelligence.

What is Cursor? 🧭

Cursor is a code editor with built-in AI that helps you write code faster and more efficiently. Unlike traditional editors, Cursor has built-in artificial intelligence (Claude Sonnet 4.6, GPT-5) that:

✅ Writes code - you describe what you want, AI generates code ✅ Explains - don't understand something? Ask the AI ✅ Debugs - got an error? AI will help fix it ✅ Suggests - AI suggests what to write next

Thanks to this, you learn faster and create more efficiently.

Cursor vs VS Code 🆚

VS Code (Visual Studio Code) is the most popular code editor in the world - free, open-source, used by millions of developers.

Cursor is built ON TOP OF VS Code, so:

  • ✅ It looks nearly identical
  • ✅ Has the same keyboard shortcuts
  • ✅ Supports the same extensions
  • ✅ PLUS: built-in AI (Claude Sonnet 4.6, GPT-5)

If you know VS Code - you'll feel right at home. If you don't - don't worry, I'll show you everything from scratch.

Installing Cursor - Step by Step 🔧

Now we'll install Cursor. This will take about 5 minutes.

Step 1: Download Cursor

  1. Go to: https://cursor.sh
  2. Click the big "Download" button
  3. Choose your platform:
    • 🪟 Windows - downloads a 
      .exe
      installer
    • 🍎 Mac - downloads a 
      .dmg
      installer
    • 🐧 Linux - downloads an 
      .AppImage
      or 
      .deb

Step 2: Install

Windows:

  1. Double-click the downloaded 
    CursorSetup.exe
    file
  2. Click "Yes" if Windows asks for permissions
  3. Wait about 30 seconds for installation
  4. Cursor will open automatically

Mac:

  1. Double-click 
    Cursor.dmg
  2. Drag the Cursor icon to the Applications folder
  3. Open Cursor from Launchpad or Applications
  4. Click "Open" if Mac asks about security

Linux:

1# For .AppImage
2chmod +x Cursor.AppImage
3./Cursor.AppImage
4
5# For .deb (Ubuntu/Debian)
6sudo dpkg -i cursor_*.deb

Step 3: First Launch 🎉

When Cursor opens for the first time, you'll see:

  1. Welcome screen - the greeting page
  2. "Sign In" - log in (via GitHub or email)
  3. Choose your plan:
    • 🆓 Free - 2000 AI completions/month (plenty for learning!)
    • 💎 Pro ($20/month) - unlimited AI (for professionals)

Choose Free - it's more than enough to start!

Step 4: Import settings (optional)

If you've used VS Code before, Cursor will ask:

  • "Import settings from VS Code?"
  • Click "Yes" - it will transfer your settings, shortcuts, extensions

If this is your first editor - click "Skip".

Cursor Interface - What's Where? 🗺️

Open Cursor and take a look:

1┌─────────────────────────────────────────────────────────┐
2│  File  Edit  View  ...                    [Cursor logo] │ <- Menu Bar
3├───────┬─────────────────────────────────┬───────────────┤
4│       │                                 │               │
5│       │                                 │   AI CHAT     │
6│ FILES │        EDITOR                   │               │
7│       │      (you write code here)      │   (Cmd+L)     │
8│       │                                 │               │
9│       │                                 │               │
10├───────┴─────────────────────────────────┴───────────────┤
11│               TERMINAL (you type commands here)         │
12└─────────────────────────────────────────────────────────┘

Left Panel - FILES (Explorer) 📁

  • List of all files in the project
  • Creating new files/folders
  • Navigating the project

Center - EDITOR ✍️

  • This is where you write code
  • You can have multiple tabs open
  • Syntax highlighting (code coloring)

Right Panel - AI CHAT 💬

  • Conversation with AI
  • Asking questions
  • Generating code
  • Open it with: Cmd+L (Mac) / Ctrl+L (Windows/Linux)

Bottom Panel - TERMINAL 💻

  • Type commands here (npm, git, etc.)
  • Open it with: Cmd+
    ** or **Ctrl+

Your First Conversation with AI 🗣️

Time to test the magic of Cursor!

  1. Open AI Chat: Cmd/Ctrl + L
  2. Type:
1Explain in simple terms: what is HTML?
  1. Press Enter
  2. Watch the AI respond!

The AI should give you a simple answer. You can ask follow-up questions:

1And what is CSS?
1What's the difference between HTML and JavaScript?

Congratulations! 🎉 You just had your first conversation with AI in Cursor!

How to Talk to AI Effectively? 💡

AI is smart, but it can't read minds. You need to communicate clearly what you want.

❌ BAD (too vague):

1make me a website

AI doesn't know:

  • What kind of website?
  • What is it about?
  • What colors?
  • What sections?

✅ GOOD (specific):

1Create a simple HTML page with:
2- A heading "Ahoy Pirates!"
3- Black background
4- Red text
5- A pirate image
6- A "Join the Crew" button

AI knows exactly what to do!

🎯 Rules for Good Prompts:

  1. Be specific - the more details, the better
  2. Describe the goal - why are you doing this?
  3. Give examples - "like on website X"
  4. Iterate - the first AI response isn't the end, keep refining!

Keyboard Shortcuts - Cheat Sheet ⌨️

Memorize these 5 most important ones:

| Shortcut | What it does | |----------|-------------| | Cmd/Ctrl + L | Open AI Chat | | Cmd/Ctrl + K | Inline AI edit | | Cmd/Ctrl + I | Composer (multi-file) | | Cmd/Ctrl + ` | Terminal | | Cmd/Ctrl + P | Quick file open |

Print this out and stick it next to your monitor! 📌

Summary - What Did You Learn Today? 🎓

✅ What Cursor is and why we use it ✅ How to install Cursor ✅ What the Cursor interface looks like ✅ How to talk to AI (Cmd+L) ✅ How to write good prompts ✅ The most important keyboard shortcuts

Congratulations, young pirate! 🏴‍☠️ We've boarded the ship and met our secret weapon - Cursor!

In the next exercise you'll learn to use Ctrl+K - the magic wand for editing code!

Get ready, because an exciting voyage awaits us! ⚓🦜

Captain Redbeard out. 🏴‍☠️

Go to CodeWorlds→