All Images

Introduction to Version Control


Creating repositories using the web interface


Figure 1

Screenshot of the GitHub interface highlighting the green New button in the top left corner
The green “New” button in the top left corner of GitHub

Figure 2

Screenshot of the GitHub interface highlighting the plus icon menu in the top right corner
The “+” menu in the top right corner of GitHub

Figure 3

Screenshot of the GitHub new repository creation form
The GitHub new repository form

Figure 4

Screenshot of a newly created GitHub repository showing the README and one commit
A newly created repository

Figure 5

Screenshot of the GitHub interface highlighting the buttons for creating a new file
Buttons for creating a new file

Figure 6

Screenshot of the GitHub web editor with recipe content entered
The new file editor

Figure 7

Screenshot of the GitHub commit form for a new file
Committing a new file

Figure 8

Screenshot of the GitHub file editor showing a diff preview
Editing a file with a preview of the change

Figure 9

Screenshot of the GitHub commits list
Browsing commits

Figure 10

Screenshot of an example commit history with several commits
Example commit history

Figure 11

Screenshot of CodiMD showing the Markdown source and rendered preview side by side
The CodiMD split-pane editor

GitHub Issues and Pull Requests


Figure 1

Screenshot of the GitHub new issue form
The GitHub new issue form

Figure 2

Screenshot of GitHub prompting to fork a repository before editing a file you do not own
Editing a file on someone else’s repository triggers a fork

Figure 3

Screenshot of the GitHub commit form showing a Propose changes button instead of Commit changes
The “Propose changes” button

Figure 4

Screenshot of the GitHub Compare Changes page showing a diff of the proposed changes
The Compare Changes page

Making changes with GitHub Desktop


Figure 1

Screenshot of the GitHub Desktop welcome screen
The GitHub Desktop welcome screen

Figure 2

Screenshot of the GitHub Desktop Clone a repository window
The Clone a repository window

Figure 3

Screenshot of the Changes tab in GitHub Desktop showing new files
The Changes tab in GitHub Desktop

Figure 4

Screenshot of the History tab in GitHub Desktop showing the latest commit
The History tab in GitHub Desktop

Figure 5

Screenshot of GitHub Desktop showing new options in place of Push origin
New push/pull options appear after a conflicting remote change

Figure 6

Screenshot of GitHub Desktop warning about merge conflicts that need to be resolved
A warning about resolving conflicts

Figure 7

Screenshot of a text editor showing Git conflict markers in the README file
Conflict markers shown in a text editor

Making changes with VSCode


Hosting websites on GitHub Pages


Figure 1

Screenshot showing the GitHub Settings Pages section
A screenshot showing the GitHub Settings Page section

Figure 2

Screenshot showing the GitHub Pages settings with the main branch and root folder selected
A screenshot showing the GitHub Settings Page section, with main branch and root selected

Figure 3

Screenshot of the GitHub Actions page showing a pages build and deployment workflow that was just triggered
A screenshot showing the GitHub Actions page with a deployment that has just been triggered

Figure 4

Screenshot of a completed GitHub Actions workflow with a link to the deployed site
A screenshot showing details of a GitHub Actions workflow

Figure 5

Screenshot of a simple deployed webpage with links to recipes
A screenshot showing a simple webpage with links to recipes