Linux and Git: Setting Up Your Workspace
You can't work without a workspace, though I admit setting up your workspace is pretty boring. It's like preparing to write the great American novel by flipping through a Sears catalogue for what writing desk to get. Now I am not going to pretend that there is only one right set of tools for writing and maintaining code. But there definitely are industry standards, and there are tools that I know will work for you if you are just beginning.
If you know how to code, you will likely not need to read this tutorial. We are going to go over things like installing a code editor, git, and linux. If you have a code editor, git and linux, you can skip this. If you are missing any of these things, go to the relevant section (the git one is quite long).
Additionally, if you just want to create a simple CSS and HTML website, and you don't want to do version control (pls do version control), just download VS Code and go to the next tutorial. We won't need linux until we get to flask, which is a bit aways as is.
I am very much of the opinion that if you feel like you are accomplishing something, you will keep going. As such, as long as you have VS Code installed, you should be able to complete the first tutorial. Having a hello world version of a website may be the motivation you need to keep going.
Know thyself.
If you need that, feel free to skip ahead. If you are willing to sit down for an hour and crank out getting git set up, that is definitely the better path.
Visual Studio Code
For our project, I am going to suggest using Visual Studio Code. According to software.com, it is the most popular code editor and kind of like choosing an easel when painting, it doesn't make a huge difference what you pick. Though I am sure that there are some people who have strong opinions on this. You can download VS Code here.
There is one feature of VS Code that I do want to point out before moving on to bigger and brighter things. By clicking Terminal > New Terminal, you can have a console running at the bottom of your code. This is really helpful when submitting git commands or running flask.
Linux (if you have Windows)
The wonderful things about Macs is that, like linux, they are based on Unix, so you don't have to work as hard to set them up to work. Plus, you can run Flask, which we will be doing in a few tutorials, right from the terminal.
But even Microsoft paupers can get access to linux on their local machine without much hassle and without having to doing something crazy like partitioning their drive.
You can install Ubuntu as an app on your desktop from this site. Follow the instructions and then launch the app. You will be greeted with a command line interface.
Because this is command line, your mouse will not be of any use. Welcome to the hacker life. Doritos and Mountain Dew should self-actualize by your mouse the second you open Ubuntu.
Let's go over some commands and tricks to help you navigate this new world.
cd
means change directory and is how you change folderspwd
means print working directory and will print to the console where you currently arels
lists all the files and folders in your current directory..
takes you back one directory- Up on the keyboard will bring up the most recent command entered into the terminal
- Tab will autocomplete things. This is especially useful when writing out long directory paths.
We won't be using Linux/Ubuntu for a while (when we get to flask), so just know that you have done the right thing and have a cool new icon on your task bar for now.
GitHub, Git, and Git Bash
While picking out a code editor is often a matter of preference, using git is not. Git is not a preference; its an industry standard, and many times the only reasonable way to do things. Git is a version control system. It's like track changes on steroids. Imagine if track changes had a master version that was online. You would write your changes on your computer and then send them online, and as long as they didn't conflict with changes that someone else had made, you could submit your changes. We will "git" into how git works a little later but first lets "git" set up.
Installing Git
Step one is to install git bash on your machine. You can install it here.
To make sure you have it correctly installed on Windows, right click on the desktop, and you should see an option that say "Git Bash Here".
To make sure you have it correctly installed on Mac (Mac often ships with Git, so you don't have to install it),
open up the terminal and type in: git --version
. If you get back a version of git, then you have git,
and if you don't, than you don't.
What we installed (if we are using Windows), is something called a bash terminal. This will let us navigate our directories with linux commands. While that may sound scary, it isn't. You just need to know two or three commands to navigate around and you can look up how to do things quite easily. We already covered 90 percent of what you need above anyways!
Setting Up a GitHub Account
Next step is to set up a GitHub account. GitHub, believe it or not, is different than git, in the same way that java and javascript are different things. If you use git and GitHub interchangeably, than the nerds will mock you and no one wants to be mocked by nerds.

Bazinga indeed.
The difference between git and GitHub isn't just linguistic. Git is the software and GitHub is a service for storing your code on the cloud. Creating an account for GitHub is free and easy. Associating your GitHub account with your git on your computer is free but not so easy. You will need an SSH key for that.
Creating an SSH Key
An SSH key is like a password that you computer will share with GitHub each time it tries to upload or download code from it. Unlike other passwords, SSH keys are unique to individual computers, so we will need to create one for each computer we are working from.
We need to perform dark command line rituals to summon an SSH key, that is to say, you will need to enter the below code, but I am not really sure what it is doing. An SSH key allows GitHub to verify that your computer has permission to read and write to GitHub.
I am pulling the instructions for doing this from github's website. If you have trouble, please refer to their material, which will be move involved then my own.
In git bash, enter the following:
$ ssh-keygen -t rsa -b 4096 -C "[email protected]"
This will create a key. Next you will be prompted asking where you want to save your key. Just press enter so it goes to the default location.
> Enter a file in which to save the key (/Users/you/.ssh/id_rsa): [Press enter]
Next it will ask for a password. You can leave this blank if you don't need that level of security (which you probably do not)
> Enter passphrase (empty for no passphrase): [Type a passphrase]
> Enter same passphrase again: [Type passphrase again]
At this point your ssh key is generated and is stored at /Users/you/.ssh/id_ra
. All that is left is to
add this key to your GitHub account. First we will print the SSH key to our console.
cat ~/.ssh/id_rsa.pub
You should see quite the long string of text as output. This is your SSH key. Copy it to your clipboard. Next we need to add it to your GitHub profile.
Head over to the settings on the upper right corner of the page.

On the sidebar on the left, click SSH and GPG keys

Then Add SSH Key

Then enter your key and information. For the title you can put something like the name and brand of your computer. Paste the key into the Key field.

Follow the rest of the prompts are you are done.
Creating and Cloning a Git Project
Now that our computer can interact with GitHub, we need to actually interact with GitHub. On the top left corner of your GitHub homepage. Click the button that says "New" to create your first repository.

Then name your repository something like "My New Website" and initialize with a readme.
Open up your new repository and click the green button that says "Code" and copy the highlighted text from the picture.

Create a folder in your documents called "github".
Right click inside this folder and click "Open Git Bash Here". Type git clone and what you copied into the console like so:
git clone [email protected]:yourusername/your-repo.git
If you don't have any errors, congratulations! You now have a working git repository.
You now have to move into that directory to start working so do so now:
cd your-repo
And you can check if your git is working by typing:
git status
git status
will tell you if all your files are being tracked and if they have been modified, so feel
free to use it often.
The Git Factory
Ok so now we have git. But what does it actually do?
Projects in git are called repositories or repos for short. A repository contains both the entire codebase for a project and a history of all the changes to that codebase. These changes are tracked when the user pushes the work to the repository. Each chunk of code that a user creates is usually tracked in something called a commit. Each time a coder finishes some code (as coders are wont to do) they will save a snapshot of their codebase in a commit.
Imagine you are working in a factory hand making widgets. You finish one widget, and you pack it up in a box. This is analogous to writing a chunk of code and adding it to a git repository. Next you put that box in a truck. This is analogous to creating a commit. You do this for a few hours and have ten or so widgets in your car. At this point, no one can see your widgets because they are still at the factory.
So you do the next logical thing and drive your truck to the store and unload your widgets. This is analogous to pushing your commits to the repo. Commits are you packing your work into the truck and pushing is delivering it.
Now lets say you are at a different factory and want to see the latest way widgets are being made. Well you would have to drive to the store and check them out. This is analogous to pulling code from a repository.
There is a lot more to git like branches and how to handling conflicting commits, but we will leave it to just commits and pushing and pulling for now.
Testing It Out
Lets test this out. Open up a text file in notepad or VS Code if you want to feel like a hacker. Write in it
test test test
and save it as test.txt
in your project folder.
First we need to pack up our commit by adding it to the project.
git add test.txt
Next we need to put our commit in a truck by committing it.
git commit -a -m "new txt file ready for delivery"
Finally we need to deliver the text file to GitHub by pushing it.
git push
Go to GitHub and look at your project. You should see that it now has your new file online.
Flask and Linux
You will not be running flask on your windows machine. You will be running flask within that ubuntu program you installed earlier. To transfer files from windows to ubuntu, you will be pushing from your windows machine to GitHub and then pulling down the changes into that ubuntu program
As such, you will need to create an SSH key for your ubuntu install and clone the repo from GitHub.
An example of your workflow may be as follows:
- Write some code in VS Code
- Commit and push it using git bash or the terminal in VS Code
- Open up Ubuntu and navigate to the project
- Pull the latest version from GitHub
- Run Flask
None of this is necessary if you have a Mac. You can run Flask directly from the terminal without any issues. Get a Mac. It just works.