The Terminal

Before you write a line of HTML, you need to get comfortable in the terminal. Almost everything in this series runs through it. The sooner it feels normal, the better.

Open Terminal. On macOS it’s in /Applications/Utilities/. On most Linux distributions you can get to it with Ctrl+Alt+T, or find it in your application launcher. When it opens, you’re sitting in your home directory. That’s the starting point for everything.

Who are you and where are you

Two commands to start. Neither one does anything to your filesystem. They just tell you things.

whoami

This prints your username. On a machine named after your dog, on a shared work server, on a VPS you just spun up, whoami tells you who the system thinks you are. It’s a small command, but it matters when you’re working in environments where user permissions and file ownership are relevant (and in web development, they often are).

ls

ls lists the contents of your current directory. Run it now and you’ll see the familiar top-level folders from your $HOME: Desktop, Documents, Downloads, and so on. This is your home directory.

Make a project folder

You’re going to create a folder for the project you’ll be building throughout this series. A common convention is to keep all your development projects in a folder called dev or projects in your home directory. That’s what we’ll do here.

mkdir tutorials

mkdir stands for “make directory.” You’ve just created a folder called tutorials in your home directory. Run ls again and you’ll see it.

Now move into it:

cd tutorials

cd stands for “change directory.” You’re now inside tutorials. If you run ls here, you’ll get nothing back. The folder is empty.

Build out some structure

Let’s add a few subdirectories to work with:

mkdir src
mkdir dist
mkdir docs
mkdir notes

You can also do this in one line:

mkdir src dist docs notes

Run ls again. All four folders are there.

Remove what you don’t need

You don’t actually need notes for this project. Let’s remove it.

rm -r notes

The -r flag stands for “recursive.” On its own, rm removes files. To remove a directory and everything inside it, you need -r. Since notes is empty, it would also work with rmdir notes, but rm -r notes is the habit worth building because directories are rarely empty in practice.

Run ls one more time. Three folders: src, dist, docs.

A word of caution: rm is permanent. There’s no trash, no undo, no recovery prompt. What you delete is gone. Get used to pausing for a half-second before you run it.

Move around

You’re currently inside ~/tutorials/ directory from previously changing directories into it. Here’s how to change directories out of it.

To go up one level, to your home (~) directory:

cd ..

In the command above .. (two periods) is shorthand for “parent directory of” and we can remember what cd means from above. Put it all together and the command becomes a statement:

change directories [parent directory of]

Now you’re back in your home, run ls here and you’ll see tutorials in the list alongside your other home directory folders.

To change directories back down into tutorials:

# change directories tutorials or
cd tutorials

Or from home, to go directly into a subdirectory:

cd tutorials/src

To go up two levels at once:

Likewise, after going down two levels go back up two levels:

cd ../..

That command should read to you as “change directory: parent directory of, parent directory of”. With that statement in mind, you might notice a pattern emerging:

1. cd is a COMMAND which takes an ARGUMENT
2. COMMAND [ARGUMENT]
3. Together they make a statement which can be acted on
4. cd COMMAND takes ARGUMENTS which has the effect of changing the current working directory
5. one may cd up the file tree one directory .. or multiple directories ../../../ at a time
6. one may also cd down the tile tree one directory child/ or multiple directories child/grand-child/great-grand-child/ at a time
7. one space seperates the command from the argument

cd is just one example of the common COMMAND [ARGUMENT] pattern which you’ll be seeing plenty more of.

Each .. is one level up. Chain them with / to climb multiple levels in a single command.

One more useful shortcut: no matter where you are in the filesystem, this takes you straight home:

cd ~

~ is shorthand for your home directory. You’ll see it used often.

What you now know

You can orient yourself in the filesystem (whoami, ls), create folders (mkdir), move into and out of them (cd), and delete what you don’t need (rm -r). That’s enough to work with. In Chapter 2, you’ll initialize a Git repository inside the tutorials folder and start tracking your work.