This guide features a brief introduction to how file paths work, so you can
point to files and directories in your programs or terminal commands. This is
essential knowledge for your programming (and terminal) proficiency, and it will
help you make basic operations with confidence.
After this guide, you can move on to our
Terminal Navigation Exercise. This
will provide a deeper understanding of the relationship between your terminal
and the file explorer you’re used to. It’ll also guide you through running your
first commands!
To help you sort and quickly find what you need, your computer allows you to
save your data within an organized system of files and folders (also known as
directories). Directories can contain other directories, which in turn can
contain other directories, which—wouldn’t you believe it?—can contain even more
directories. This organization results in a hierarchical structure known as
the file tree (or, in slightly imprecise terms, file system).
Directory/
…
Directorymy-website
Directoryimages
picture.png
Directorysrc
Directoryblog
post1.html
post2.html
…
about.html
index.html
README.md
An example of a portion of a file tree.
A file path is the location of a file in the file tree. Think of this as
a convenient address which points the computer to the location where it can find
the file or program!
While each file in the file system has a unique canonical path or position in
the file tree, its address can be expressed in different ways according to your
needs or preferences. The most important are:
absolute paths, which point to the position of the file starting from the
base (root) of the file tree
relative paths, which point to the position of the file from a specific
position in the file tree
Absolute file paths specify the location of a file from the base (root)
directory in the file system. They give you the universal location of a file:
no matter where you’re currently standing in the tree, the same absolute path
will always point to the same file.
As mentioned above, the representation of an absolute file path differs slightly
across different systems. For example, take the file tree below:
DirectoryUsers
Directoryusername
Directorymy_directory
my_file.txt
The absolute path of my_file.txt as represented in Windows includes the disk
drive (for example C:\, commonly the top of a Windows file tree) and uses
backslashes (\). In Windows systems, absolute paths always start with the
disk drive.
C:\Users\username\my_directory\my_file.txt
An absolute path as represented by Windows.
MacOS and Linux, by contrast, don’t list the disk drive and use forward slashes
(/). In Unix systems, absolute paths always start with a single /.
The absolute path to my_file.txt on one of these systems would be:
/Users/username/my_directory/my_file.txt
An absolute path as represented by MacOS or Linux.
Sometimes, absolute paths can start with a tilde (~). This represents the
“home” directory of the current user. This is usually where a user stores their
Documents folder.
Relative paths describe the location of a file in relation to where you’re
currently located in the file tree. Since your position in the file tree may
differ according to what directory is currently open in your terminal or which
directory you ran a program from, the same relative path may point to
different files.
In coding, it’s often useful to use relative paths for files and
directories. This allows a program to more easily work across different
machines (since the organization of the files in a system is often a matter of
personal preference) or to target different files according to where the program
is run from. They’re also often shorter and thus easier to type and remember!
Relative paths usually start with the name of a file or directory (without a /
or disk drive letter), or a relative path shorthand, like . (for the current
directory) or .. (for one directory up from the current position).
For example, take the file tree below:
Directorymy-website
Directoryimages
picture.png
index.html
If you want to use picture.png from your index.html code, you can do so
using the relative path ./images/picture.png (note the .) or
images/picture.png (without the /). This file path will continue to work
regardless of where you move the my-website directory.
If you decide later you want to move your HTML file under a different directory,
the relative path of picture.png will change. For example:
Directorymy-website
Directoryimages
picture.png
Directorysrc
index.html
In this case, you would update the relative path in index.html to
../images/picture.png. The double dot (../) tells your computer to move up
one directory from your current position and look for images/picture.png
starting from there. Once again, this path will work regardless of the position
of my-website in the file system.
When you look at the file explorer on your operating system, you’re viewing a
visual representation of your computer’s directory structure. You can navigate
through this structure by using double-clicks (or taps) to open folders and
explore.
Since a terminal is just another way to interact with your computer, you can
also navigate your directory structure and look at your file tree inside the
terminal, using terminal commands and text to move across different places.
The must-know commands for navigating using a terminal are:
pwd[print working directory]
Shows your current location.
cd <file_path>[change directory]
Moves you to the file path provided.
You can use relative or absolute paths, including shorthands like ~ (home),
. (current directory), and .. (up one directory).
ls[list]
Lists all files and directories right below your current directory.
While you may have some trouble remembering these commands at first, rest
assured: you’ll find yourself typing them often enough that they’ll quickly
become second-nature.
Now that you know some commands for navigation, you may be wondering what to do
with them. Don’t worry:
the previous section covers how to run these commands and more!
With that knowledge and just these three commands under your belt, you’ll be
able to move across your file system like a real terminal professional.
As you know, learning just a few basics about the terminal will have a drastic
impact on your coding journey. Once you’ve become comfortable with it, we
recommend you learn another skill with similar outsized impact: Git.
Sign up below to get notified when our Git zine will be available for purchase!
In the meantime, if you want to get started on your own, you can check out our
basic Git Resources for information on
how to install and
how to set up this powerful programming tool.
Sign up here to be notified when the guide is available for purchase:
Your email has been added to our list. We look forward to sharing The Fujoshi Guide to Web Development
with you!