Your developer setup

The idea

Every trade starts with a workshop. Before you build anything, you set up a place where your tools are in reach and you know where each one lives. This lesson builds that workshop on your own computer.

You will install three tools, learn to give your computer written orders in the terminal (a window where you type commands instead of clicking), and set up your editor so it helps instead of getting in the way. Nothing here is graded. It is all hands-on, and every later lesson depends on it.

One rule for the whole course: when a code block shows a command, type the command only. Never type a $ or % at the start of a line. That symbol is just the computer's "ready for your order" mark.

Installing VS Code, Node and Git

Picture a toolbox with three tools in it. VS Code is the desk where you write and read your work. Node is an engine that many tools in this course run on, and for now you only need to check that it is there. Git is the save-game system you will learn properly later, and for now you only need to check that it is there.

Windows. Windows is built differently from the systems most developer tools are made for, so we give it a small Linux workshop inside it, called WSL2 (Windows Subsystem for Linux). Inside it you get a normal Linux terminal, and every command in this course then works exactly as written.

1. Open the Start menu, type PowerShell, right-click it and choose "Run as administrator". Type this and press Enter. It installs WSL2 and a Linux called Ubuntu:

wsl --install

2. Restart when it asks. An Ubuntu window opens and asks you to invent a username and a password. When you type the password, nothing appears on screen. That is normal, not broken.
3. Install VS Code the usual way: download the installer from code.visualstudio.com and run it.
4. Open VS Code, press Ctrl+Shift+X, search for WSL (published by Microsoft) and install it. This lets VS Code work on files inside your Ubuntu workshop.

From now on, do all terminal work in the Ubuntu window (find it in the Start menu), not in PowerShell. The two PowerShell exceptions are wsl --install and winget, which you will meet below.

macOS. A terminal is already built in: press Cmd+Space, type Terminal and press Enter. Download VS Code from code.visualstudio.com, open the downloaded file, and drag it into your Applications folder. Git and Node come in the package managers section below.

Linux. Open your terminal (on many systems Ctrl+Alt+T). Download the VS Code package for your system from code.visualstudio.com and open it with your software installer. Git and Node come in the package managers section below.

Once all three are installed, open your terminal and check each one answers back:

code --version
node --version
git --version

You will see something like this. Your numbers will be different, and that is fine:

1.105.0
a1b2c3d4e5f6a1b2c3d4e5f6a1b2c3d4e5f6a1b2
x64
v24.11.0
git version 2.47.0

code --version prints three lines (the version, a long ID, and your computer type). node --version prints a version starting with v. git --version prints git version and a number. If one says "command not found", it is not installed yet, or your terminal has not noticed it. The sections below explain both cases.

The terminal: paths, ls, cd, pwd, mkdir and rm

The terminal is a control room where you give written orders. The program that reads your orders is called the shell. Each order is a command. Press Enter and the shell carries it out and prints a reply.

Your computer's storage is a filing cabinet. Drawers (also called folders or directories) hold folders inside folders, down to the papers (the files). The very front of the cabinet is written /. A path is directions to a drawer or a paper. An absolute path is the full chain of drawers starting from the front of the cabinet, like /home/sam/notes. A relative path starts from the drawer you already have open, like notes.

At any moment your terminal has one drawer open. Ask which one with pwd ("print working directory"):

pwd

/home/sam

On macOS you will see something like /Users/sam instead. This is your home folder, your own personal drawer, and ~ is the short way to write it. Now look at what is inside the open drawer with ls ("list"):

ls

Desktop  Documents  Downloads

Add -l. A word starting with a dash after a command is a flag, a small switch that changes how the command behaves. -l means "long": one line per item with sizes and dates.

ls -l

drwxr-xr-x 2 sam sam 4096 Oct 16 09:12 Documents
-rw-r--r-- 1 sam sam    0 Oct 16 09:13 hello.txt

The first letter tells you what each item is: d is a drawer, - is a paper. The other letters are keys and badges, which a later lesson explains. The date and name are at the end of the line.

Now move around. cd ("change directory") opens a different drawer. mkdir ("make directory") adds a new empty drawer. touch creates an empty paper. rm ("remove") throws a paper away:

cd ~
mkdir -p practice/notes
cd practice
touch hello.txt
ls
rm hello.txt
cd ..

-p means "make every missing drawer along the way, and do not complain if it already exists". After cd practice, the open drawer is practice. cd .. goes up one drawer, because .. always means "the drawer this one sits in". A single . means "this very drawer".

To remove a whole drawer and everything in it, rm needs the flag -r ("recursive": the drawer and everything inside):

rm -r practice

