by Yung L. Leung

The Google Doc of Coding: Git & GitHub

Introduction

Google Doc is a server-side (online) word processor. A user’s files are created via a web browser & stored in a server. This software makes it possible for users to share documents with others for collaboration. Normally, the workflow is the following:

  • Create a document & fill with content.
  • Save content & share file with others for collaboration.
  • Members contribute on the same document, online.

Aside from file sharing, another important feature is the ability to undo or redo changes made to the ‘master’ file. The changes made to the document are sequential and any user can undo (or redo) those changes.

Wk3M8qv3BVmUo8xK8WTiFKo8qtJzdOlOuc59

But, this can quickly become a big mess, especially when multiple users are simultaneously adding or editing content. Who created or changed what content and for what reason is unknown.

Atom, Git & GitHub

In software development, the tools for collaborative programming consists of a text editor, version control system & an online repository.

Atom (or any text editor) is like your client-side (desktop) word processor, except the document is code written in some language (i.e: JavaScript).

Git is a tool for selectively recording the history of your project’s saved changes. It is a way to ‘control’ all the different versions of your programming project.

GitHub is like your Google Docs, except you can create & save your version of the code offline, before ‘pushing’ it to be saved online.

jLU1vB1GLr3vSedxMo-viUIvU4HtNfzCfrnY
Atom, Git & GitHub

So, you have your text editor (Atom), version control system (Git) & remote file storage system (GitHub). These are the basic elements that solve the problem of collaboration, especially for software developers. The workflow is similar to the use of Google Docs, with some differences.

Collaborative Software Development Workflow

  1. Create online (remote) GitHub repository (https://github.com/new)
XEkgb2eqPgGSa7dz5imdRFXhyjcDzFfa8zJ1

2. Create an offline (local) repository. The terminal command git init project_name initiates your project by creating a folder to store its content & version control files to store a history of its changes

  • The idea is to eventually have a remote & a local copy of your project.
YVsP0MYeOVIygYs4cz9x3NmjdsdRyue53aw7

3. Use a text editor to build content. This is where you begin to write your program with Atom and create your JavaScript files.

BIlW7r0KUNAyOXzkjQbNrXmSykewezNpGQRv
Coding with an Atom Text Editor

4. Save the content & note significant historical progressions in your project. The terminal command git add . adds all folder contents, all the changes, to be committed in history. The command git commit -m ‘message’ commits the changes to history, along with a message explaining the changes made. The command git push pushes your files and historical data to your remote repository.

  • As you are continuously making progress in your project, you are recording the rationale behind each stage of development (git add, git commit, git push).
sphMS4DSgfC8zZI4yky53GMI-6gWU5qCVdRQ
Your remote & local copy grows with every push.

5. Share file with others for collaboration. Once your remote repository has content, you can share your project with collaborators.

Viri6BCHeiLtcq9cxUGYFMGUmqNQ1pkUAHIa
  • After members accept the invitation, they can fork a branch off of the remote repository and clone the project locally (git clone <repo url or ssh>).
wUhCAZn3Q6ieiNbNo9KK3Y3o4bRkytIGIPh-
Originator with two collaborators building content on project clones.
  • Each collaborator can build content, save the content and push it to their remote branch.
  • As collaborators continue to build and save their content, they end up building forks in the GitHub “sky” (git add, git commit, git push).
AiMhl6s958Kgw6Q1Ev1xoHTiHEjftaId7yWC
Originator & Collaborators developing project & pushing it to GitHub.
  • Each fork is a collaborator branching off from the original project so that members can work in parallel with the originator, without disrupting each other’s progress. Every time a collaborator performs a git push, the fork elongates.

6. Merge branched files. At the request of the collaborators, the originator can pull their branch to be merged with the master branch.

NKXd9qyn0FphVnA-rAwtUXDesF7arDnJCRut
Collaborators are pushing & submitting pull requests. The originator is pulling clones & merging the branches.
  • When a collaborator submits a pull request, the originator can perform a git pull to merge the branches into a single updated version of the project. This new version can then be pushed into the remote repo for all to see and use.

Version Control & File Sharing

In collaborative software development, changes are made to multiple clones of a master copy, before they are merged to the master file. So the changes made are sequential, but with overlaps in time.

uh4g7TmUn95gPVPP3SV1Z-HXTtDzZnCZkXeh
Collaborators forking, pushing & having their branches merged with the Originator, at different times.

Every new piece of content that is created on a clone is ultimately pushed towards a collaborator’s master repo. Every collaborator’s commit message provides feedback to the originator so that they can make intelligible edits & additions to the original project.

This would be a difficult feat without Git’s version control & GitHub’s file sharing. A simple terminal command (git branch &lt;branch_name>) can take a clone on a local machine and create a branch so that a different version of the project can be developed. A user can then note take their progression (git add & git commit) at any point in time. If there were any problems with an active version, the user can simply switch to a previous branch (git checkout <branch_name>) and continue from there.

This is the meaning of version control. At any point in time, a user can switch to alternate versions of a project, while committing intelligible notes that explain the progression of each version. The user has full control over the versions that are developed. A simple terminal push to the GitHub “clouds” makes any version available to their collaborators. This is the power of using Git & GitHub in collaborative software development.

References:

Git - Videos
Edit descriptiongit-scm.comLearn Git with Bitbucket Cloud | Atlassian Git Tutorial
Learn Git with Bitbucket Cloudwww.atlassian.comHow Google Docs Works
Back End of Google Docs - The back end of Google Docs relies on simple, inexpensive hardware and software. Learn more…computer.howstuffworks.comAtom (text editor) - Wikipedia
Atom is a free and open-source text and source code editor for macOS, Linux, and Microsoft Windows with support for…en.wikipedia.orgGit - Wikipedia
Git () is a distributed version control system for tracking changes in source code during software development. It is…en.wikipedia.orgGitHub - Wikipedia
GitHub offers plans for enterprise, team, pro and free accounts which are commonly used to host open-source software…en.wikipedia.org