1. Command Line Interfaces

At the end of the day, a program is just a text file on a computer. So, before we begin programming, we need to learn how programmers create, organize, and otherwise manage the files on their computers.

In this lesson, we'll learn about the Terminal, a program for interacting with a computer's files and executing programs through a command line interface (CLI).

You will be able to…

  • Understand what a command line interface (CLI) is.

  • Compare and Contrast CLIs and Graphical User Interfaces (GUIs)

  • Navigate your local file tree

  • Create, copy, delete, and move files and directories

  • How to run a JavaScript program using your CLI

  • Explain what an "argument" is

Table of Contents:

Key Terms & Commands

Key Terms

  • Terminal — A program for interacting with a computer's files and executing programs through a command line interface.

  • Command Line Interface — a type of user interface (UI) that let's a users perform actions by entering text-based commands.

  • Graphical User Interface — a type of user interface that uses visual elements such as icons, buttons, windows, and dialog boxes, allowing users to perform actions such as clicking, drag-and-drop, and more.

  • Directory — Another term for a "folder" in your computer that contains references to files or possibly other directories.

  • Working Directory — The directory where your commands will be executed.

  • Command - A single action to be performed on your computer. Examples include creating a new file, listing the contents of the current directory, navigating to a different directory, or executing a program.

  • Argument — An additional piece of information provided to a command to change the command's behavior.

  • Node — A program for executing JavaScript code directly on your computer (as opposed to in a browser).

Important CLI commands

Note: In the commands below, argument placeholders will be written like this: [argument]. When using these commands, replace the [argument] with your desired inputs, making sure to leave out the [] as well.

The File Tree

The files and folders in your computer are organized in a tree-like structure called the File Tree.

We refer to each folder in the file tree as a directory. The root directory is the top-most folder that contains all other sub-directories.

Q: What are the ways that the file tree is tree-like?

The root is like the trunk of the tree and each sub-directory is a branch that can have more branches.

Applications for Viewing the File Tree (CLI vs. GUI)

Most operating systems have an application that lets you view the device's file tree. For example, on MacOS there is Finder and on Windows there is Explorer:

The finder program

These applications allow you to manage files through a graphical user interface (GUI) — a user interface with buttons and icons that let you do things like click and drag-and-drop.

These GUIs are examples of an "abstraction"—a layer that hides complexity—and GUIs present a tradeoff:

  • GUIs are easy to use and easy to learn for beginners

  • What you can do with GUIs is limited to how they were designed

When we want more fine-tuned control over how we interact with our computer's files, we can turn to a command line interface (CLI), often called the Terminal. The Terminal is a program for interacting with a computer's files by executing typed-in commands:

The Terminal program

In the screenshot above, you can see this user entering commands:

Note that some commands like pwd can be entered on their own. Other commands like mkdir may use inputs called arguments. Some commands like ls can be used on their own or with arguments.

Q: Why use The Terminal?? It would be wayyy faster to do this in the Finder

For this particular task it might be faster to use a GUI file manager like Finder, however there are many tasks where a CLI like the Terminal can outpace a GUI like Finder.

For example, try this command below to create 8 folders at once!

In addition, there are some things that Finder simply can't do, like execute files with code.

Using the Terminal in VS Code

While you can use the Terminal application that comes with your laptop, it is often just as convenient to use the one that comes built into your VS Code code editor.

To open up the Terminal panel, go to File > Terminal and it should show up at the bottom:

Use the keyboard shortcut Control+` to open/close the Terminal

Essential Commands

Let's go through some of the most important and commonly used commands.

Looking at the Working Directory with pwd and ls

In the terminal, you can only interact with one directory at a time, the working directory.

Think of it as the "you are here" icon in a map.

The working directory is your current location in your file tree.

The pwd command prints the full file path to the working directory while the ls command prints the contents of the working directory:

{% hint style="info" %}

Note: In computing, all actions that interact with data fall into one of the four categories called CRUD: creating, reading, updating, or deleting data.

Which of these actions do you think pwd and ls are?

{% endhint %}

Navigating Between Directories with cd

The cd [directory] command allows you to move to another directory in the file system. However, unlike the previous commands, it requires an argument.

An argument is an additional piece of information that changes that behavior of a given command. For the cd command, we have to also provide a destination.

{% hint style="info" %}

Use the Tab key to autocomplete commands and filenames! Just start typing and hit Tab to autocomplete.

{% endhint %}

For example, suppose we were located in the /Users directory inside the following file system:

The file tree

I could navigate to "down" to the /Users/smith directory with the command:

You can also extend the directory provided with a / to quickly navigate to directories within directories. For example, if I were located in the /Users directory, I could navigate to the /Users/smith/Documents directory in one command:

To navigate back "up" to the "parent" directory, you can use the special directory name .. which always refers to the parent directory of the working directory.

For example, if I were in the directory /Users/smith/Documents and wanted to go back up to the /Users/smith directory, I could enter the command:

If I had wanted to go up two levels from /Users/smith/Documents to /Users, I can again use / to extend the provided directory name:

Suppose I were located in the /Users/smith/Documents directory, how could I navigate to the /Users/jones/Desktop directory in one cd command?

Be Careful when using the cd command!

Using the cd command on its own will send you to the root of your entire file system (~/). This is the equivalent of using the command:

Making Files and Directories with mkdir and touch

mkdir [dir_name] creates a new directory in the working directory

touch [file_name] creates a new file in the working directory. Make sure to include the file extension!

You can also create multiple files/directories at once by listing multiple file/directory names:

Executing JavaScript files with node

A JavaScript program is any file with a .js extension, like hello.js

The code can be as simple as console.log("Hello World")

To run the program, use the command node hello.js

Terminating a Program with Control+C

Many programs will end ("terminate") on their own when each statement has been executed.

Other programs can run forever, requiring us to stop them ourselves. For example, when we use the node command on its own, it will start the Node REPL (Read, Evaluate, Print Loop) program which just waits for Javascript input, executes it, and then prints the result:

The Node REPL is useful for testing out expressions.

To terminate the program, use the keyboard shortcut Control+C (you may need to cancel twice).

Additional Commands

Unfinished Double Quotes, echo, and >>

Another common occurrence is an unfinished string. You can test this with the echo command which will print a given string straight to the terminal.

An unfinished double quote will be produce dquote> in the Terminal, waiting for you to finish the string.

You can also use the output from an echo command and send the output into another file using the >> append operator.

For example, this command will take the text "hello world" and append it to the file output.txt (it will create output.txt if it doesn't exist)

The cat Command and Combining Commands with &&

The cat command is used to read the contents of a given file.

You can combine any two commands with the && operator.

For example, the command above lists the contents of the current working directory and print the contents of output.txt

Removing, Renaming, Moving, and Copying

rm [file_name] removes a file from the working directory

rm -r [directory_name] removes a directory and all of its contents from the working directory. -r stands for "recursive".

mv [file_name] [new_file_name] renames a file in the working directory or allows you to move the file to another directory.

cp [file_name] [dir_name] copies a file into a directory.

Challenges

Check out these awesome challenges for additional practice. A lot of these challenges go way beyond what we've learned in this lesson and will push you to research and learn on your own!

We're using Linux commands so whenever you are researching a topic, add "Linux" to the end of your search so that you get appropriate results! For example, for the first challenge you may search "how to unzip .tar.gz file linux".

Challenges 1-19 are the basics of what you'll want to know for this course.

Challenges 20 you should skip. It involves executing a file that we can't see the contents of.

Challenges 21-50 are more advanced.

PreviousOverviewNext2. Git & GitHub

Last updated