Be careful here. There is no recycle bin. Whatever rm removes is gone. Before you run it, run pwd and ls and check you are where you think you are.

Running commands and reading their output

Every command has the same shape: the command name, then optional flags, then arguments (the things to act on, such as a folder name). In ls -l Documents, ls is the command, -l is the flag and Documents is the argument.

Run one that just prints back what you give it:

echo "setup is going well"

setup is going well

echo prints whatever you hand it. The shell does not answer "OK" when it succeeds. Silence usually means it worked. For example, mkdir prints nothing when it creates a drawer.

When something goes wrong, the shell hands back an error receipt. Read it piece by piece. Try asking for a drawer that does not exist:

ls missing-folder

ls: cannot access 'missing-folder': No such file or directory

Read it left to right: ls: is who is complaining, cannot access 'missing-folder' is what it tried to do, and No such file or directory is the reason. On macOS the wording is slightly different (ls: missing-folder: No such file or directory), but the same three parts are there.

Here is a typo, lss instead of ls:

lss

bash: lss: command not found

On macOS the shell is called zsh and says zsh: command not found: lss. Either way it means "I searched and nothing has that name". And here is rm used on a drawer without -r:

mkdir demo
rm demo

rm: cannot remove 'demo': Is a directory

That one is the shell protecting you: it will not throw away a whole drawer unless you say -r on purpose. Clean up with rmdir demo, which only removes empty drawers.

Four habits make the terminal far easier. Press the Up arrow to bring back your last command. Press Tab to finish a name for you (type cd Doc, press Tab, and it completes Documents). Press Ctrl+C to stop a command that is stuck. Add --help after most commands (for example ls --help) to see their built-in manual.

Package managers: winget, Homebrew and apt

A package manager is a supply-room clerk you ask by name. You say "git, please", and the clerk fetches the right version for your computer, puts it where it belongs, remembers what was handed out, and can later update or remove it. Compare that with hunting down installer files on websites by hand.

Each system has its own clerk:

• Windows: winget. It is already part of Windows 11 and recent Windows 10. Run it in PowerShell, not Ubuntu.
• macOS: Homebrew. It is not built in. Open brew.sh in your browser and copy the one-line install command from the top of the page, paste it into Terminal and follow its prompts.
• Linux and WSL (Ubuntu): apt. It is built in.

Here is the same job on each system. These install VS Code (Windows and macOS) and Git and Node (macOS and Linux/WSL):

winget install --id Microsoft.VisualStudioCode -e

-e means "exact": install exactly this package, not a close match.

brew install git node
brew install --cask visual-studio-code

The word --cask tells Homebrew the package is an app with its own window, rather than a command-line tool.

sudo apt update
sudo apt install -y git nodejs

sudo runs a single command with administrator rights. It asks for your password once, and nothing shows as you type. apt update refreshes the clerk's catalog of what is available. It does not install anything. apt install fetches the packages, and -y answers "yes" to its confirmation question so it does not stop and wait.

Ubuntu's catalog sometimes lags behind. After installing, run node --version and compare it with the version labeled LTS (long-term support, the version meant for everyday use) on nodejs.org. If yours is older, follow the Linux instructions on nodejs.org/en/download instead.

Keeping things current is one more command each: winget upgrade --all, brew update && brew upgrade, or sudo apt update && sudo apt upgrade -y. In that last pair, && means "run the second command only if the first one worked".

To see what the clerk knows about a package before you install it:

apt show git

On macOS use brew info git, and in PowerShell use winget show Git.Git.

Environment variables and PATH

Picture a wall of labeled slots in the control room. Each slot has a name on it and holds one short value, and any command you run can read the wall. Those slots are environment variables.

Read one by putting a $ in front of its name:

echo $HOME

/home/sam

Make your own with export ("put this on the wall"):

export GREETING="hello from my setup"
echo $GREETING

hello from my setup

This slot only lasts for this one terminal window. Close the window and the wall is wiped. To keep a variable for good, put the same export line in your shell's startup file, which the shell reads every time a terminal opens. That file is ~/.zshrc on macOS and ~/.bashrc on Linux and WSL. Open it in VS Code with code ~/.bashrc (or code ~/.zshrc), add your line at the bottom, save, and open a fresh terminal.

One variable matters more than all the rest: PATH. When you type a command name such as git, the shell does not search the whole cabinet. It opens a short list of drawers, in order, looking for a paper with that name, and it stops at the first match. That list is PATH:

echo $PATH

/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin

Colons separate the drawers. Yours will look different. To find out which paper the shell would actually pick, ask which:

which git

/usr/bin/git

On a Mac with Homebrew this might print /opt/homebrew/bin/git. Now you can see why "command not found" happens even when something is installed: its drawer is not on the list. Add a drawer to the front of the list like this:

