Week 1 Lab: Git and GitHub

Git Repository: https://classroom.github.com/a/ULnY-eJJ

Your own git repository

In the readings, you read about version control and git. A repository is a specific, named collection of files that usually make up a single program. You’ve already used a git repository without really knowing it; all of the files for last week’s labs were stored in a git repository, which you accessed through a webpage (GitHub).

Create an account on GitHub

The first thing you are going to need to do is to create an account on GitHub (if you don’t already have one). Go to https://github.com, and click on the “sign up” button in the upper right corner of the window. Follow the prompts to create your account.

Using GitHub

Today, the first thing you are going to do is to get your OWN repository, on your computer.

To do this, it helps to understand what we want. A git repository is a place to store files. You can put a git repository on your own computer, on your partner’s computer, or have one out on a website in the cloud. I’ve created a repository for today’s lab with a number of files in it, and stored it on the website GitHub. But we can’t all use the same repository; if we did, then whenever you made a change to any file, everyone in the class would see it. And likewise, whenever anyone else made a change, it would change what you are working on. That would be chaos!

However, you do want to make it so that you and your partner both can work on the same repository. If you make a change, then your partner can see it. And if your partner makes a change, then you should be able to see it.

To do that, we are going to create a copy of my repository for today that you and your partner can use. This copy is called a fork of the repository.

Make a copy of the GitHub Repository for you (and your partner)

At the top of this page, there is a link to this week’s GitHub project. Click on that link and open it in a new window. What opens is an invitation to create a new team on GitHub. Since you are the first person on your team, make up a name for your team and type it in. (I recommend using both your first name and your partner’s first name.) Remember the name of your team – your partner will need it later.

Once you click the button to create the team, you will be asked to “Accept this assignment”. Click the button to accept it.

Once you have accepted it, what happens behind the scenes is that GitHub creates a copy of my repository for you and your partner to use. This sometimes takes a minute. Wait a second and refresh that screen until is says you are “Ready to go”. At that point, it means your copy of the repository has been created! There is a link in blue that goes to your copy of the repository. Click on it!

The webpage you see represents a GitHub project. If you look around, you can see that there are files in that project. Those files are stored in the repository that is inside the project on GitHub. Each project has one repository that contains the files for the project. There are also a lot of controls along the top of the web page that allow you to do things like see the “code” (aka the files); report bugs (“issues”) in the code, or change settings.

Congrats! You’ve now got your first GitHub project! Good work!

Set up your computer to use the new git repository

You’ve now got your own project, but right now it only exists on GitHub. That’s great – it is on a webpage where others can see it also. But it is hard to work with it on a webpage. All of the programming work you’ve done in this class is on your personal computer. It is difficult to do programming on a webpage; very few professional programmers work on webpages.

To work with on your computer, we need to get a copy of the repository – the files stored inside the project. To do that, we will use the command line tool called git.

Install Git

The first thing you’ll need to do is download and install Git onto your computer. You can do that from the Git Downloads Page. Do that now. If you are on a Mac, choose the “Binary Installer”.

On Windows, it will ask you a lot of questions. Just click next on ALMOST all of them. There is one question – What do you want your default editor to be? – that you need to answer. Click on the dropdown and choose the text editor that you use for editing in this class. On Mac, it won’t ask this.

Once you’ve got that installed, open up a command line window (either Powershell or Terminal). If you just type the command git, it should print out a bunch of help information about the different git commands. If it does that, then you’ve got git installed correctly! If you get an error message, then you didn’t install git correctly yet. (On Mac, if it prompts you to install XCode – DON’T! XCode does have git, but it is also an 8GB+ download, and will take hours to download. Go back and install the binary installer from the above webpage.)

The first thing we need to do is to set up git by telling it who we are and what editor we use. Use the following two commands to tell it who you are, substituting your name and email address for mine:

git config --global user.name "Rick Wash"
git config --global user.email "rwash@wisc.edu"

Be sure to keep the quotation marks. You should only need to do this once on your computer; after that, it will remember who you are. (Please do NOT use my name/email. Git does not check to make sure it is right, and if you use my name/email, then it gets confusing when it looks like edits are coming from me.)

Mac OS

Next, only for Mac OS, we need to tell git what text editor we use. This is harder on Macs than on Windows. On Windows, you probably already told it what editor to use when you installed it. So skip this section; you only have to do this if you didn’t tell git what editor to use.

On Mac, there isn’t a good text editor built in, so we need to tell it to use the one you installed during Week 0.

If you use BBedit, then click on the BBEdit menu in the upper left corner, and choose “Install Command Line Tools”. After that is done, then run this command to tell git to use BBedit:

git config --global core.editor "bbedit -w"

