Github Zero to Hero

Leon Noel

#100Devs

Sponsored by Microsoft Azure!  

Agenda

  • Questions? 

  • Let's Talk -  #100Devs & Thank You Microsoft Azure

  • Learn - What is this terminal thing?

  • Learn - What is GIT

  • Learn - GIT Basic Commands

  • Learn - What is Github

  • Learn - What are Github Issues

  • Learn - What is Github Pages

  • Homework - Intro. to Git & Github

Questions

About last class or life

Checking In

Like and Retweet the Tweet

!checkin

https://aka.ms/learnwithleon 

Who is this for?

*Never used the terminal, and thought I was saying get

Community Rules

Github Code of Conduct
https://github.com/microsoft/virtual-events

 

!githubcoc

You Are Not Alone!

!100Devs

leonnoel.com/100devs

THANK YOU

Microsoft Azure you a real one

Let's GIT IT ON

First, The Terminal

Terminal, Bash, Git Bash, Unix, Shell, CLI, cmd 

A place where you can type commands that cause actions

APPLE II

Emulator

CLI > GUI

Command Line Interface vs. Graphical User Interface

Let's Look

The Terminal

Common Commands

pwd

(print working directory) shows where you are

mkdir

(make directory) create a folder

cd

(change directory) move to a different folder

cd ..

goes up a folder

cd ~

go back to home folder

touch

create a file

ls

shows you all the files in a folder

ls -l

shows you all the files in a folder with more info

ls -la

shows you all the files in a folder including hidden

rm

removes a file

rm -r <folder>

removes a folder

rm -rf <folder>

removes everything even protected files - be careful!

clear

clears what is currently being displayed

code filename

Opens file in VS Code

In VS Code:

view -> Command Palette ->

Shell Command: Install 'code' command in PATH

Access The Terminal?

Mac & GNU/Linux

Applications -> Terminal

Windows

Git Bash

https://gitforwindows.org

(for today)

WSL

(rest of program - will walk through during office hours)

Let's Code

Normal Folder Setup

!raffle

WHAT IS GIT?

While working on a really important Word Doc what did you do?

What if you wanted to work with someone else?

Git solves this problem when working with code

(save points)

Git is a version control system

 

A really fancy way of tracking changes

Git enables you to take "snapshots"

 

This has a deeper meaning, but similar to save points

Git enables you to take "snapshots" by making a commit

 

Just the term for creating that save point

Git enables you to roll back to previous "snapshots" (commits)

 

No more file -> save as -> folder132

Install Git

Windows

Git Bash

https://gitforwindows.org

(for today)

WSL

(for life)

MacOS

Install Homebrew:

$ /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
$ brew install git

GNU / Linux

Debian / Ubuntu

 

$ sudo apt-get update 

$ sudo apt-get install git

Once Installed 

Setup User Name and Email

$ git config --global user.name "Leon Noel" 
$ git config --global user.email "leon@leonnoel.com"

Let's Install

Try Installing Git

*If you get stuck, leonnoel.com/discord

!raffle

Basic Git Commands

 

git init

Creates a special folder to hold all of your snapshots (commits)

git add <file>

Adds file to staging area (not yet in that special folder)

git add *.html

Adds all html files to staging area (not yet in that special folder)

git add .

Adds everything to staging area (not yet in that special folder)

git status

Shows everything in staging area (not yet in that special folder)

git rm --cached index.html

Removes index.html from staging area 

git commit

 Adds everything in staging to the special folder as a snapshot

If you get stuck in vim:

i -> then type your message -> escape -> type :wq -> enter

git commit -m "text"

 Adds everything in staging to the special folder as a snapshot

git branch -M main

Changes name of staging area to main 

Let's Code

Make A Commit

!raffle

Want to try something without borking all your code

BRANCHES

git status

Find out if you are on main first

git branch <name>

Creates a new branch for you to make changes on without affecting the rest of your code!

git checkout <name>

Moves you to new branch where you can make changes without affecting the rest of your code!

Make Your Changes

 

Add your changes to staging

 

 

 

Commit Your Changes

git add .

git commit -m "changes made"

git checkout main

Moves you back to main branch

git merge <branch>

Adds changes from other branch to main

Let's Code

Use A Branch

!raffle

What is Github?

Local Vs. Remote

Not only backups,

but a whole suite of tools to work with other developers

Let's Make

A Github Account

!raffle

PUSH IT

Create A Github Repo

Instructions with each new repo

Let's Push

Our First Repo

!raffle

What are Github Issues?

Let's Create

Our First Issue

What are

Github Pages?

Let's Host

Host On Github Pages

Homework

Due (Tues. 1/3):

Do: Intro to Github

 https://aka.ms/learnwithleon​ 

https://aka.ms/learnwithleon 

!raffle