export PATH="$HOME/tools:$PATH"

Read it as "the new list is my tools drawer, then everything that was on the old list". Because the first match wins, the order matters. Terminal windows also read PATH only when they open, which is why a freshly installed tool is often invisible until you close the terminal and open a new one.

Editor shortcuts, extensions and formatting on save

VS Code is your desk, and a good desk has a few things in easy reach. Learn these shortcuts first (on macOS use Cmd where Windows and Linux use Ctrl):

• Ctrl+P opens any file by typing part of its name.
• Ctrl+Shift+P opens the Command Palette, a search box for every action VS Code can do. If you forget a shortcut, search here.
• Ctrl+` (the backtick key, above Tab) shows or hides a terminal built into VS Code, already opened in your project folder.
• Ctrl+/ turns the current line into a comment, a note the computer ignores, and turns it back.
• Alt+Up and Alt+Down move the current line up or down (Option on macOS).
• Ctrl+D selects the next copy of the word you have selected, so you can edit several at once.
• Ctrl+S saves the file.

An extension is an add-on that gives VS Code a new ability. Open the Extensions panel with Ctrl+Shift+X, search, and press Install. Extensions run code on your computer, so install only ones with many downloads from a publisher with a verified badge.

A formatter tidies a file's spacing and layout for you, so your files always look the same. VS Code has one built in. Run it by hand with the Command Palette action "Format Document" (the shortcut is Shift+Alt+F, or Shift+Option+F on macOS). Better still, tell it to do this every time you save. Open the Command Palette, choose "Preferences: Open User Settings (JSON)", and make sure this line is inside the curly braces:

"editor.formatOnSave": true

That file is a list of labeled values: the name on the left, the value on the right. Setting editor.formatOnSave to true means every time you press Ctrl+S, the editor tidies the file before saving it.

Common mistakes

• Typing commands in PowerShell instead of Ubuntu (Windows). If ls -l fails or looks odd, check the window's title. The course commands belong in the Ubuntu window.
• Not reopening the terminal after installing. A terminal reads PATH when it opens. Close it, open a new one, and try again before assuming the install failed.
• Putting projects in the wrong place on Windows. Keep your work inside the Ubuntu home folder (~). Files kept under /mnt/c (your regular Windows drives) are much slower for tools to read.
• Spaces in names. cd My Folder fails, because the shell reads two arguments. Avoid spaces in folder names, or wrap the name in quotes: cd "My Folder".
• Running rm -r without checking where you are. There is no undo. Run pwd and ls first, and type the name yourself.
• Pasting commands you do not understand. Read each command and say what each piece does before pressing Enter. Adding sudo to make an error go away is rarely the right fix.
• Typing a password and thinking the terminal froze. It is listening. Nothing is shown for passwords, by design.

Try it

1. Check your three tools. Open your terminal (the Ubuntu window on Windows) and run code --version, node --version and git --version. Each should print a version number. If one says "command not found", close the terminal, open a new one and try again, then install the missing tool with your system's package manager.
2. Find your place in the cabinet. Run pwd, then ls, then ls -l, then cd ~, then pwd again. You should see your home folder's path both times after cd ~, and the ls -l lines should start with d for folders.
3. Build and clean up. Run mkdir -p practice/notes, then cd practice, then touch hello.txt, then ls. You should see hello.txt and notes. Then run rm hello.txt, cd .., and rm -r practice, and finish with ls to confirm the drawer is gone.
4. Read an error on purpose. Run lss and read the reply aloud: which program is complaining, and what did it fail to do? Then run ls missing-folder and find the same three parts in that message.
5. Ask your package manager about Git. Run apt show git (Linux/WSL), brew info git (macOS), or winget show Git.Git in PowerShell (Windows). You should see its version and a short description.
6. Inspect PATH. Run echo $PATH, then which node. Check that the folder in the which answer appears somewhere in the PATH list.
7. Make and lose a variable. Run export GREETING="hello" then echo $GREETING; it should print hello. Close the terminal, open a new one and run echo $GREETING again. It should print an empty line, because the wall was wiped.
8. Set up your desk. In the terminal run mkdir -p ~/setup-test and then code ~/setup-test to open that folder in VS Code (on Windows, run this from Ubuntu). Press Ctrl+Shift+X, install the Code Spell Checker extension, and turn on "Format On Save" by adding the editor.formatOnSave line described above. Create a file called messy.json containing {"a":1, "b":[1,2,3]} on one line, press Ctrl+S, and watch the editor spread it into tidy, indented lines. Finally, open the built-in terminal with Ctrl+` and run pwd to confirm it opened inside setup-test.