This template bootstraps a React project with CI/CD workflows through GitHub Actions.

Benefits:

• Keep a clean and organized development process.
• Automatate testing and deployment of code to staging and production environments.
• Automatically upload artifacts and coverage reports.

Creating a repo from a template

Your branch used for production/deployment is the default branch, master. For CI/CD to work correctly, you must create a branch off of master, develop. This will be your staging branch.

All features and updates should be made through a unique branch, and PR's made to develop.

The above process is necessary for the workflow to work as intented. Beyond develop and master, you can use any branch name you like.

• Install surge (npm install -g surge)
• Run surge to create a domain. You will want to do this twice and set two different domains - one for staging and one for production. Must have a Surge account.

Reference video.

For code coverage reporting, you must register your repository with Codecov. Instructions found here.

The workflow for this project can be found at .github/workflows.

Properties to update:

• STAGING_URL (line 14)
• PRODUCTION_URL (line 15)

Update lines 14-15 with the staging and production URLs you set in step 3.

This workflow will run on a PR or push to the develop or master branch. Below is an overview of how the workflow operates with each event:

For more information on GitHub Actions, see the docs.

In your GitHub repository, navigate to Settings ➡ Secrets ➡ Actions. Create two secrets with the following keys and values:

• SURGE_LOGIN - your Surge ID
• SURGE_TOKEN - your Surge password