Using GitHub and Repl.it for assignments

Prepared by Nasser Giacaman for SOFTENG 206, SOFTENG 281, and MECHENG 270

These instructions are provided to help you use GitHub in this course.

Follow these instructions carefully. There are a couple of issues you might encounter, and we warn of these in the respective steps.

If you encounter any problems, check the FAQ section below.

1 Sign Up to GitHub and Repl

If you don’t already have accounts to GitHub and Repl, you will need to create them.

  1. First, sign up to GitHub. It is recommended to use your UoA username as part of your GitHub username.
  2. Second, sign up to Repl. Using the same GitHub account you made in the previous step, using the Sign Up via GitHub option shown below:

2 Accept assignment invitation

Your lecturer will share with you an invitation link for GitHub Classroom. Each assignment will have its own invitation link.

2.1 Clone the GitHub assignment repository

The first step involves cloning the GitHub assignment to your own account. This will create a private copy of the code provided by the lecturer, and will add it to your own GitHub account.

  1. Click on the assignment invitation link provided by your lecturer.

  2. If this is the first time you access this course’s GitHub invitation, you might be asked to select your name from the course roster. Select your name/identity if prompted.

  3. Click the Accept this assignment button as shown below:

  4. You will see the following processing taking place, wait for them to complete:

  5. When you see the following page, click URL of the cloned repository as shown below:

  6. If you see the following page, you have successfully cloned the assignment to your own GitHub repository:

    Important: Do not click the Work in Repl.it button just yet. See the next section first!

2.2 Create the Repl workspace

Follow the following instructions if you need to work on your assignment (or test your assignment) using the online Repl IDE.

  1. Due to a known Repl authentication bug, you should first make sure you are logged into Repl before you click the Work in Repl.it badge in your README.md file.
  2. Sign into Repl using your GitHub credentials. You should see the following:

  3. Now that you are logged into your Repl account, go back to your GitHub repository and click the Work in Repl.it badge as shown below:

  4. Potential Error
    Usually when you click the Work in Repl.it badge for the first time, it will take some while to load correctly (while it tries to clone the code for you). If it takes too long, or you get the following error message, simply go back and click the Work in Repl.it badge again.
  5. When you click on the Work in Repl.it badge and it starts loading correctly, this step may take a few seconds. You will most likely see the following as everything loads:

    Still loading…

    HINT: If it seems to take too long and appears stuck on one of the above progress images, you can try closing the tab and try the previous step again (clicking the Work in Repl.it badge).
  6. Once you see the prompt ( ) in the console, you are done and ready to code in Repl!

    Even if this prompt isn’t visible, it might still be ready (try and click the Run button).

3 Working in Repl

Once you have your Repl workspace created, you can explore the Repl online IDE.

3.1 My Repls

From the left menu, you can navigate to My Repls. This shows you a list of all your Repls.

WARNING: Make sure that all Repls related to your assignments remain private. All Repls will be private by default, and it is your responsibility to make sure they remain that way!

If you make your Repl public, this is deemed an academic misconduct!

This is correct:

This is wrong:

3.2 Editing and running your code

Go back to your Repl project workspace by clicking the name of your project from the My Repls, until you see the project as below.

The Repl IDE is simple to use:

4 Using GitHub throughout the assignment

If you are not making frequent commits to GitHub, you may be penalised!

How frequent should you be committing?
A good guideline is to make a commit for every significant change or progress you make, such that you are able to write a meaningful commit message for it.

For the academic purposes of this course, you need to demonstrate (through the commit history) the process you followed in coming up with your final solution. Therefore, make sure there are no massive gaps in your trail of commits.

Further to this, frequent commits will protect you in a number of ways:

4.1 (Option 1) Committing to GitHub using Repl

Committing to your GitHub repository is easy from within Repl. Follow the following 3 steps:

  1. Open the GitHub Version Control menu inside your Repl project.

  2. Add a meaningful message to represent what changes you made and are committing here.

  3. Press the commit & push button.

You should immediately see the updated information, listing the commit you just made:

You can double check.

4.2 (Option 2) Committing to GitHub using the command line

The great thing about using Repl to push your commits, is you don’t need to install any software (the whole idea is that git is integrated into the online Repl IDE).

But if you’re going to be installing and using your own local IDE (with compiler etc), that’s great also. In this case, it’s recommended to use the command line to make commits to your GitHub repository.

First, you will need to install the git command line tool. There are plenty of tutorials online to do this, depending on your operating system. You might need to configure your username, password etc. Again, Google is your best friend.

Go to your GitHub repository page:

  1. Press the Code button.

  2. Click on the clipboard icon to copy the URL.

  3. Determine where you would like to manage your repositories. Go to that folder.

  4. Type the following command, using the URL you got from the earlier step above:

    git clone URL-TO-REPO

  5. If all goes well, you should be able to see a new folder (with the name of your repository). This folder is known as the local repository, which effectively is your local copy of the (otherwise remote) repository that is stored on the GitHub server.

  6. When you edit your code, or add a new file, you will need to stage (git terminology) these to be ready to push to the repo.

  7. You can double check.

4.3 (Option 3) Committing to GitHub using a GUI client

If you will be installing your own local IDE to use, and don’t want to use the command line to push your commits, then you can look around for a git GUI client. There are plenty of options here, depending on your operating system and personal preferences (so maybe Google around first). This list is by no means exhaustive:

4.4 Checking the commit worked correctly

If you want to double-check the commit went through to GitHub correctly, do the following.

  1. From your GitHub assignment repository, click on the commits link:

  2. You should be able to see the commit details listed here also:

5 FAQ

Coming soon… In the meantime, ask on Piazza.