Code Along: Command Line Intro

Code Along: Command Line Intro

For Macs: * Open the “Terminal” app (Applications > Utilities > Terminal) * Optionally, download and install iTerm 2, which is a replacement for the terminal app that is more configurable.

For Windows: * Open the “Command Prompt” application. * For a better experience, try Console.

Get familiar with the basic commands on the terminal!

When copying the following code snippets, DO NOT include the $ this is a universal symbol to indicate that the anything following the ‘$’ should be entered into the command line

Step 0: Navigate to your class folder on your command line

  • From your command line, navigate to your class folder (i.e. the folder named jsd)

  • Navigate to your jsd from your Root Directory. cd ~ and then cd Documents/jsd (assuming your class folder is named ‘jsd’ and located in your Documents folder)

Step 1: Make a new directory and “change” into it

  • Create a directory named command_line_tutorial

    $ mkdir command_line_tutorial
    
  • Change into this directory

    $ cd command_line_tutorial
    

Step 2: Create some files from the command line

  • Create a file named “index.html” using the touch command.

    $ touch text1.txt text2.txt
    

Step 3: Open your your text editor from the command line

  $ atom .
  • Use subl if you are using sublime

Step 4: Create an empty folder and remove it

  • Create a folder named test_folder

    $ mkdir test_folder
    
  • Now remove it

    $ rmdir test_folder
    

Student Exercise - Part I : More Independent Practice

Complete the following instructions below in the Terminal application.

  1. Create a folder in your jsd/lesson_01_files directory named my_site

  2. Once inside that folder, create three empty files:

    • goals.html

    • worries.html

    • index.html

  3. Open the my_site folder with in your text editor

In the respective files (goals.html and worries.html), write your top three goals and top three worries for this course.

  1. Paste the following contents into index.html:

    <html>
    <head>
      <title>My Site </title>
    </head>
    <body>
      <a href="goals.html"><img src="http://i.imgur.com/dosK05U.gif" /></a>
      <br>
      <a href="worries.html"><img src="http://i.imgur.com/2s0HwpM.gif" /></a>
    </body>
    </html>
    
  • Open index.html with your browser and make sure you see your goals and worries.

Student Exercise - Part II: More Independent Practice

  • Use your new knowledge of the command line to create a lesson folder for each of the remaining lessons in the course inside your jsd folder

  • There are 20 lessons in the course and the lesson names should use the following format: lesson_02_files, lesson_03_files, etc

  • The last class should be named lesson_19_files (we started counting at 00)