Code Monkey home page Code Monkey logo

learn-git-milestones's Introduction

Git Milestones

Below is a list of tasks. By mid-semester, everyone should...

  • Understand what the task is asking
  • Be able to do the task
  • Make it clear through your actions you understand each concept

Contents

  1. Instructions
  2. Git Basics
  3. Basic Git workflows
  4. Create a new repository
  5. Turn in Assignments
  6. Git Advanced
  7. Grading
  8. Resources

Instructions

  1. Review the first four sections (Git Introduction, CLI Tutorial, Git Installation, and Git Tutorial) of Git & Github lecture...
  2. Complete each task below, creating files and adding content inside the Completions table when prompted: ✏️
  3. After you finish, celebrate your Git proficiency! 🙌

Notes...

  • RTM - Sometimes I give the command you need and sometimes you have to read the documentation to find it.
  • Details - Follow the instructions.
  • Classes - This milestone is made to use with multiple classes; insert your own class name where you see <your-class-name-here> (e.g. dig245-critical-web-design)

Part 1 – Git Basics

Markdown

Markdown is a lightweight markup language for creating formatted text using a plain-text editor.

  • It has a simple syntax similar to HTML
  • It is standard language for formatting README files (what you are currently viewing!)
  • Markdown files use the .md extension and can be edited with any plain text editor (e.g. Atom).
  • Markdown can be previewed using the Markdown Viewer browser extension. (hint: allow file:// origins)
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"> text

Now you know basic Markdown! 🎉 The following instructions will help you learn Git, editing this .md file in the process. Feel free to check your syntax in the github markdown cheatsheet.

Other Markdown tools

Fork this repository

Create a Github account and make your first commit on Github.com

  1. Create a Github account
  2. Fork this learn-git-milestones repository (click the Fork button, top right).
  3. ✏️ Edit this README.md file (click the pencil icon on the Github.com page) and add your favorite emoji to the Completions table, in the Completed column in appropriate row in the completions, below.
  4. Commit changes to README.md to the main branch with the message commit #1 from Github.com.
  5. ✏️ 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.
  6. ✏️ 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.
  7. View the commit history and confirm your edits

Git Installation

Install your development environment

  1. Complete the command line crash course
  2. Install Git on your machine (via)

Windows

  1. Install Git for Windows (includes Git BASH, its own version of the bash shell)

Mac

  1. Install the homebrew package manager (confirm "yes" if asked to install Command Line Developer Tools)
  2. Install git using Homebrew brew install git (unless you are upgrading?)

Configure Git

  1. When you first install or start using Git, verify it is installed by typing git on the command line and hitting enter. This displays a help file with a list of possible commands.
    • ✏️ What does log do? Add your answer to completions.
  2. Then you should update the configuration. Add your name and email (replace with your information and press return after each line)
git config --global user.name "Jane Doe"
git config --global user.email [email protected]
  1. Set the default branch to main
git config --global init.defaultBranch main
  1. Set pull to merge (not rebase)
git config --global pull.rebase false
  1. Confirm your global settings worked with either of these 1
# show contents of global config
cat ~/.gitconfig
# or show settings and location of each config file (system, global, local)
git config --list --show-origin

Part 2 – Basic Git workflows

You should be able to perform a basic Git workflow using Github.com, the command line, Github Desktop, and Git in a preferred text editor (e.g. Atom or Visual Studio). These four different interfaces will give you practice and help you understand Git better. You've already forked and made a commit on Github.com so let's move to Github Desktop ...

In Github Desktop

You should be able to ...

  1. Install Atom on your machine
    1. Connect your Github account in Atom
  2. Install Github Desktop
    1. Connect your Github account in Github Desktop
    2. In Github Desktop, clone the fork (you made above) learn-git-milestones ...
    3. File > Clone Repository > Github.com and select it ...
    4. 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. dig245-critical-web-design, dig250-game-development )
    5. Click "Clone" to make a local copy
  3. Open the repo in Atom: Repository > Open in Atom
  4. ✏️ In Atom, edit this README file and add your second favorite emoji to completions.
  5. In Github Desktop, view/confirm your edits to the README file on the Changes tab
  6. ✏️ Commit your changes directly to the main branch with the message commit #2 from Github Desktop. Using Atom, add a link to this commit on Github.com to completions.
  7. Click Push origin to push your new commit to remote repo
  8. Confirm the changes to the README file were pushed: Choose Repository > View on Github
  9. Click on the README file and then click on History to see the history of this file

Command line interface (CLI)

