Introduction to GitHub

      This file only relates to  GitHub.
      Click here to view the  GitLab Version
    

This page will give you a brief guide on the GitHub.com User Interface. It is color coded to tell you what it's referring to

Quick Jump References

• Main Interface and Code Screen
• Issue Screen
• Pull Request Screen
• Project Screen

Main Interface and Code Screen

1. Repository Statistics: Total Commits, Branches, Releases and Contributors. Clicking on the thin colored line will provide a list of languages detected in the repository
2. A dropbown box to swtich branches and a quick shortcut to create a new PR
3. Some useful buttons (from left to right):
   • Create New File - Creates a new file for you to edit directly from the website
   • Upload files - Uploads files to the repository from the website
   • Find file - Finds a file in the repository by the file name
   • Clone or download - Provides a URL where you can use to clone the repository. Also some buttons to open the repository in GitHub Desktop or to download the entire repository as a .zip file (See Clone Repository for more information)
4. Latest commit made to the repository's branch
5. The file list in the current selected branch as well as the last commit made that modified the file and how long ago that was

1. Dropdown box to switch branches
2. Latest commit made that modified this file
3. Some useful screens (left to right):
   • Raw - View the file directly
   • Blame - View who exactly changed which part of the code in this file at which commit
   • History - View the entire history of the file
4. Edit button to edit the file from the web directly
5. Content of file

1. Preview changes made to the file
2. Content of the file where you can edit
3. Commit Title
4. Commit Description
5. Which email to commit as and to commit to which branch/PR
6. Button to commit or cancel edit

Issue Screen

1. Button to create a new issue
2. Switch between open and closed issues
3. Filters to filter issues by the various properties
4. List of all issues

1. Button to edit title or create a new issue
2. Comment and changes made to the issue
3. Issue Properties (top to bottom):
   • Assignee - Who is assigned to the issue
   • Labels - Labels assigned to the issue (bug, enhancement etc)
   • Projects - What project board this issue is linked to
   • Milestone - Which milestone this issue is linked to
4. Box where you can enter comments to the issue as well as close it (if you are the issue creator)
5. Some issue controls (top to bottom):
   • Lock Conversation - Restrict comments to collaborators only
   • Pin Issue - Pin issue to the top of the list
   • Transfer Issue - Transfer issue to another repository
   • Delete Issue - Delete this issue

Pull Requests (PR) Screen

1. Button to create a new pull request
2. Switch between open and closed pull requests
3. Filters to filter pull requests by the various properties
4. List of all pull requests

1. Button to edit PR title
2. Tabs to switch pages (left to right):
   • Conversation - The screen you see now
   • Commits - List of commits in the PR
   • Checks - Checks that are being ran on this PR by a CI or service
   • Files changed - Diff of files that are changed in this Pull Request
3. Comment and changes made to the issue
4. PR Properties (top to bottom):
   • Reviewers - Who is involved in reviewing the PR
   • Assignee - Who is assigned to the PR
   • Labels - Labels assigned to the PR (bug, enhancement etc)
   • Projects - What project board this PR is linked to
   • Milestone - Which milestone this PR is linked to
   • Notifications - Whether to receive GitHub notifications on this PR
   • Lock Conversation - Restrict comments to collaborators only
5. Checks being done to this PR as well as the button to merge the PR
6. Box where you can enter comments to the PR as well as close it (if you are the PR creator)

Project Screen (It's like Trello/JIRA)

1. Create new projects
2. Filter between open and closed projects
3. List of all projects

1. Add issue cards (or add issue to the specific board)
2. Issue Cards