Installation Guide

Cursor (AI Code Editor)

Cursor is an AI-powered code editor built on VS Code. Download it from cursor.com and install like any desktop application. Your existing VS Code extensions and settings will carry over.

Claude Code (CLI Tool)

Claude Code runs in your terminal and can handle complex, multi-step coding tasks. Install it globally via npm:

npm install -g @anthropic-ai/claude-code

Then start it in any project directory:

claude

Requires an Anthropic API key. See Claude Code docs for setup details.

VS Code (Foundation Editor)

Visual Studio Code is the foundation that Cursor is built on. It's free, widely used, and has thousands of extensions. Download from code.visualstudio.com. Many AI extensions (GitHub Copilot, Cline, Continue) can be added to VS Code directly.

Browser-Based Tools

Some AI coding tools run entirely in the browser and require no local installation: Lovable, Replit, and Bolt let you build and deploy apps through natural language prompts directly from your browser.

1. Install Homebrew (Package Manager)

Check if Homebrew is installed:

brew --version

If not installed, paste the command from brew.sh into your Terminal and follow the instructions.

2. Install Node.js (includes npm)

brew install node

3. Install Git (Version Control)

Git is often pre-installed. Check with:

git --version

If it's not installed or you need to update:

brew install git

4. (Optional) Install `tree` command

Useful for visualizing folder structures.

brew install tree

1. Install Node.js (includes npm)

Go to nodejs.org, download the **LTS** version installer (`.msi`), and run it using default settings.

2. Install Git (Version Control)

Go to git-scm.com, download the installer, and run it. Default settings are usually fine. This installs Git and **Git Bash** (a useful terminal).

3. (Optional) Install `tree` command

Requires a package manager like Chocolatey.

a. Install Chocolatey (if needed): Follow instructions at chocolatey.org (usually requires running a PowerShell command as Administrator).

b. Install `tree` (using Admin PowerShell/CMD):

choco install tree

Alternatively, use Winget if available: `winget install tree`

Alternative Package Managers

You can also install Node.js and Git using Chocolatey (`choco install nodejs-lts git`) or Winget (`winget install OpenJS.NodeJS.LTS Git.Git`) if you prefer.

1. Install Node.js (via NodeSource)

curl -fsSL https://deb.nodesource.com/setup_lts.x | sudo -E bash -
sudo apt-get install -y nodejs

2. Install Git

sudo apt-get install git

3. Verify installations

node --version && npm --version && git --version

4. (Optional) Install tree

sudo apt-get install tree

Docker Desktop lets you run containers — lightweight virtual machines that package up applications and their dependencies. You'll need it for running local PostgreSQL databases and the Supabase CLI. Download from docker.com.

After installation, Docker Desktop runs in the background. See the Local PostgreSQL Setup page for how to use it with a database.

Supabase CLI

Run a full Supabase stack locally for development.

npm install -g supabase

Or with Homebrew: brew install supabase/tap/supabase

Vercel CLI

Deploy and manage projects on Vercel from your terminal.

npm install -g vercel

GitHub CLI

Manage GitHub repos, PRs, and issues from the command line.

brew install gh

Windows: winget install GitHub.cli | Linux: See cli.github.com

Google Chrome (Desktop - Mac/Windows/Linux)

Usually enabled by default.

• Right-click anywhere on the page and select "Inspect" or "Inspect Element".
• Alternatively, use keyboard shortcuts: Option + ⌘ + J (Mac) or Ctrl + Shift + J (Windows/Linux).
• Go to the "Console" tab within the Developer Tools panel.

Safari (macOS)

• Open Safari Preferences (Safari > Preferences.../Settings... or ⌘ + ,).
• Go to the "Advanced" tab.
• Check the box at the bottom labeled "Show features for web developers".
• Close Preferences. The "Develop" menu will now appear in the menu bar.
• Right-click on a page and select "Inspect Element" or use the Develop menu (Develop > Show JavaScript Console or Option + ⌘ + C).
• Go to the "Console" tab.

Safari (iOS - iPhone/iPad)

Requires an iPhone/iPad connected to your Mac via a lightning or USB-C cable.

• On the iOS device: Go to Settings > Safari > Advanced.
• Enable "Web Inspector".
• Connect the iOS device to your Mac with an appropriate cable.
• On the Mac: Open Safari.
• Go to the "Develop" menu (enable it first, see macOS steps above).
• Find your iOS device name in the menu, hover over it, and select the specific web page you want to inspect. (Make sure you have a web page open on your iOS device.)
• The Web Inspector window will open on your Mac, showing the console for the page on your iOS device.

Chrome (Android)

Requires a computer with Chrome and a USB connection.

• On the Android device: Enable Developer Options and USB Debugging. (Search online or ask the AI for specific steps for your device model, usually involves tapping the "Build number" in Settings multiple times).
• Connect the Android device to your computer via USB. Open the web page you want to inspect on your Android device.
• On the computer: Open Chrome.
• Navigate to chrome://inspect in the address bar.
• Find your connected device under the "Remote Target" section.
• Click "inspect" below the specific browser tab or WebView you want to debug.
• A DevTools window will open on your computer, showing the console for the page on your Android device.
• You may need to accept a prompt on the Android device to allow USB debugging from your computer.