VS Code (both Mac and Windows)

If you use VS Code, we need to install the command line version of code. Hit Command+Shift+P on Mac, or Control+Shift+P on Windows to get to a search bar. Start typing “Install Code” until you see “Install ‘Code’ command in path”. Once you choose that, then the command line code tool will be installed. Then, to use it with git, run this command on the command line to tell git to use VS Code:

git config --global core.editor "code --wait"

Create a GitHub Access Token

GitHub recently changed to not allow passwords. Instead, you need to use something called an “Access Token” instead of your username and password. The access token basically replaces your password, when accessing your project through git. You should only have to do this once this semester.

To create an access token, go back to the GitHub webpage and click on your image in the upper right hand corner of the page and choose “Settings” to get to the settings for your user. Along the left side at the very bottom of the list is “<> Developer settings”. Click that to get to the developer page. The new menu on the list will list “Personal access tokens”. Choose the second type – “Tokens (classic)”.

On that page, you can click the link to “Create a new access token”. This will take you to a screen with a bunch of options for the access token. The first box is a Note; enter a description like “used for command-line git”. Under expiration, choose custom, and pick a date after the end of the semester (e.g. Dec 25). Under all of the checkboxes, click the “repo” checkbox, but leave the rest blank. Then click the Generate Token button at the bottom.

The webapge will reload, and near the top, it will print out a new “access token” which is basically a randomly generated password for you to use.

Write down this access token. (Or copy-and-paste it somewhere you can find it.)

GitHub will not show you this access token again. This is your only chance to write this down. You should only need to do the access token thing today; after completing this lab, git should remember it and never ask you again.

Clone the Repository

On your computer, you should make a place to keep your work for this class – all of the labs and studios that you work on. Me, personally, I created a folder on my desktop called “LIS 875” and keep everything in there. But its your computer, and you can put it whereever you want.

To work with a repository on your computer, you need to “clone” the repository – which means that we need to download the repository onto your personal computer so you can work with it. First, let’s set up your computer to be ready to clone. Open up a command line (using either Terminal (Mac OS) or PowerShell (Windows), as we did last week). Then change directories to the directory where you want to keep your files using the cd command. Remember, like last week, you can drag a directory from Explorer/Finder onto the command line, and it will type in that directory name for you onto the command line.

If you are using an LIS 875 folder on your desktop like I do, then the command to change directories is

cd Desktop/LIS\ 875

If you look at your project page on GitHub, in the upper right hand corner of the files list there is a green button labled “Code”. When you click on that, you get three options: “Clone with HTTPS”, “Clone with SSH”, and “GitHub CLI”. Those are just three different ways of accomplishing the same thing. In this class, we are going to use the 1st option: “Clone with HTTPS”. Click the button under “HTTPS” and it will copy a link to the repository onto your clipboard.

Next, we want to use the command line to actually clone the project. By default, this command will clone the project into whatever directory you are currently in on the command line. That’s why it was important that we cd into our folder for this class before running this command.

Use the command git clone to clone the project. On the command line, type in git clone and then paste in the link that you copied from the GitHub website. It should look something like this:

git clone https://github.com/lis875/git-and-github-professor-team.git

When you do this, it will ask you for your username and password. Don’t enter your real password! Instead, Log in with your GitHub username and then use your newly created “access token” as the password. If this works, then it should print out information telling you it is “receiving objects”, which means it is downloading the files for the repository for you.

Once it has downloaded, you will get a prompt on the command line again. If you use the command ls, you should see a new directory called “git-and-github-". Change directories into that using the command `cd`. If you do an `ls` again, you'll see that all of the files from the repository have now been downloaded onto your computer and are there for you to work with. If you look at the folder in Exporer/Finder, then you should also see the files.

Make a change

Next, let’s make a change. Open up the file README.md in your text editor. Right now, it has my name (Rick Wash) in there as the author. That’s not longer true – this is YOUR repository now! Change the name to your name.

Commit and Push the change

Now, you’ve change the file on your local computer. But if you go look at the file in the repository on GitHub, it still has my name in it. That is because you haven’t committed or pushed your change; that is, you haven’t made the change official. Git has this idea that you can edit lots of files, and try lots of things out, but it is only when you make something official that it actually gets recorded and put into the repository. And this process of making things official is something you have to do by hand, intentionally.

Doing this has three steps: add, commit, and push. Each of these steps is important, so let’s walk through them.

Add

Start by running the status command on the command line:

git status

This command will show you the current status of the local clone of your git repository that is on your computer. It will let you know if any files have been modified since the last version you got, and if any files have been added or deleted. You should see that you’ve modified the README.md file.

