Objectives

The goal of this module are to:

  • Set up the accounts you will need to write and submit code
  • Learn the basics of Git

Deadline: Friday 9/04 before 11:00PM.

1. Creating GitHub account

GitHub is a service for storing and sharing code repositories. You will use it to submit your programming assignments. If you already have a GitHub account, you do not need to create a new one especially for this class.

  • Go to https://github.com/ and enter your info to “Sign up for GitHub”.
  • Choose the free plan
  • Use your real name and an email you have access to (gwu one is good)
  • Upload a profile picture (makes it easier in this online teaching context for people to associate a face with the submission)
  • Remember your GitHub ID (you can see it in the profile page. For Prof. Leontie is rleontie under her name)
  • After creating your account, complete this survey ONLY IF YOU HAVE NOT DONE IT ALREADY.
  • Accept your invitation to the fall20-2113 organization (you would only have received one if you already filled the survey by the due date)

2. Git Web Interface

Setup your assignment repository here: https://classroom.github.com/a/ox0vOVOQ

This will create a copy of the repository for your GitHub account.

  • Click the link to view your version of the repository
  • Be sure that it lists your github username in the repository name!

Lab 1.1: Follow the steps below to edit your first file on GitHub.

Edit the README.md file by clicking the small pencil icon on the right side of the screen. This will open a web-based text editor to modify the document.

  • Fill in your name, email, github user name, and tag line
  • Check off any tasks you have completed by changing them to: [X]

The file you are editing is in Markdown format, which provides a simple way to add basic formatting (bold, headings, images, etc) to a text file. The current file has Bold text and unordered lists. Go learn more about markdown here. Use your new knowledge to:

  • Edit the file so your tag line is in italics
  • Add a named link to the course website

When you complete your edits, preview your changes to verify the formatting looks right. Then click the Commit changes button. You can leave the default commit message and be sure the “Commit directly to the master branch” option is selected.

GitHub will record all past revisions of your files. If you want to make more changes, just edit the file and click Commit again.

Important: The files in this GitHub web interface are what we will grade for your assignments. You will still be able to edit files and make commits to your repository after the deadline, however, only the version prior to the due date will be considered.

3. The Git Command Line Interface

Most of the time we will not be writing files directly in the GitHub web interface. Instead, you will clone a copy of the files to your computer, edit files and commit your changes locally, and finally push your modified files back to the GitHub site to share with others (like the instructor/TAs).

Command Line Basics

We will practice doing this on your personal computers. Please open a Terminal in macOS and Linux, or git bash or Cygwin terminal for Windows users

Lab 1.2: For the next part of the lab you should keep one web browser open to GitHub. Record your answers to each question in the README.md file in your GitHub repository using the web editor. Write your answers under the ## Lab 1.2 heading.

  • You can print a message to the screen by running the command: echo 'Hello World'
  • You can save the output of a command to a file by using the > symbol
  • Run this command echo 'Hello World' > tmp

Lab 1.2a: Did it print “Hello World” to your screen? What does this tell you about the > symbol?

  • You can print the contents of a file to the screen using the cat command. Try running cat tmp and verify that it prints out the words that you stored into it with the echo command.

Lab 1.2b: What is the output of cat tmp when you run the following commands:

echo 'Hello World' > tmp
echo 'Goodnight Moon' > tmp
cat tmp

What does this tell you about the > symbol?

  • The > symbol for output redirection works for any command.

Lab 1.2c: What does cat tmp > tmp2 do?

  • To see the files you have created from the command line, use the ls command to list the names of files in the current directory.

Lab 1.2d: What is the output of running ls?

  • As may notice that sometimes the files displayed in the File Hierarchy/Explorer/Finder do not always match what ls displays.

lab 1.2e: Where did you actually saved those files on your computer? Use the command pwd to find out the path.

BEFORE CONTINUING: Commit all changes you have made to your README.md file on the GitHub web interface! The file should now contain your answers to Lab 1.2.

Command Line Git

Git is a distributed version control system. Learn more!

Simply put, this means that the files in a Git repository can be worked on by multiple people at the same time. This is great for companies with many developers working on a shared code base. However, it is useful even for one person – Git lets you coordinate and synchronize files across multiple computers. For example, if you use a laptop at home, a desktop at your parents’ house, and a different computer in the lab, Git can help you keep your files up to date on all of them.

  • Let’s make a directory specifically for this class in your preferred location named fall20-2113. Hint: you could use mkdir fall20-2113 to create the folder form command line; just make sure you first navigate to the right place using cd.
  • Now go to the folder cd path_to_folder/fall20-2113

  • Verify that Git is installed on your machine with git --version should output something like:

    git version 2.24.2 (Apple Git-127)
  • NOTE: if you don’t have git please download it and follow the installation instructions here

Lab 1.3: Follow the instructions below to complete this exercise.

To be able to work with the files in a Git repository, you need to clone a copy of it. To do that, we need to know the unique URL for the repository.

  • Browse to the root of your Lab 1 repository on the GitHub website. Click the green Code button on the right side of the screen and copy the URL. You should get something like: https://github.com/fall20-2113/lab1-YOUR_ID.git

how to get git clone link

  • In your Terminal, run the following command, filling in your URL:
git clone REPO_URL

You are going to be asked for your GitHub account credentials:

Cloning into 'lab1-YOUR_ID'...
Username for 'https://github.com': YOUR_ID
Password for 'https://YOUR_ID@github.com':
  • Your git repo files are in a different folder. To change directory to another folder in a Linux command line use the cd FOLDER command. Use cd lab1-YOUR_ID to move into your folder, then run the ls command to list its files.
    • You might notice that the File Hierarchy shows a folder named .git, but ls does not. This is because by default ls will hide folders or files that start with a period (often these are system or configuration files). You can use ls -a to see all files, or even ls -a -l to see all files and extra statistics about them. Note that command line argument ordering for ls doesn’t matter, so all of these are identical: ls -a -l = ls -al = ls -la = ls -l -a
  • Use the cat command to display the contents of your README.md file. Verify that it matches the one on the GitHub website.
  • Now open your README.md file using your favorite text editor (Hint: you could even open this in Visual Studio Code).
    • Add a heading for ## Lab 1.3 using the Sublime Text editor. Write This was written using a Text under the heading and then Save the file.
    • In the command line run this command: git status (be sure you are inside your repo folder)
    • You should see output like:
    $ git status
On branch master
Your branch is up-to-date with 'origin/master'.

Changes not staged for commit:
(use "git add <file>..." to update what will be committed)
(use "git checkout -- <file>..." to discard changes in working directory)

        modified:   README.md

no changes added to commit (use "git add" and/or "git commit -a")
    • This tells us a lot of information, including the fact that we have modified README.md. It also tells us what command we need to run to add the file to be committed.
  • Start typing the command: git add RE but don’t finish typing the file name.
    • A very hand feature in most terminals is Tab completion. Press the <tab> key and the rest of the file name (README.md) should appear automatically. This is a good way to save time and avoid file name typos! This is my fave linux command!
    • The full command should be git add README.md press enter to apply it.
  • Adding is the first step, but your repository is not updated yet. To preserve our changes we need to run: git commit -m "add Ex 3 header". Run this command now.
  • We have now committed our files to the repository stored on the local computer. Use your web browser to reload the GitHub version of the file – does it contain your updates?
  • In order to make GitHub be aware of your change, we need to push the update to the Github server. Run the command: git push origin master
    • You will need to enter your GitHub username and password. Note: your password will not show up as you type. Just type it in and hit enter.
    • This tells git to push (upload) your files to the remote server named “origin” to the “master” branch. We’ll learn more about branches and remote servers later.
    • Refresh your view on the GitHub website - does it show your updated file? It should!

Remember: If you work on files on your local computer , they will not be uploaded back to your GitHub repository until you:

  • git add FILE1 FILE2 ... FILEN
  • git commit -m "A USEFUL MESSAGE"
  • git push origin master
  • You should always check the GitHub website to verify that it has the latest files

this is what we will grade for your assignments!

Only continue if you have successfully pushed your code to GitHub. Otherwise, get help!

Version Control

The benefit of git is that it tracks all versions of your code, allowing you to rollback or recover lost code.

Lab 1.4: Follow the instructions below to complete this exercise.

  • Suppose our goal is to add another line of text to our README.md file. Run this command in your terminal, ensuring that you are in the same directory as that file.
echo '## 1.4 Version Control' > README.md
  • Now look at the contents of the file using cat or in the MobaXterm Editor (be sure to Refresh the file to get the latest version). Oh no! We accidentally overwrote all of our hard work instead of appending just one line!
  • Don’t panic! Git can rescue us. Run git status to see if it has a suggestion.
    • You should get a message indicating that the file has been modified and how to either add your changes in order to commit them, or how to checkout an old version to revert back. Run the command that it suggests to revert back to your last committed version.
  • Let’s try adding a line to our file again, but this time we will use >> which means to append to an existing file, rather than overwrite it.
 echo '## 1.4 Version Control' >> README.md
  • Verify that the file has the correct contents using cat or by refreshing the file editor.

  • Now let’s add some markdown text that indicates we want to add a section of formatted text. Type this carefully!

    echo '```' >> README.md
    • This will write three back tick characters (`) into your file, which is the Markdown syntax for a block of text that you don’t want to be processed (i.e., some source code that you want to appear exactly as you type it). It is important that you surround the back ticks in single quotes (' not "") because otherwise the terminal will interpret them as a special command!

  • Now run:

    git log >> README.md
    • This will print git’s historical log into your file. Remember to use >>!
    • Note that if you just run git log without writing the results to a file it will let you scroll through your history with the arrow keys. To exit and get back to your terminal, hit q.
  • Finally we need to indicate the end of our code block, so we need to print three back ticks again. Rather than typing the command in again, just hit the up arrow a few times to scroll through the commands you have run recently. Another handy shortcut!
  • View your file in the Editor and verify that it shows a series of log messages similar to:
commit 036660ba38b456961fb3705294050c925efbf2da
Author: Roxana Leontie <roxana@gwu.edu>
Date:   Sat Aug 29 16:46:36 2020 -0400

    add Ex3 header
  • Congratulations! You have now completed the lab. Repeat the commands you did earlier to add, commit, and push your README.md file. Verify that the version on the GitHub website has all of the correct content and you are done!

What did we learn?

  • How to work with Markdown files in the GitHub web interface.
  • How to navigate through folders in a terminal and read/write files.
  • How to redirect output from a command into a new file, or to append to a file.
  • How to clone a copy of a git repository, modify files, and push our commits back to the GitHub web site.

Here are some tips if you get stuck:

  • Press ctrl-c to cancel/exit out of many command line utilities
  • Press the tab key to auto-complete file or folder names
  • Use git status to get helpful advice about what commands you need to run next
  • Be sure you are inside the right directory when you run your git commands. If you get the error fatal: Not a git repository then you are in the wrong place.
  • Change between directories with the cd FOLDER command
  • If you just type cd and hit enter it will take you directly to the root of your user’s home directory.