Deploying Your Client Sites

If you have your own delpoyment setup in min, you can skip this page.

This setup uses a deployment strategy by Sharath Vignesh explained here.

Github Actions Setup

12)Create Github Secrets for Actions. In your github project for the following Workflow variables: js ENV_FILE_DEV ENV_FILE_GREEN ENV_FILE_BLUE Each of these Github Secrets need to contain all of the variables and values found in the .env file you’ve just edited. Keep all the vairables safe somewhere on your local computer because once saved in Github Secrets you will not be able to view them again. See screenshot for reference:

1. Create seperate Github Secrets for each of the variables below. These are used in the Github Workflow templates which can be found in the .github/workflows folder:

   AWS_BUCKET_NAME_DEV="dev.{your-domain-name}"
   AWS_BUCKET_NAME_BLUE="blue.{your-domain-name}"
   AWS_BUCKET_NAME_GREEN="green.{your-domain-name}"
   AWS_ACCESS_KEY_ID="{access key from step 11}"
   AWS_SECRET_ACCESS_KEY="{secret access key from step 11}"
   AWS_REGION="{default us-west-1}

2. Run:

   npm build

3. Create three new branches after creating the main branch:

   git checkout -b dev
   git checkout -b green
   git checkout -b blue

4. Push the three branches: dev, blue, and green live.

   git push -u origin dev
   git push -u origin blue
   git push -u origin green

5. After a few minutes wating for the github actions (see them running under the github.com Actions tab) you should be able to navigate to your live website.

6. running npm start will launch the local copy, but it uses the variables stored in the env file, so it is possible to switch between the dev, blue, and green stacks locally by commenting/uncommenting the block of variables (the live dev stack is the default)