The first step is to let git know what changes go together. Sometimes you make changes in multiple different files, and you want all of those changes to logically go together as one commit. To do this, git has what it calls a “staging area” – a place you put changes until you’ve got the whole set of them together. You use the command git add to add things to this staging area. You can run this command multiple times if you want to add changes from more than one file to the same commit.

We only have one file with changes – README.md – so we only need to add one file to the staging area. Let’s do so with the git add command:

git add README.md

If this works correctly, then it won’t print anything out. It will just give you a new prompt. If it doesn’t work, then you’ll get an error message.

Note: On many systems, the filename is case sensitive; so if you get an error message, try to make sure the case is correct.

Commit

Once you’ve got all the changes together in the staging area, the next step is to “commit” those changes. Committing the changes takes all those changes, and creates a new version of your program that has those changes. That is, it formally records that these changes compromise a new version of your program.

To do this, we use the command git commit.

git commit

When you type “git commit” and hit enter, your default text editor should open up. A new file will open up in your text editor. Type the commit message on the first line of the file. SAVE and CLOSE the file! Once you do this, the commit should go through in PowerShell/Terminal.

When you run that command, then git will ask you for a message. This is a description what changes you are making. This description becomes an official part of the record – you can see it in GitHub by looking at the History of the repository (by clicking on the “1 commmit” link at the top of the file list). It is important to put a good, descriptive message here so that you – future you – can remember what changes you made and why you made them.

When you close the window with the commit message, git should complete the commit.

If a file doesn’t open when you git commit, then look at the Troubleshooting section at the bottom of this page.

Push

Committing the changes only records the changes in the clone of the repository that is on your computer. If you look at GitHub, your changes haven’t made it to the main repository yet. That’s what git push does – it takes any changes that are on your current computer that you’ve committed, and it pushes them up to the main repository on GitHub. Run that command now:

git push

Now go check the main GitHub page. Don’t forget to refresh the page. When you look at the README.md file, it should have your name in it now instead of my name. That means that you have successfully commited your first change to a git repository! Good work!

Swap and Repeat

The biggest benefit of git is collaboration – it makes it easier to work with other people on the same program. The next step of today’s lab is to learn how that works by swapping roles. The current driver (the person at the keyboard) will become the navigator, and the navigator will become the driver. And you should now use the navigator’s computer.

The new driver (former navigator) should first start by clicking the link at the top of this webpage. It will ask you to join a team. Click on the name of the team that you both created at the beginning of this lab and click the “Join” button for that team.

Next, go through all of the same steps, starting with “Set up your computer to use the new git repository” on the navigator’s computer. When you edit the file, add your name to the file, so that it says “By: Driver Name and Navigator Name”. Be sure to add, commit, and push the changes, and then check on the GitLab to make sure that the changes appear there.

Once you’ve done this, then there should be a single git repository on GitHub, and both members of the pair should have a clone of that git repository on their personal computer. Either person can work on the program, and then commit and push changes back to the repository at any time. This makes collaboration easier, because both people have a copy, and both people can work on it.

Git Pull

Swap roles again, so that the original driver is now driving again using their own computer.

If you look at the files on your computer, then you’ll notice that the newest change – the one that adds the navigator’s name to README.md – isn’t there. What is happening is that there are changes in the main GitLab repository, but they haven’t been copied down to your computer yet.

To do that, we can use the command git pull. This command will take all of the changes that are in the main repository, and pull them down to your computer. Run that now:

git pull

Now open the README.md file in the text editor on your computer, and you should see the changes, including both people’s names.

You want to run this command any time that your partner makes any changes and then commits and pushes those changes to the repository.

Git can be used by as many people as you want; there are git repositories with global teams and millions of people using them. Always remember to git pull to make sure you have all the latest changes before you start working.

Programming

Now that you’ve got the git repository, we can start working on programming in the files in that repository.

We are going to begin with the program bottles.py, which is a simple program that prints out lyrics to a song – the song 99 bottles of beer.

The first thing to do is to run the program on the command line:

python bottles.py

You should see it print out two verses of the song.

Exercise 1: Change the beverage

Right now, the song is being sung about water. The original song was about beer. What is your favorite beverage? Pick a new beverage, and change the song so that it is being sung about your favorite beverage.

Exercise 2: Last verse

The last verse gets down to zero bottles. No one likes singing about “zero” bottles. Most of the time, that last verse gets modified; for example, the Wikipedia article lists “No more bottles of beer on the wall, no more bottles of beer.” as the last verse.

Create a last verse that is more interesting for the song; one that doesn’t use the word or number “zero”.

Exercise 3: Git Commit

OK, now you’ve made some changes to your bottles program. The next thing you should do it commit that code to your git repository. Use the same sets that you used above – git add, git commit, and git push – to commit those changes and push them back to the main repository on GitHub.

