If you are an aspiring developer, you will need to conquer any fear you have of the command line. These slides introduce a bare bones arsenal of commands that will have you fearlessly telling the you computer what to do.
2. Take Command of the Command Line
refactor u
If you want to become a developer, you’re going to need to understand the
command line.
It’s powerful.
When you know how to use it, you can navigate your dev environment quickly and
automate your workflow.
After today’s intro you too will be taking command, unlocking the power of this tool!
3. refactor uTake Command of the Command Line
Press COMMAND and space bar together making the Mac “search bar” appear.
In the search bar type “terminal”.
Click the Terminal application to open it. Terminal looks like a black canvas with a silver
frame.
With Terminal open, go to your Dock. CTRL-click the Terminal icon.
Select Options->Keep In Dock. See figure 1-1 in the next slide.
Setup
4. Take Command of the Command Line
refactor u
Figure 1-1:
Setup
What you achieved:
Congrats! If you’ve made it this far, you now
have your Terminal directly accessible on
your dock, the first step towards taking
command of the command line.
Now click on the Terminal icon to launch
Terminal.
5. Take Command of the Command Line
refactor u
Type the following : $ pwd
$ pwd (present working directory)
You just typed your first command. It shows in which directory you are
currently working. Directory is just a fancy name for folder. Working in the
Mac OS GUI, you are probably accustomed to moving in and out of folders.
Developers navigate in and out of directories on the command line and $ pwd
is a great way to see where you are.
What you will see: /Users/yourusername
What you achieved:
A quick word before we start typing commands, the ‘$’ in front of the command is there to orient
you. It’s the prompt. You may have a ‘$’ or maybe a ‘>’ on your command line but you don’t
type the ‘$’ before the command.
6. Take Command of the Command Line
refactor u
Type the following : $ mkdir test
$ mkdir (make directory)
You created a directory called test. You can’t see it but assuming that you did
not receive an error message after typing the command, the directory is
there.
What you achieved:
7. Take Command of the Command Line
refactor u
Type the following : $ cd test
$ cd (change directory)
You changed directories. You can’t see the change. Or, can you? How do
developers see their present working directories? After you type the
command to see where you are, create two more directories called test01
and test02 using $ mkdir.
What you achieved:
8. Take Command of the Command Line
refactor u
Type the following : $ ls
$ ls (list directory)
$ ls is the command to list the contents of a directory. Being inside of the
directory test, which you created, typing $ ls revealed two other directories.
Try a couple of other commands. Type $ ls -l. Type $ ls -la. What do you see?
What you will see: test01 test02
What you achieved:
9. Take Command of the Command Line
refactor u
Type the following : $ touch myfile01.txt
$ touch (create file)
You created an empty text file called myfile01.txt. $ touch does this. Create a
couple more files. Call them what you want, but, realize that if the files have
spaces in the names you will need to add the ‘’ character in front of each
space to escape it ($ touch my file02.txt). If escaping sounds too
complicated then just keep all spaces and special characters out of your
filenames for now and name the files something simple like myfile02.txt and
myfile03.txt.
What you achieved:
10. Take Command of the Command Line
refactor u
Type the following : $ rm myfile01.txt
$ rm (remove file)
You just permanently removed myfile01.txt! It’s gone forever! Unlike the Mac
OS GUI, there really is no trash can in the command line. When you remove
files and directories they are gone for good. Remember, the command line is
powerful and with great power comes great responsibility. Use $ rm carefully!
Now that myfile01.txt is gone, use $ ls to see what’s left in the directory. Try
removing the test01 directory. What happens when you type $ rm test01?
What you achieved:
11. Take Command of the Command Line
refactor u
Type the following : $ rm -r test01
$ rm -r (remove recursively)
So when you typed $ rm test01, the system likely reported back the
following message: rm: test01: is a directory
$ rm on its own can remove files but not directories. $ rm needs the -r flag in
order to remove a directory. Flags are options which when passed with the
command, modify a command’s action. In the case of our rm command, the -r
flag stands for recursive, a fancy way of saying “let the rm command remove
not only the directory but, also all the inner contents of the directory.
What you achieved:
You removed a directory using rm. Again, be careful with this command.
Given what you’ve learned, how might you make sure you are in the right
directory and verify the files and directories you want to remove are there
before removing them?
12. Take Command of the Command Line
refactor u
Type the following : $ mv myFile01.txt newFile.txt
$ mv (move file)
$ mv is the command to not only move a file to another directory but also can
rename a file. Renaming myFile01.txt to newFile.txt is what you achieved
here. How might you verify the result?
What you achieved:
13. Take Command of the Command Line
refactor u
Image Optim-CLI is a tool for Mac which automates three image optimization programs:
ImageOptim, ImageAlpha and JPEGmini. Keeping image file sizes small, is crucial in
just about all aspects of web development from building small websites to building large
applications.
Let’s install ImageOptim-CLI.
ImageOptim-CLI
Type the following:
$ curl --output imageoptim-cli.zip https://codeload.github.com/JamieMason/ImageOptim-CLI/zip/1.11.6
14. Take Command of the Command Line
refactor u
ImageOptim-CLI
Type the following three commands:
$ unzip imageoptim-cli.zip
$ mv ImageOptim-CLI-1.11.6 ~/ImageOptim-CLI-1.11.6
$ export PATH=$PATH:imageoptim-cli/bin
So you likely noticed your terminal reporting a download after you executed the $ curl.
$ curl is a command to transfer data to or from a server. In this case, you used curl to grab
a .zip file and transfer it from the server to your machine. Now let’s unzip it.
15. Take Command of the Command Line
refactor u
ImageOptim-CLI
Type the following two commands:
$ cd images
$ imageoptim -j -a -q -d ./
With ImageOptim installed, we’re ready to optimize some images.
16. Take Command of the Command Line
refactor u
Resources
ImageOptim-CLI on Github
Now that you have taken command, what’s next? You have an excellent start but there’s
plenty left to learn. Below are some resources that build on what we’ve learned today.
RefactorU’s course Getting Started as a Web Developer covers the command line.
Professional developer Zed Shaw has a course listed below as well. Both are excellent!
Meet ImageOptim-CLI
ImageOptim Command Line
Getting Started as a Web Developer
Learn Code the Hard Way : CLI