Skip to content

The Command Line

A command line interface showing commands like mkdir,
touch, ls, and cat

The longer you work in web design and development, you will be asked to run things on the command line.

In this segment we will attempt to help you feel more like a confident hacker in a movie, and less like someone who is about to destroy your computer.

Why use it?

  1. Low-level control. User interfaces often do not provide the nitty gritty detail you need as a programmer, especially when installing things or fixing a problem.

  2. Universality. With the Unix shell available or installable on all nearly all computers, the command line becomes a universal interface for performing actions in a dependable way, and communicating with other developers about how to do things (installation, configuration, etc.). This includes web servers, which do not have graphical user interfaces.

  3. Automation. You can package several commands up into a script and save them in files ending with .sh, so that they can be run all together with a single command.

  4. Continuity. The Unix shell has been around for decades, while many GUIs have come and gone. So if you invest time in a project that uses it, the project will have a longer lifespan too, because it won't depend on something that might fall out of fashion.

  5. Usability. OK, the user experience of the command line does leave much to be desired, at first. But once you learn it, you will find it is highly interactive, fast, endlessly customisable with colors, symbols, emoji, colors, and animation.

Unix shell

When you open a shell on Windows, Mac, or Linux, you automatically have access to a small language of commands that are known as shell commands.

There are different dialects, and the most popular one is Unix, which describes a set of commands that are available on Linux and Mac OSX, and which can be installed for free on Windows.

Windows options

  • Git Bash (included with Git for Windows)

  • Windows Subsystem for Linux

Learning the Unix shell

The command line is highly interactive, so the best way to learn is to get a list of commands and try them out.

One popular cheat sheet is Rehan Saheed’s “Bash Cheat Sheet.”

Try it out

Try these commands out in a safe sandbox environment.

Starting with the contents of this folder, can you accomplish these tasks just with shell commands?

  1. Move the images to their own folder

  2. Make some more copies of the images

  3. Create an empty index.html

  4. Create an empty styles.css

  5. Delete the old code

References

Martinez, Bellatrix. “The Command Line from a Designer’s View.” Medium (blog), July 30, 2018. https://medium.com/@bellatrixmartinez/the-command-line-from-a-designers-view-c4a8c8cebf51.

Saeed, Muhammad Rehan. “Bash Cheat Sheet,” November 24, 2023. https://github.com/RehanSaeed/Bash-Cheat-Sheet.

Mozilla Developer Network. “Command Line Crash Course - Learn Web Development,” August 11, 2023. https://developer.mozilla.org/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Command_line.

“Git for Windows.” Accessed November 25, 2023. https://gitforwindows.org/.

Content CC BY 4.0 | Code AGPL 3.0