Exercise 4: Swap driver and navigator

Now, swap driver and navigator. On the 2nd computer, you should then git pull. Run the program again with python bottles.py and make sure that the 2nd computer has all of the changes that you made.

Exercise 5: 5 bottles

The song right now starts with only 2 bottles. That’s not very many. Expand the song to start with 5 bottles of your favorite beverage, and then count down until there are none left.

Exercise 6: Git Commit

OK, now you’ve made some more changes to your bottles program. You should commit that code to your git repository. Use the same sets that you used above – git add, git commit, and git push – to commit those changes and push them back to the main repository on GitHub.

Then, swap again, and have the other person git pull on their computer, and see if all features added by both people are on both computers.

Exercise 7: Looping whole verses

Modify the program to print out 100 verses of the song. You should use a for loop to do this.

The final code for this program should contain less than 100 lines of code.

Hint: range(5) will count from 0 to 4. It always stops just before it gets to the end number. range(1, 5) will count starting at 1, so will count from 1 to 4. range(5, 1, -1) will count by -1, so it will count backwards from 5 down to 2 (because it always stops just before it gets to the last number).

Hint 2: A for loop uses a variable. for i in range(10). That i is a variable. You can use that variable inside the loop. Each time through the loop, the for loop fills in that variable with the current number. So the first time through the loop, i is 0; the second time, it is 1, the third time is 2, and so on.

Exercise 8: Change the final verse

Modify your program to change the final verse of the song. Rather than singing zero, have it sing a different ending. For example, here is one alternative ending to the song:

No more bottles of beer on the wall, no more bottles of beer. 
We've taken them down and passed them around; now we're drunk and passed out!

Hint: The easiest way to do this is to do one fewer loops, and then copy-and-paste your print statements to happen after the loop (not indented) and modify them so they look different.

Exercise 9: Change the 6th-to-last verse

There is an alternative way to sing the 99 bottles song, where the 3rd line is replaced with:

If one of those bottles should happen to fall, 98 bottles of beer on the wall...

Modify your program such that the 6th-to-last verse (“5 bottles”) uses this alternative line instead of the normal line.

Hint: You can use an if statement to check which loop you are on, and print out something different if you are on a specific loop.

Challenge: Alternate lines in song

Modify your bottles program so that every other line uses the alternative version. So the first verse should say take one down, pass it around, the second verse should say if one of those bottles should happen to fall; the third verse should say take one down, pass it around, and so on.

Hint: Python has a modulus operator: %. Modulus finds the remainder after division. So 13 % 5 is equal to 3, since when you divide 13 by 5 ,you get 2 with a remainder of 3. You can use this to figure out if a number is even or odd: if the line number divided by 2 has a remainder of 0, then it is an even number. If the line number divided by 2 has a remainder of 1, then it is an odd number.

Troubleshooting git clone

Sometimes, you get an error message when you try to download the repository using git clone.

Windows remembering your password

When you first run git clone, git will ask you for your username and password. both MacOS and Windows will remember these – it won’t ask you for them again after the first time. However, sometimes you get something wrong the first time. Usually Mac handles this well – if it didn’t work, then Mac will prompt you again next time.

However, Windows sometimes remembers this wrong username/password, and then git commands don’t work. To fix this, go down to the start bar and search for “Windows Credential Manager”. On the page that comes up, look through the list for the git/GitHub credential. I usually just delete the entry for git/GitHub. Then try running git clone again, and it should prompt you.

On MacOS, the equivalent is called “Keychain Access”. If you run the Keychain Access program, you can search for your saved GitHub password and delete it. Then when you try to git clone, it will ask again.

Troubleshooting git commit

This section contains extra instructions for troubleshooting problems with git commit. Specifically, do this if no file opens when you git commit and you immediately get an error message.

VS Code

The most common problem with VS Code is the need to install the shell utilities. Open VS Code, go to the menu, and then choose “Install ‘code’ command in path”. That will hopefully help git to open vs code properly.

Windows

If you can’t get Notepad++ or VS Code working, then on Windows, just run this command:

git config --global core.editor notepad

That will tell git to use the built-in notepad when it needs information from you, which works fine.

Another Alternative

If you can’t get an editor to work for git commit, there is another option. You can specify your commit message on the command line. You MUST have a commit message, but it can be short.

To do so, use the -m option to git commit:

git commit -m "Message goes here, in quotes"

If you can’t join the classroom

You can visit the original GitHub repository: https://github.com/lis875/git-and-github

From there, you sohuld be able to “fork” the repository by clicking the “Fork” button at the top. That will create a new copy for you. From there, you can work on that copy, following the instructions to clone that repository.