You should have a basic familiarity with the command line to install Git. Some folks use the CLI as their default tool for editing and publishing source code, but Atom makes it much easier.

  1. If you haven't yet, complete the command line crash course
  2. In Github Desktop, with the learn-git-milestones repo you cloned above selected, click Repository > Open in Terminal ("Bash" in Windows?)
  3. Use the CLI to navigate directories
  4. List files in this directory: ls
  5. List files in this directory, including hidden: ls -la
  6. Confirm the existence of the .git directory (where Git versions and config are stored)
  7. View your current directory and copy the full path: pwd
  8. Open this README file in Atom and paste that path in completions.
  9. Use Git on the CLI
  10. Confirm your name and email is correct in the Git config
  11. View the status of your repo: git status
  12. View the changed files of your repo: git diff
  13. Add all changed files to the staging area git add .
  14. View the status of your repo git status to confirm it has been staged
  15. ✏️ Commit your changes with the message commit #3 from CLI. Add a link to this commit to completions.
  16. 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) ...

Git in Atom

You should be able to ...

  1. In Github Desktop, open this repo learn-git-milestones in Atom: Repository > Open in Atom
  2. ✏️ In Atom, edit this README file and add your third favorite emoji to completions.
  3. ✏️ Create a new file hello.txt, add some text and save it.
  4. Display the Git panel (click the small Git button at the bottom right).

atom-git-menu

  1. Select on your file(s) in Unstaged changes and confirm your changes match what you expect to see
  2. Double click on each file with changes to stage them
  3. ✏️ Commit your changes directly to the main branch with the message commit #4 from Atom. Add a link to this commit to completions.

Part 3 – Create a new repository

  1. Create a repository from scratch
  2. ✏️ In Github Desktop, create a new repository with the name: my-awesome-project
  3. Local Path: Click "Choose" and create a new folder my-awesome-project inside the <your-class-name-here> folder you made above
  4. Click Create Repository
  5. This should now be your class folder's directory structure.
<your-class-name-here>
  |-- my-awesome-project
  |-- learn-git-milestones
  1. Open your new repository in Atom (with Github Desktop or drag the my-awesome-project project folder onto the Atom icon in your dock)
  2. ✏️ Add a README file: README.md
  3. ✏️ In the README write your name and the date
  4. ✏️ Use some Markdown tags
  5. ✏️ Commit your changes and add a link to this repo to completions.

Part 4 – Create a Github.io page

Create a github.io site for your repository ...

  1. ✏️ Create a file called index.html in your new repo and add the following html
<!DOCTYPE html>
<html>
<head>
<title>My first github.io website</title>
</head>
<body>

<h1>Hello world!</h1>
<p>🙌</p>

</body>
</html>
  1. Set up a Github page "project site" for your repo
  2. On Github.com, go to your repo > Settings > Pages
  3. Select the main branch source and click save
  4. Do not use a theme. Start from scratch
  5. Visit your project site at http://username.github.io/my-awesome-project
  6. Update your project, push a new commit, and confirm your updates (note: changes are not always instant)
  7. ✏️ Paste this link to completions.

Part 5 – Turn in this Assignment

Now that we have basic Git commands out of the way use Git to create and turn in your assignment ...

  1. Complete all of the items on this README, making sure all the rows in the "Completed" column contain your information below.
  2. Test your file(s) in a web browser
  3. Commit and push the files to Github
  4. Paste the github.io link into the appropriate Moodle forum

Git Advanced

That is all that is required for this milestone. See the ADVANCED.md file if you would like to continue learning Git.

Completions

Item # Description Completed
1a 1st Favorite emoji 😂
1b Link to commit #1 from Github.com commit #1 from Github.com
1c Link to markdown tables docs how to use tables
1d What does log do? shows a log of the commit history
2a 2nd Favorite emoji 👽
2b Link to commit #2 from Github Desktop commit #2 from Github Desktop
2c Full path to your working directory /Users/kostasmateer/Sites/critical-web-design/learn-git-milestones
2d Link to commit #3 from CLI commit #3 from CLI
2e 3rd Favorite emoji 😊
2f Link to commit #4 from Atom commit #4 from Atom
3a Link to my-awesome-project github.com repo page link to my-awesome-project
4a Link to my-awesome-project github.io "project site" link to my-awesome-project website

Resources

Here are some popular tutorials/guides. You should still look for other ones that you might like better!

Credits

Thanks to Jesse Farmer for inspiring this milestone assignment.

learn-git-milestones's People

Contributors

omundy avatar kostasmateerstudent avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.