Deploying to Moovweb XDN

React Storefront makes it easy to deploy your project to Moovweb XDN (Experience Delivery Network). Simply create your project in Moov Console, update your deploy script, and deploy from the command line by running npm run deploy {environment}, or configure automatic deployment with CircleCI. Here's how you can configure your project for deployment:

• Sign into the Moov Console and click "Create New Project"
• Give your project a name. Since you'll most likely be deploying your project to at least two environments (for example, staging and production), we recommend adding a suffix to the project name that matches the suffix of one moov_config-*.json files in the root of your project. For example, "my-project-prod" for moov_config-prod.json and "my-project-stage" for moov_config-stage.json.
• Select the domain model. We recommend using "Single Domain" for PWAs
• Select "JavaScript" for the project type (the default).
• Click "Create Project"

Open package.json and find the "deploy" script. By default it should look something like this:

"deploy": "npm build && /bin/bash -c \"g() { npm run link -- $@ && moov deploy --ignore-live --deploy-id=\"`git rev-parse HEAD`\" --notes=\"`git log -1 --pretty=format:%s`\" moovweb/react-storefront-$@ && npm run link -- local; }; g\""

This script does the following:

1. Builds your project
2. Updates the symlink moov_config.json in the root of your project to the moov_config-*.json file corresponding to the environment we're deploying to
3. Calls moov deploy to upload the built project to Moovweb XDN

Update this script so that it uses your organization and project by replacing moovweb/react-storefront-$@ with {my-org}/{my-project-name}-$@. For example, if your project is called "my-project-prod", use "my-project-$@".

To deploy your project to the Moovweb XDN, run:

npm run deploy {environment-name}

For example, to deploy to staging, run

npm run deploy stage

To deploy to production, run:

npm run deploy prod

The React Storefront Boilerplate contains an example CircleCI configuration in .circleci/config.yml.

To deploy with CircleCI, make the following changes to .circleci/config.yml:

1. Find the step marked "deploy to production":

# deploy to production
    command: |
      npm build
      if [ $CIRCLE_BRANCH = 'master' ]; then
        npm run link -- prod
        moov deploy moovweb/react-storefront-prod -user-email=${MOOV_EMAIL} -user-password=${MOOV_PASSWORD} -ignore-live -deploy-id $(git rev-parse HEAD) -notes "$(git rev-parse --abbrev-ref HEAD) - $(git log -1 --pretty=%B)"
      fi

2. If you're deploying to an environment other than production, update the line that reads npm run link -- prod to deploy. The last part should match to the suffix of the moov-config-*.json file corresponding to the environment to which you are deploying.

3. Update "moov deploy moovweb/react-storefront-prod" to the correct project name. For example, if your project is called "my-project-prod", use "moov deploy "my-org/my-project-prod"

4. Add your moov credentials as MOOV_EMAIL and MOOV_PASSWORD environment variables in Circle CI.