App Development Workflow

---

Welcome to the App Development team!

This post will be a guide to get started. It will go over basic workflow and standard procedures that we take when developing the WEquil School app.

GitHub

We use GitHub to store and track our code. It is like an online notebook that we keep in case something goes wrong on our local machine.

As an example, imagine you are writing an essay in Microsoft Word. Then your computer shuts off and you never had a chance to save. All of that work is now lost. In order to prevent this, you will usually save periodically or even enable autosave.

We don't want this to happen to our code, especially if it is important code that will eventually be released for people to use. That is why we use GitHub. It will allow us to code and save it online somewhere so that if something happens to our computer, or even if we deleted it by accident, we will have copies of it.

Before moving on, create an account on GitHub using this link.

GitHub Branching

As I said before, GitHub is used to store our code so it stays safe. However, what if we want to test something? What if we want to delete code to test another kind of logic? What happens if that new logic doesn't work, or maybe even mess up the code all together? This is where GitHub branching comes in.

GitHub branching allows us to make a copy of our entire code base so that we add new code and features without losing the original if the new code and features do not work out. For example, let's say you have an original drawing and you want to add color to it. If we were to use GitHub branching, we will create a copy of the original drawing, let's call this original2. Then, we add color to it. When we are done with the coloring, we do 1 of 2 things.

1. We like it! Since we like it, we will push those changes to the original drawing. Now the original drawing and original2 drawing is 1 drawing. (Color is the feature/code in this example)

2. We hate it! Since we hate it, we will trash the original2 drawing and we will make another copy of the original drawing and add another set of colors.

To put it simply, branching allows us to trash testing code without having to undo everything if it does not work out. If it does work out, we merge it with our original code.

GitHub Commit

When you create a branch to work on locally, you need to periodically commit your code. When you commit your code, you are making a "save" point of your code. Committing your code is the same as saving your essay after a certain point. So if your computer unexpectedly shuts down, your code will be safe.

How often should I commit?

• You should commit when you complete a functioning piece of code.

• For example, if I wrote a code that calculates the area of a square, I will want to commit because I don't want to lose it if my computer shuts off before I can save.

GitHub Pushing

GitHub pushing is the same thing as commit, but the difference is that it pushes your code online.

Where does it save online?

• It saves to your own branch on GitHub under the project's repository.

Why do we need to push it online?

1. Other can view and check your code.

2. If your computer completely breaks, you can download it so it is never lost.

GitHub Pushing vs. GitHub Committing

The main difference is that pushing saves all of your code online. Commit saves your changes locally on your computer.

GitHub Pushing & Committing Summary

When you push or commit, you need to include a short summary of what you are pushing or commit. This is to track your code and so that you know which save point to roll back to if your code breaks during development.

Say I implemented feature A, B and C. While I was developing feature D, I noticed that features B and C will not work and I want to get rid of it. So what do I do? I go back to my commit/push list and look for when I added feature A and select this commit/push to now be my main code. This makes it quick because I don't need to manually delete B, C and D from my code base, I can just roll it back to the previous versions with a single button click.

GitHub Workflow

I need help!

If you need help, notify the WebApp channel and someone will help you out.

Never try something that you are unsure of because you will waste time, energy and motivation.

Always Ask if you are unsure!

Installing GitHub

There's 2 ways to use GitHub.

1. Command Prompt

2. GitHub Desktop

Git vs. GitHub

Before we move on, we need to make a distinction between Git and GitHub. Git is the management feature. All the code savings, committing, pushing and branching is called Git. GitHub is a hosting service that stores your code, hence we say it is a "hub."

That said, we need our computers to have Git in order to use GitHub.

Installing Git

If you are using an Apple computer, you should already have all of the Git features already installed. If you are using Windows, then you need to install Git by downloading it from here.

GitHub Desktop

To keep things simple, we will be using GitHub Desktop because it is more graphically rich compared to the command prompt. You can download GitHub Desktop here.

Code Merging

After you have tested and want to merge your code with the master branch, you have to create a pull request. Contact Wei on Slack or tag him in the WebApp channel to notify him that you made a request.

Wei will look over your code and see if there is any issues. If there are no issues, your code will be merged into the master branch, ready for users to use. If there are issues, Wei will list out those issues for you to fix.

Ready?

When you are ready, send Wei a message on the WebApp channel. He will add you to the GitHub repository and let you know how to clone the repo to get started.