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
Who is this for?

*Never used the terminal, and thought I was saying get
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

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

!raffle

#100Devs - Intro to Git And Github (cohort 2)
By Leon Noel
#100Devs - Intro to Git And Github (cohort 2)
Class 71 of our Free Web Dev Bootcamp for folx affected by the pandemic. Join live T/Th 6:30pm ET leonnoel.com/twitch and ask questions here: leonnoel.com/discord
- 1,765