About the Course

What is Github?

Github is a version control system that allows you to track changes to your code. It also enables collaboration among multiple developers on the same codebase.

In simpler terms, think of Github as a place to store your code online (in a repository). By pushing your changes to this online repository, you can:

1. Maintain a complete backup and history of all your code changes.
2. Invite others to collaborate on your project.
3. Deploy your code to the internet via integrated platforms like Vercel, Heroku, and Netlify.

We will be using Github to setup our projects for this course so we can ultimately deploy our apps to the internet.

Github Terminology

The following is a walkthrough of what the online Github application looks like once you already have a repository set up!

Github Online

Repository

A repository (or “repo”) is a storage space for your project. You can think of a repository as a fancy word for a folder. It contains all your project files and the history of changes made to them.

• Local Repositories: Repositories on your local computer.
• Remote Repositories: Repositories on Github.

The local version stores you code on your computer where you can make edits and changes. The remote version is the version of your folder that you want to save and share with others.

The above is an image of someone’s Github account where there are three different remote repositories. Each of these represents a different project.

Commit

A commit represents a snapshot of your project at a specific point in time. When you commit, you save the current state of your project along with a message that describes the changes.

Once you push your commits to your remote repository, you will be able to see the commits! You can see the code diff per commit as well.

Gitignore file

The gitignore file is a text file that tells Git which files to ignore in your project (in other words, which files should not be uploaded (or committed) to the remote repository). This is useful for ignoring files that are large, binary, or otherwise not intended to be shared like .env files.

To save time, you can ask Cursor to create a gitignore file for you. Make sure to ask it to include the .env file. This is an example of a gitignore file:

# build output
dist/
.output/

# dependencies
node_modules/

# logs
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*

# environment variables
.env
.env.*
!.env.example

# macOS-specific files
.DS_Store

# Editor directories and files
.vscode/
.idea/
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?
.vercel/*

The Primary Github Workflow

1. Create a new repository on Github and clone the repository to your local machine OR clone an existing repository to your local machine.
2. Make changes to the code locally.
3. Commit the changes to the local repository.
4. Push the changes to the remote repository on Github.

Github Workflow

Workflow How-Tos:

Initializing a Repository (Creating a New Project)

There are two common methods:

1. Directly from Your Local Machine:
   In your project directory, run:

   # Initialize a new Git repository
   git init
   
   # Stage all files for commit
   git add .
   
   # Commit with a descriptive message
   git commit -m "Initial commit"
   
   # Add the remote repository (replace URL with your repository's URL)
   git remote add origin https://github.com/yourusername/your-repo.git
   
   # Push your changes to the main branch on Github
   git push -u origin main

2. Using the Github Website:
   • Create a new repository on Github.
   • Clone it to your local machine.

Cloning a Repository

Cloning downloads a Github repository to your local machine:

git clone https://github.com/username/repository.git

After cloning, you have a complete copy of the repository locally.

Adding, Committing, and Pushing Change

The most common Github workflow is basically where you make changes to your code locally on your computer, and then push those changes to the remote repository on Github when you’re ready to save your changes (seem above image).

To update your repository with new changes:

git add .
git commit -m "Describe your changes here"
git push -u origin main

This process ensures your changes are saved locally and synchronized with your remote repository.

Stashing Changes

Stashing is a helpful way to save work-in-progress without committing the changes. The following commands are all the commands related to shashing

git stash # stash your changes
git stash list # list your stashes
git stash pop # apply your stashed changes

Checking the status of your repository

git status # check the status of your repository
git log # check the commit history
git diff # check the changes you made to a file
git branch # list all the branches in your repository

Reverting Changes

If you need to undo changes, consider the following commands:

git revert <commit-hash> # revert the changes made in the commit with the given hash
git reset --hard # reset your changes to the previous commit, use this command with caution

Git Practice!

Make and Edit a Repository

Get familiar with creating your own Github repository and adding files to your Github repository. Don’t forget to leverage ChatGPT or other LLMs to answer questions you might have while you do these steps!

1. Create an empty NextJS project.
2. Run this project locally (to see what it looks like).
3. Create a .env file with a dummy key.
4. Initialize your git repository.
5. Add a git ignore file (include the .env file and the node_modules folder).
6. Add all the git files to your repository.
7. Push the changes.
8. Look on your online Git account to make sure that all the folders in your project are there (and the .env file and node_modules folders are NOT there).
9. Now, make a slight modification to the text in the main landing page (you can ask Cursor to help you with this).
10. Add, commit, and push your changes. Voila, you have created a new repository, and pushed incremental changes to it!

TODO: Add in video showing me going through the steps of doing this.

More Advanced Github Features

We have only scrated the surface of what commands are available in Github. We have mainly focused on the commands where you are working on the repository alone. When you start collaborating with others, you will wnat to learn the concept of branching and pull requests.

Pulling Changes

Branches

Pull Requests

Merging

Forking

We would recommend looking into the resources below to learn more about these concepts.

Resources

For more detailed guidance on using Github, check out these resources:

• Github Documentation
• Github Cheatsheet
• Pro Git Book
• Learn Git Branching