1. Introduction

Submitting Coding Assignments and Using GitHub

Note: If you are here as part of a course, please read on. Otherwise, submitting coding assignments is not required.

Most assignments that follow are various inaccessible web page widgets that we will ask you to make accessible by rewriting their code (HTML, CSS, or JavaScript). If you are participating here as part of a course, you will need the link to a live web page with your solution. Before the code is reviewed, the page will be checked for accessibility (using ChromeVox and other tools).

It is your decision where you want to host the pages that you will submit for review. If you have your own domain and server space, you can upload completed assignments there and submit the URL. Another option is to submit the URL of a file on GitHub to GitHack (https://raw.githack.com), then submit the URL to the output it generates as your assignment submission.

Feel free to download the activity files from our repository now, or if you are going to use GitHub, keep reading for instructions on how to fork it to your own account.

If you don’t have a website, we recommend using GitHub as your platform for submitting assignments. Below we describe GitHub and GitHub Pages. If you are familiar with using GitHub or you have your own web server, you can skip the rest of this page or just scan it.

Set Up a GitHub Account

If you do not already have one, you should create a GitHub account. For any developer, it is an invaluable tool for sharing and collaborating on code development. A GitHub account is free. Though you can download the activity files from GitHub, then unzip them and work from a local directory on your hard drive, we recommend creating a fork of the activity files to your own account and cloning your fork into a local directory. Follow the link below to set up an account, then read on.

Toolkit: Join GitHub

Set Up a Local Git Environment

Depending on the operating system you are using, there are specific versions of Git for each platform. You may choose to use a Git client, or you may choose to use Git from the command line. Here we will present command line options. If you choose to use a client, see the documentation associated with the client for details on cloning, committing, pulling, and pushing.

For Windows and Mac users, if you are going to use a client instead of working from a command line, we suggest installing SourceTree. GitHub Desktop is a good alternative if you prefer to use an open source client. Feel free to choose another Git client if you like.

Toolkit: Download SourceTree or GitHub Desktop if you need a desktop Git client application.

For Linux users you can use your system’s package manager to install Git for command line use. On Ubuntu, for instance, at the command prompt you can run apt-get as the root user to install Git:

#> sudo apt-get install git

Suggested Reading: For more about Git setup on Ubuntu see the tutorial on DigitalOcean.

If you are using another Linux distribution, use Google to find details on installing Git on your version of Linux.

Suggested Reading: For details on installing Git, see the Git Book.

Assignment Submissions via GitHub

Most of the assignments that follow require submitting a URL to a publicly accessible version of the widgets that are the focus of the activities.

If you need a place to post your activity assignments, GitHub Pages can be a good option. Or, you may just prefer to use GitHub Pages to organize your files so they are not cluttering your web server. You will create a fork of the activity files (learnaria.github.io), rename the repository to create your own version, and either upload it to a site of your choosing or use GitHub Pages. The GitHub Pages option is outlined here.

Suggested Reading: Using GitHub Pages.

If you choose to use GitHub Pages, follow these steps to create a copy of the files under your own GitHub account.

    1. Logged into GitHub, find your way to the activity files, and fork that repository. The fork button is at the top right of the GitHub screen while viewing a repository. This creates a copy of the repository under your own GitHub account where you will work from.
    2. After you have forked the activity files, go into the settings for that repository and change the name from learnaria.github.io to [username].github.io, where username is your GitHub account username. This will automatically create your GitHub Pages website at https://[username].github.io.
    3. Now you will want to create a clone of your forked activity files repository on your computer, through which you will do your work. From the command line issue the following command to create a clone of the forked version of the activity files you created, where [username] is your GitHub account username. You can also copy the https link from a field that opens when you click on the “Clone or download” button in your repo.
      #> git clone
    4. If you are using SourceTree, click on “+ New Repository” and choose “Clone from URL” and enter the above URL into the “Source URL” field. Set the “Destination Path” to your preferred work directory.
Suggested Reading: Cloning a repository.

You should now have a copy of the activity files available locally that you can edit and commit back as your assignment updates, which become part of your GitHub Pages website.

Note that it can take a few seconds or a minute for changes committed to your GitHub Pages repository to actually show up on the website.

If You Already Have a GitHub Pages Site

To add the files to an existing GitHub Pages site, open the settings for the forked repository you created. In the GitHub Pages section shown in the screenshot below, choose the Source (typically, the master branch) and click Save. This will create a subdirectory under your existing GitHub Pages site with the name of the forked repository (i.e., learnaria.github.io).

You may want to rename the repository to something shorter (e.g., learnaria) before enabling it in GitHub Pages. This would produce a URL to the activity files, something like:


screenshot of the GitHub Pages settings
Figure: A screenshot of the GitHub Pages settings

Basic Git Commands

You do not need to be an expert Git user, but you should know a few basic commands if you are working from a command prompt. The commands you’ll likely use are the following:

git status  (displays a list of changed and untracked files)

git add [filename] (prepares a files for committing)

git commit -m “[message]” (describe the nature of the commit)

git push [origin master] (sends the committed change to your GitHub repository master branch)

git diff [filename] (shows the changes in a file)

Of course there are many other potential commands, but these are the most common. If you are using a Git client, such as SourceTree, these commands will be clickable in the UI buttons and menus. For more about using Git from the command line, see the Git Book.

Suggested Reading: The Git Book.

What the Activity Files Look Like

Here is what to expect once you have successfully set up the activity files. You’ll note that the widgets are inaccessible. Your job throughout the activities will be to fix the accessibility of each widget.


Icon for the Creative Commons Attribution-ShareAlike 4.0 International License

Web Accessibility for Developers Copyright © 2019 by The Chang School, Toronto Metropolitan University is licensed under a Creative Commons Attribution-ShareAlike 4.0 International License, except where otherwise noted.

Share This Book