Introduction to Git & Github

Try Git | Markdown Cheatsheet | Pro Git | Git Config

Getting Started
In the terminal start by creating a new directory, then run git init to initialize a git repository

mkdir my_new_directory
ck my_new_directory
git init

Now that we have initialized a git repo, we can add files, and make edits, while trackin changes along the way. We can also revert back to previous 'commits' and merge branches. We'll go into detail about these terms mean and do shortly.

For this example, let's create a static website with a couple of pages, stylesheets, javascripts, and maybe even some fonts.

Tracking Changes
Create a file called index from the command line, then check its git status.

touch index.html  
git status

You should notice that index.html is in 'untracked files'. In order to add this file to be tracked, we can run git add index.html. If you have changed several files and want to add them all, you can add all files with git add .

When we add files, we say they are staged or have been added to the staging area. Add the index to the staging area and check the status again.

git add index.html
git status

You should now see that index.html a change to be committed. So far, we have initialized a git repository, created a file, and added it to be staged. We can now 'commit' to make a saved point we can revert back to later, if we wish. When we create a git commit, we should give it a message (preferably a meaningful message).

git commit -m "Add index file for site homepage"

Now if we try git status we can see there is nothing to commit. Try git log to see a log of the commits in this repo. This is useful for git commands such as revert, reset, and checkout.

Build Out the Site
Open up index.html in your favorite editor (sublime, etc.), and fill in some valid HTML.
note: Open the file with Chrome from the command line, using open -a "google chrome" index.html

Here, I've added a link to a stylesheet. I've also omitted some optional tags; feel free to include them, if it's more comfortable.

<!DOCTYPE html>

<meta charset="UTF-8">

<title>Drew's Site</title>

<link rel="stylesheet" src="assets/stylesheets/styles.css">

<h1>Drew's Site</h1>

<p>This is my site, yo!

After saving, run git status and see the changes made are not yet staged for commit. git add . will add all changes to the staging area. Commit changes that have been added to the staging area, then check the status and the logs.

git commit -m "Add content to homepage"
git status
git log

Branches
When we want to make changes, rather than make them on the main working copy (master), we can create a new branch. It's a good idea to create a new branch, make some changes, merge the changes into master, then delete the branch, rather than continue working on a branch that you have already merged. Remember to commit often. This will make much more sense as it sinks in, and we will cover it in depth shortly.

git branch will display the local branches, with an asterisk on the current branch.

Create a new branch called my_styles

git branch my_styles  
git checkout my_styles  
git branch

ogryzek/git_and_github.md

Introduction to Git & Github