Lesson Weekend

One of the first tools any new web developer must become comfortable with is something called the command line. No matter which language you program in, you'll use it constantly.

This lesson will walk through what the command line is, what it looks like, and how to access it. In the lesson following this one we'll learn how to interact with the command line by executing commands. Let's get started!

Graphical User Interface

We often access computer programs through their Graphical User Interface (or GUI, for short). This is simply the visual component of a computer program.

For instance, word processing software (Microsoft Word, Google Docs, etc.) generally offers a GUI with whitespace to type in, a cursor to indicate where we're typing, and a variety of buttons, menus, and options to format our text. This is a GUI. It's the visual portion of a program we see and interact with.

An email inbox that displays each email's subject line, allows us to open an email to see its contents by clicking on it, and offers buttons to reply and format text is another example of a GUI, or graphical user interface.

The Terminal

However, when we are developing code we often use our computer's terminal interface. The terminal is an area of the computer that allows us to do things (like create or delete a new file) with text-based commands, instead of by clicking options in a graphical user interface. These text-based commands are typed into something called a command line.

You have probably navigated through the folders and files on a computer using a GUI like Finder on a Mac, or Explore on Windows. In the next lesson we'll learn how to create, update, delete and navigate to folders and files using the text-based terminal instead. We'll also see how the terminal provides access to extra commands not available through a GUI.

Essentially, all you need to know right now is that a graphical user interface (GUI) allows users to interact with a computer through menus, buttons, and other visual options on the screen. The terminal, on the other hand, allows us to interact with a computer by typing text commands directly into the command line, which is housed in an area of the computer called the terminal.

Accessing the Terminal

Next, let's walk through how to access your own terminal and the command line it contains, so you can see how it works and what it looks like first hand.

Mac Setup

On a Mac, the terminal can be accessed by opening an application conveniently named Terminal. This application is located in the Utilities folder within your Applications folder.

You may also locate the Terminal program by clicking the magnifying glass icon at the upper right corner of the screen and typing "Terminal".

Open your own Terminal using either of these two methods now.

Windows Setup

Windows has a terminal program called Command Prompt. You can access it by typing "Cmd" in the search bar in the bottom left corner. It can be useful for navigating through files trees, running executables, and so on.

Unfortunately, Command Prompt doesn't have all of the capabilities we require. However, we can easily download and install a new terminal program that fits our needs.

There are many options available, but we recommend using a free program called Git Bash.

Navigate to the page and click on the "Download" button. This will take you to a page with the latest version of Git Bash. Determine whether you have 32-bit or 64-bit Windows by following these instructions. Then download the corresponding exe file from the Git for Windows site. (If you have a package manager already installed, you can also choose to download the tar.bz2 version.)

Click on the downloaded file and then follow the instructions in the Setup menu. Just click "Next" until you reach "Select Components." If you wish to add Git Bash to the desktop, click "Additional icons", which should automatically click "On the Desktop". (Click "On the Desktop" if necessary.)

Click "Next" until you reach "Choosing the default editor used by Git". The default is Vim, which is hard for beginners to use. Update this to "Use Visual Studio Code as Git's default editor". Then click through "Next" until you reach the "Install" button and install the package.

The Prompt

When you first open the terminal, you should see a short snippet of text followed by a grey or blinking rectangle. This rectangle is your cursor. Where the cursor is located is the command line. The command line is where we will type and execute our text commands.

The snippet of text left of the cursor is the command line prompt. It contains brief contextual information, such as the user account you're logged into the computer with, and your current location.

For instance, the prompts on Epicodus computers look something like this:

epicodus-5:~ Guest$

In the example above:

  • epicodus-5 is the nickname of the computer we're using.

  • ~ denotes that our current location is the home directory. (In programming, the ~ symbol usually refers to 'home'.)

  • Guest informs us we're logged into an account named Guest.

  • This is all followed by a dollar sign $. This symbol denotes the end of the prompt and the beginning of the command line.

Not all prompts look the exact same - including prompts on Windows. Depending on the names of your machine and the name of your user account, your own command line prompt will differ. So don't worry if yours appears different from examples here. That's completely normal.

For example, if our computer's name was "school-machine", and our account on that computer was named "Jenny", we'd see something like this instead:

school-machine:~ Jenny$

Both Bash (on Macs) and Git Bash (on Windows) use the $ prompt. If you are using a newer Mac, your shell may be zsh instead of Bash. This is completely fine. zsh is very similar to Bash - the main difference is that it has extended functionality beyond Bash. However, the functionality we'll need for Epicodus is all contained in Bash so you don't need to have zsh.

Command Notation

In our curriculum and elsewhere, you'll often see Bash commands preceded by a $. This means the command is meant to be executed in the command line. The dollar sign is the common notation to communicate this because most terminals display a dollar sign $ at the end of their prompt.

When you see this symbol preceding a command in one of our lessons, know that you are not required to literally type a dollar sign into the command line. You will only type the command listed after the dollar sign. The dollar sign simply denotes that the command is meant to be executed in the command line.

Great! Now that we understand the basics of the terminal and command line, let's practice. In the next lesson we'll learn about the most frequently-used commands, how and when to execute them, and what they allow us to do.

Lesson 3 of 8
Last updated July 28, 2020