An introduction to Git and Github.
Complete each task below, creating files and adding content inside the completions table when prompted with a ✏️ - After you finish, celebrate your Git proficiency! 🙌
- Follow the instructions. Review course content as needed.
- Sometimes I share the command you need, but you may need to read the documentation.
- This milestone is for multiple classes. Insert your own class name when prompted, for example:
critical-web-design
Download and install Git from gitforwindows.org. This includes Git BASH. The default settings should work fine.
Install Git using Homebrew using these instructions:
- Copy and run this whole line to Install the homebrew package manager. If prompted to "Install Command Line Developer Tools?", choose yes.
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
- To confirm installation:
brew --version
- Then install git using homebrew:
brew install git
- This will verify Git is installed by outputing the current version.
git --version
# -> git version 2.38.1
- Check to see if Git is already configured. If this returns
"No such file or directory"
or you want to update the file then continue to the next step.
cat ~/.gitconfig
- Add your name (replace with your information, press return after each line)
git config --global user.name "Your Name"
- Add your email
git config --global user.email [email protected]
- Set the default branch to main
git config --global init.defaultBranch main
- Set pull to merge (not rebase)
git config --global pull.rebase false
- Confirm your global settings worked
cat ~/.gitconfig
Markdown is a lightweight markup language for creating rich text.
- It has a simple syntax similar to HTML
- It is the standard language for formatting README files (what you are currently viewing!)
- Files use the
.md
extension and can be edited with any plain text editor (e.g. VS Code). - Preview using the VS Code or the Markdown Viewer
Markdown | HTML | Rendered Output |
---|---|---|
[link](https://davidson.edu) |
<a href="https://davidson.edu">link</a> |
link |
**bold text** |
<b>bold text</b> |
bold text |
*italicized text* |
<i>italicized text</i> |
italicized text |
`code` |
<code>code</code> |
code |
![text](assets/img/icon.png) |
<img alt="text" src="assets/img/icon.png"> |
![]() |
Now you know basic Markdown! 🎉
The following instructions will help you learn Git, editing this .md
file in the process. Use the github markdown cheatsheet to check your syntax.
Other Markdown tools
Create a Github account and make your first commit on Github.com
- Create a Github account
- Fork this learn-git-milestones repository (click the Fork button, top right).
- ✏️ Edit this
README.md
file (click the pencil icon on the Github.com page) and add your 1st favorite emoji to the Completions table, in the Completed column in appropriate row in the completions, below. - Commit changes to README.md to the
main
branch with the messagecommit #1 from Github.com
. - ✏️ Use Markdown documentation to add a link in completions. The link text should be the same as the commit message, and the url should point to the Github.com page showing the above commit.
- ✏️ Tables can be a little tricky in Markdown. Find a good link explaining how to use markdown tables. Paste the link in the Completions table.
- View the commit history and confirm your edits
- ✏️ What does
log
do? Add your answer to completions.
Perform a basic Git workflow using Github Desktop. This is the first of four different interfaces to give you practice with Git. You've already forked and made a commit on Github.com so let's move to Github Desktop ...
- Install Github Desktop
- Connect your Github account in Github Desktop
- In Github Desktop, clone the fork (you made above) learn-git-milestones ...
- File > Clone Repository > Github.com and select it ...
- Local Path: Click "Choose" and add a new folder on your computer. This will be the base folder for your work in this class (e.g.
critical-web-design
,game-development
) - Click "Clone" to make a local copy
- Install VS Code) and connect your Github account
- Open the repo in VS Code: Repository > Open in VS Code (see preferences to change your editor)
- ✏️ In VS Code, edit this README file and add your 2nd favorite emoji to completions.
- In Github Desktop, view/confirm your edits to the README file on the Changes tab
- ✏️ Commit your changes directly to the main branch with the message
commit #2 from Github Desktop
. - Find a link to the above commit on Github.com and use VS Code to add it to completions. Commit your change.
- Click Push origin to push your new commit to remote repo
- Confirm the changes to the README file were pushed: Choose Repository > View on Github
- Click on the README file and then click on History to see the history of this file
Some folks use the CLI as their default tool for editing and publishing source code, but Github Desktop makes it much easier.
- In Github Desktop, ensure you are currently in the learn-git-milestones repo you cloned above.
- Click Repository > Open in Terminal ("Bash" in Windows?)
- List files in this directory:
ls
- List files in this directory, including hidden:
ls -la
- Confirm the existence of the
.git
directory (where Git versions and config are stored) - ✏️ View your current working directory and copy the full path:
pwd
- Open this README file in VS Code and paste that path in completions.
- Confirm your name and email is correct in the Git config
- View the status of your repo:
git status
- View the changed files of your repo:
git diff
- Add all changed files to the staging area
git add .
- View the status of your repo
git status
to confirm it has been staged - ✏️ Commit your changes with the message
commit #3 from CLI
. Add a link to this commit to completions. - Use
git push
to push those changes to your remote repo
You've used most of these already through a GUI (e.g. git status
, git add
, git commit
, git push
) ...
- From Github Desktop, you can open the learn-git-milestones repo in VS Code using: Repository > Open in VS Code
- ✏️ In VS Code, edit this README file and add your 3rd favorite emoji to completions.
- ✏️ Create a new file
hello.txt
, add some text and save it. - Display the Git panel (click the small Git button at the bottom right).
- Select on your file(s) in Unstaged changes and confirm your changes match what you expect to see
- Double click on each file with changes to stage them
- ✏️ Commit your changes directly to the main branch with the message
commit #4 from VS Code
. Add a link to this commit to completions.
- ✏️ In Github Desktop, create a new repository with the name:
first-website
- Make sure the repository is public not private
- Local Path: Click "Choose" and create a new folder
first-website
inside the<your-class-name-here>
folder you made above - Click Create Repository
- This should now be your class folder's directory structure.
<your-class-name-here>
|-- first-website
|-- learn-git-milestones
- Open your new repository in VS Code (with Github Desktop or drag the
first-website
project folder onto the VS Code icon in your dock) - ✏️ Add a README file:
README.md
- ✏️ In the README write your name and the date
- ✏️ Use some Markdown tags
- ✏️ Commit your changes and add a link to this repo to completions.
Github Pages is a free and easy way to host a website from your repository.
- ✏️ Create a file called
index.html
in your new repo and add the following code
<!DOCTYPE html>
<html>
<head>
<title>My first github.io website</title>
</head>
<body>
<h1>Hello world!</h1>
<p>🙌</p>
</body>
</html>
- On Github.com, go to your repo > Settings > Pages
- Select the main branch source and click save
- Do not use a theme. Start from scratch
- Visit your project site at http://username.github.io/first-website
- Update your project, push a new commit, and confirm your updates (note: deployments sometimes take a bit)
- ✏️ Paste this link to completions.
Now that we have basic Git commands out of the way use Git to create and turn in your assignment ...
- Complete all of the items on this README, making sure all the rows in the "Completed" column contain your information below.
- Test your file(s) in a web browser
- Commit and push the files to Github
- Paste the github.io link into the appropriate Moodle forum
Item # | Description | Completed |
---|---|---|
4a | 1st Favorite emoji | ADD_TEXT_TO_THIS_COLUMN |
4b | Link to commit #1 from Github.com |
|
4c | Link to markdown tables docs | |
4d | What does log do? |
|
5a | 2nd Favorite emoji | |
5b | Link to commit #2 from Github Desktop |
|
6a | Full path to your working directory | |
6b | Link to commit #3 from CLI |
|
7 | 3rd Favorite emoji | |
8 | Link to commit #4 from VS Code |
|
9a | Link to first-website github.com repo page |
|
9a | Link to first-website github.io "project site" |
Here are some popular tutorials/guides. You should still look for other ones that you might like better!
- The Git & Github lectures found in the schedule
- Github Desktop Documentation
- Github Cheatsheet HTML and PDF
- Github Learning Lab which contains tutorials like Introduction to Github and others
- View forks of this repo http://gitpop2.herokuapp.com/omundy/learn-git-milestones
That is all that is required for this milestone. See the ADVANCED.md
file if you would like to continue learning Git.
Thanks to Jesse Farmer for inspiring this milestone assignment.