Posted on

A Basic Guide To GitHub for WebDevelopers


If you have been developing websites for a while you might have felt at some point that there could be a better way of making changes to your site in a non-destructive way or having a remote back up of your project that you could restore your local working files from in the event that something went horribly wrong.

Well, if dealing with these scenarios in a manual and somewhat laborious fashion has been irking you, then GitHub might have a solution that fits your needs.

What is GitHub?

octocat-githubGithub is first and foremost a remote hosting service with an integrated set of tools for assisting developers via a version control system.
We’ll talk a little more about version control later, but, for now what is important is that we recognize that at it’s core GitHub provides developers with a remote location to store the projects they are working on. However, this differentiates substantially from a trivial cloud storage facility in that GitHub is built on Git. This begs the question what is Git and how does it make GitHub better?


gitlogoGit comprises much of the underlying functionality that GitHub presents in an easy to use Web-based interface.
Aside from the web hosting facility that GitHub offers it’s members (in free and paid versions) it also merges a harmonious relationship between local development leveraging Git functionality and extending that functionality remotely to the web using GitHub.

Tools for Developers


The process of developing non-trivial Software is generally not linear, the approach will often be iterative. For example, when developing a website you might like to try styling certain elements of your site differently. However, actually seeing these changes implemented in your site might require replacing your existing CSS with the modified version while not actually knowing if you’re going to like the changes you make. This could be particularly destructive to your site especially when the changes require modifications to the site’s structure or DOM, that is to say multiple files would get effected by the change. You might subsequently make these changes nonetheless, only to realize that you preferred the site before the changes where implemented but would still like to keep some other unrelated changes you made while updating the styling. Restoring your site to it’s previous state and keeping the other changes in this case could be extraneously, time-consuming as you manually sift though file after file, one line of code after another trying to identify and decide upon what should to be kept and what needs to be reverted.

Git and subsequently GitHub implement a unique Revision Control System that addresses this problem. Simply put for the purposes of this article the Git Revision Control System (RCS) provides us with automation tools for,

  • storing, organizing and working with data locally,
  • identifying changes between different data states,
  • providing us with means of addressing these differences,
  • uploading data to GitHub,
  • and retrieving data from GitHub.

Distributed Revision Control

Consider this scenario, you are developing an application for a website and you would like to experiment with integrating some one else’s code into your app but you also don’t want to risk breaking the working version of the app. At the same time you would like to make sure that you can retain a remote backup of your working app and still permit other developers the opportunity to work on or assist you with your project’s source code, documentation etc.

Not all of the above criteria is necessary on every web app or website project, but atleast one or more will likely be applicable to any software development project. This is where Git and GitHub can help to meet your requirements.

softwarestates Each user that joins GitHub becomes a member that is responsible for maintaining their own repositories. These repositories are storage facilities for different versions of your project’s codebase.
Along with all the development tools you need for your project you will also need to have Git installed on your local development workstation.
Git is a command line tool, with a very simple set of directives to get you up and running with a Distributed Revision Control or Version Control System project. Revision Control refers to managing your project’s different versions, for example version 1 with the original styling and version 2 with the styling modified (as per the example noted above). Git and GitHub’s type of Revision Control is Distributed because each user is responsible for their own repositories, both locally and remotely. Subsequently, each version of the project will mirror it’s previous version with additional changes where necessary. This alleviates reliance on accessing remotely stored data or data that might have become corrupt locally.

Solutions for Different Software States

Git refers to the software comprising our projects as being in one of three different States, Modified, Staged or Committed.

Initially when we start a project it is in the Modified state, continuing to work on the codebase does not modify it’s Git related state i.e. the software remains in the Modified State. However, in order for Git to track changes to the project and provide us with the functionality that allows us to revert to previous versions of the project (among other features) we need to make a commit, which is simply a directive issued to Git to tell it to track the current status of the project. But, before making a commit we need to tell Git which files we would like to add to the commit. Files that are added to the que to be committed, will be analysed for changes and placed in the Staging Area.


Lets Get Started…

When our software is in it’s primary state we have just began working on our project, subsequently we will be working locally and our project will remain in the Modified State. Once you are ready to make a commit, and it could be recommended that you start committing from the very beginning of the development process and regularly thereafter, navigate to the root directory of your project. eg.

cd myProject

Then initialize it for usage with Git.

git init

At this stage all you’ve done is started the development process and set up your project for usage with Git, which has subsequently created a .git sub-directory in your projects root folder. This directory is where git stores all of the pertinent information relating to the different versions of your project.

Assuming you already have files in your project’s root directory, you might want to add them to the Git Staging Area so that they can later be committed.

To add all existing files and those within sub-directories of your main project to the Staging Area, simply run the following command,

git add .

