Edit-test-website CI/CD lifecycle demo

Tools Used

• For this demonstration we show the use of Visual Studio Code
• We also use GitHub
• And Netlify

Before Website

Creating a Commit

Create a Branch

Not shown here, but you should create a separate branch to create a pull request.

Edit the Post

Stage Your Changes

Not shown here, but you should ‘stage’ the changes you want to commit.

Add a Commit Message

Commit

Create a Pull Request

Push the Commit to GitHub

If Applicable Select the GitHub ‘Remote’

For most beginners this will be ‘origin’.

From the Branch Create a Pull Request

Go to GitHub and Select Compare & Pull Request

Update the Pull Request Title (If More than One Commit)

Actually Create the Pull Request

Screenshot is from another PR

Wait for CI Checks to Complete

Make sure the Continuous Integration Tests Succeeded

Review the Test Results in GitHub

Review the Preview Deploy (Netlify)

Sample preview is from a different PR

Take the Changes Live

Merge the Pull Request

Verify (Once CI Tests Complete) The Site Has Been Updated

Cleanup on GitHub

Delete the PR Branch

Merge the Changes Back to Your Local Repository

Pull the Changes from GitHub

Screenshot from another PR

Fetch with Prune (Cleans Copy of the GitHub Branches)

Screenshot from another PR

Cleanup

Delete Your Local Copy of the PR Branch

Screenshot from another PR

Verify the Git History

Screenshot from another PR

After Website

And the final result is post is live on your website and your local repo is in sync with GitHub.