# Your Development Environment: Terminal, Editor, Git

Every builder needs tools. A carpenter has a saw, a hammer, and a tape measure. A vibe coder has a terminal, a code editor, and version control. Today, we set up all three.

## The Terminal Is Not Scary

The terminal is just a text-based way to talk to your computer. Instead of clicking icons, you type commands. That's it.

<div class="concept-box">
<h4>Concept</h4>
Think of the terminal as a direct conversation with your computer. Instead of navigating through menus and windows, you type exactly what you want. It's actually faster once you get used to it — and it's essential for working with Claude Code.
</div>

**How to open it:**
- **macOS:** Open the Terminal app (search for "Terminal" in Spotlight with Cmd+Space)
- **Windows:** Open PowerShell (search for "PowerShell" in the Start menu)
- **Linux:** Open any terminal emulator (usually Ctrl+Alt+T)

**Your first commands:**

| Command | What it does | macOS/Linux | Windows |
|---------|-------------|-------------|---------|
| Where am I? | Shows your current folder | `pwd` | `cd` |
| What's here? | Lists files in current folder | `ls` | `dir` |
| Go into a folder | Change directory | `cd foldername` | `cd foldername` |
| Create a folder | Make a new directory | `mkdir foldername` | `mkdir foldername` |

<div class="try-it">
<h4>Try It</h4>
Open your terminal and create your project folder:
<br><br>
<code>mkdir waitlist-wizard</code><br>
<code>cd waitlist-wizard</code>
</div>

## Installing Node.js

Node.js lets you run JavaScript outside of a web browser. Our project will use it to run the development server and build the application.

**Installation steps:**
1. Go to **nodejs.org**
2. Download the **LTS** version (Long Term Support — the stable one)
3. Run the installer and accept all defaults
4. Verify it worked by typing in your terminal:

```
node --version
npm --version
```

You should see version numbers. If you see "command not found," close and reopen your terminal.

<div class="pro-tip">
<h4>Pro Tip</h4>
Always install the LTS (Long Term Support) version of Node.js, not the "Current" version. LTS is stable and well-tested. The "Current" version may have bugs or breaking changes.
</div>

## VS Code: Your Code Editor

VS Code (Visual Studio Code) is a free code editor made by Microsoft. It's used by millions of developers worldwide, and it's the best environment for working alongside AI.

**Installation steps:**
1. Go to **code.visualstudio.com**
2. Download for your operating system
3. Install and open it

**Key things to know:**
- **File Explorer** (left sidebar) — shows your project files
- **Integrated Terminal** (bottom panel) — a terminal built into VS Code (open with Ctrl+\` or View > Terminal)
- **Saving files** — Ctrl+S (Windows/Linux) or Cmd+S (Mac)

<div class="try-it">
<h4>Try It</h4>
Open VS Code, then use <strong>File > Open Folder</strong> to open your <code>waitlist-wizard</code> folder. You should see an empty project in the file explorer.
</div>

**Recommended extensions** (install 2 for now):
- **Prettier** — automatically formats your code to look clean
- **ESLint** — highlights potential errors as you write

To install: click the Extensions icon in the left sidebar (or Ctrl+Shift+X) and search for each one.

## Git: Your Safety Net

Git is version control — it creates "save points" for your code. Think of it like save states in a video game. If something breaks, you can always go back to a previous state.

<div class="concept-box">
<h4>Concept</h4>
Git tracks changes to your files over time. Every time you "commit," you create a snapshot of your entire project at that moment. If AI generates code that breaks something, you can roll back to the last working version.
</div>

**Installation:**
- **macOS:** Git comes pre-installed. Type `git --version` to verify.
- **Windows:** Download from **git-scm.com** and run the installer (accept all defaults).
- **Linux:** Run `sudo apt install git` (Ubuntu/Debian) or `sudo dnf install git` (Fedora).

**Configure your identity:**
```
git config --global user.name "Your Name"
git config --global user.email "your@email.com"
```

**Initialize your project:**
```
cd waitlist-wizard
git init
```

**Your first commit:**
1. Create a file called `README.md` in your `waitlist-wizard` folder. You can do this in VS Code or with the terminal:
```
echo "# Waitlist Wizard" > README.md
```
2. Stage and commit:
```
git add .
git commit -m "first commit"
```

<div class="try-it">
<h4>Try It</h4>
Run <code>git log</code> in your terminal. You should see your first commit with the message "first commit." You now have version control set up.
</div>

## GitHub Account (Optional but Recommended)

GitHub is where developers store and share code. We'll use it in Lesson 10 to deploy your app.

1. Go to **github.com** and create a free account
2. You don't need to create any repositories yet — we'll do that later

<div class="honest-note">
<h4>Honest Note</h4>
These tools might feel unfamiliar and intimidating. That's completely normal. You only need to learn them once. From Lesson 3 onwards, Claude Code will help you use them — you'll just describe what you want in plain English, and it handles the terminal commands.
</div>

## Key Takeaway

You now have the three foundational tools every developer uses: a terminal, a code editor, and version control. These tools might feel unfamiliar, but you only need to learn them once. From here on, Claude Code will help you use them.

<div class="checkpoint">
<h4>Checkpoint</h4>
Your terminal is open, Node.js is installed, VS Code has your project folder, and Git has its first commit. Next: meeting Claude Code, your AI coding partner.
</div>