This command will examine the contents of your project and check for files that are in a different state to those represented within a committed state. If this is the first time you are running the command, you will subsequently have no committed data. Therefore all the files within your project will be added to the Staging Area, ready to be committed.

To make a commit, simply run the following command,

git commit -m 'Type Your Message Here'

Making a commit must follow the sequence of directives as they have been stipulated above. In the git commit command the -m flag has been used followed by a string. Replace the text within the string with something relevant to your commit for example ‘ver 0.01’

At this stage you can run a status check to ensure that the commit was successful.

git status


In this post we looked at what Git and GitHub are and how they can assist us with building websites and other software. We also setup a local repository and made our first commit. When I next return to this topic we’ll have a look at how to examine the differences between versions of the same file and how to resolve those differences. We’ll also look at branching and merging and finally uploading our project to GitHub.

Flattr this!

Posted on

A New Programming Course for Artists

An Introduction to Programming with Processing


Processing is a high level, Java-based, programming language and a great way for newcomers to learn the fundamental constructs of creating stand-alone, cross platform, software applications.

An Introduction to Programming with Processing” is an 18 Lesson Course that is tailored specifically for Artists with entry-level, tertiary education (or equivalent), do not have any prior programming knowledge and want an easy to follow guide that demonstrates the steps, with practical explanations of the theory, involved in developing logic-based software applications.

The Online and Downloadable versions of the Course consist of:

  • All 10 unique projects designed at which are referenced in the Course Documentation and include the individual projects’ source code, images, assets and applications that are all freely available for re-use under respective Creative Commons licensing.
  • 3 Quizzes to evaluate how you are progressing throughout the course and compare your results with other learners.
  • A 200 page PDF packed with step-by-step examples, in-depth programming theory and practical programmatic implementations (also available in an online version).
  • Best of all, the entire course and all related content is free and available online or for download under Creative Commons licensing.

So if you’ve ever wondered where to get started with making your own mobile app, stand-alone game, dynamic website interface, program micro-controllers, create beautiful visualizations of code or just want a greater understanding of software development head on over to and get stuck in right away!


Flattr this!

Posted on

Common Shell Commands Pt II


Prints information about the size of files and folders.


-a prints the size of a specified file or folder
-h prints information in human readable format
-c prints the total summarized size of multiple files in a specified location

du -ahc /home/myFolder/

This will print the sizes of all files and subfolders within the myFolder directory with a summary of the combined total size of the directory’s contents, in a human readable format.


Search for files matching specified criteria in a user defined location


find uses X-style parameters which are denoted by a single dash followed by the parameter name (eg. -dosomething), as opposed to previously mentioned commands that use GNU-style parameters double dash followed by the parameter name (eg. –dosomething), or UNIX-style parameters which use a single dash followed by the parameter innitial (eg. -d)

-name searches current directory and all sub-directories for any files that matches the specified user supplied String. eg

find /home/myFolder -name “*.txt”
This finds all files in the myFolder directory and subdirectories that have the extension .txt

-size returns files that are greater in size than specified when using + or smaller when using – eg.

find /home/myFolder -name “*.txt” -size +10k
This finds all files in the specified locations that match the extension .txt and are greater than 10k in size

-exec allows the found file to be passed to an external program. The name of the external command you’d like to use follows -exec, then the external command’s parameters. The file that find returns can be inserted by using {} and the find command must end with a \(preceeded by a space). eg

find /home/myFolder -name “*.txt” -size +10k -exec chmod o+r {} \
this command searches for all files in the specified location that match the extension .txt and are greater in size than 10k. It then passes each file to chmod and enables each file for read access.


Match strings of text within other files or input eg.

grep “search for this” myFile.txt
This will search the file myFile.txt which is in the current directory for the text “search for this” (without quotation marks). It will then print the line that it finds the matching string and the file name. 


-r search recursively by including all subdirectories of the current location eg.

grep -r “search for this” *
This will search the contents of all files within the current directory and subdirectories for the string “search for this”. An indication of the match is printed along with the file name for each subsequent match

-n returns line number for each match as it appears in the source file eg.
grep -n “variableName” myFile.txt

This will indicate every line in the source file that “variableName” was used

-v inverts the search functionallity by returning each line that does not contain the specified text eg.

grep -v “search for this” myFile.txt

Returns each line within the myFile.txt file that does not contain the string “search for this”

-i removes case sensitivity eg.

grep -i “Search For THis” myFile.txt

Regular expressions are permitted with grep eg.

grep “[cms]at” myFile.txt
Matches cat, mat and sat

Flattr this!

Posted on

PHP Hello World


//This is a Hello World Program
echo “Hello World”;

PHP is a loosely typed language
PHP requires that all variables are preceeded with $


//variable declaration
$myNumber = 1;                                      //integer
$someText = “Hello”;                                //String
$multiVal = array(“one”, “two”, “three”);  //Array

Flattr this!