Multiple Site Netlify Deployments

Strapi v4 plugin to trigger, monitor, and cancel deployments on Netlify for 2 sites.

Plugin Preview

Home Page:

Settings Page:

Installation

Install dependency

Run the following command in your Strapi project to install netlify-deployments:

yarn add strapi-plugin-multi-site-netlify-deployments
# or
npm i -S strapi-plugin-multi-site-netlify-deployments

Enable plugin configuration

Open config/plugins.js file and add the netlify-deployments entry:

module.exports = ({ env }) => ({
  "multi-site-netlify-deployments": {
    enabled: true,
  },
});

Run

You can now run Strapi:

yarn develop

You should see the Netlify Deployments menu in the left panel.

Note: You may need to run yarn build in order to see the new menu entries.

Then you can proceed with the plugin configuration.

Plugin Configuration

Config properties

Example:

module.exports = ({ env }) => ({
  "multi-site-netlify-deployments": {
    enabled: true,
    config: {
      site1: {
        name: "Site 1",
        buildHook: "https://api.netlify.com/build_hooks/<hook_id>",
        accessToken: "<netlify-access-token>",
        siteId: "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
      },
      site2: {
        name: "Site 2",
        buildHook: "https://api.netlify.com/build_hooks/<hook_id>",
        accessToken: "<netlify-access-token>",
        siteId: "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
      },
    },
  },
});

The plugin is reading the following configuration variables to work:

• buildHook: URL of the Build Hook in Netlify.

  • You can follow this guide to create a build hook on Netlify

• accessToken: Access token of your Netlify account used to fetch the list of deployments

  • Access tokens can be created and managed on your user settings

• siteId: Site ID of your Netlify site used to filter the list of deployments

  • Set the Site ID of your Netlify Site to see only the deployments you need. This can be found at Site settings > General.

Environment Configuration

You shouldn't disclose the Access Token or Build Hook for security reasons. Therefore, you shouldn't add these values to versioning in a public git repository. A suggested solution is to use environment variables. You can hardcode the site names. Example:

module.exports = ({ env }) => ({
  "netlify-deployments": {
    enabled: true,
    config: {
      site1: {
        name: "Site 1",
        buildHook: process.env.NETLIFY_DEPLOYMENTS_SITE1_PLUGIN_BUILD_HOOK,
        accessToken: process.env.NETLIFY_DEPLOYMENTS_SITE1_PLUGIN_ACCESS_TOKEN,
        siteId: process.env.NETLIFY_DEPLOYMENTS_SITE1_PLUGIN_SITE_ID,
      },
      site2: {
        name: "Site 2",
        buildHook: process.env.NETLIFY_DEPLOYMENTS_SITE2_PLUGIN_BUILD_HOOK,
        accessToken: process.env.NETLIFY_DEPLOYMENTS_SITE2_PLUGIN_ACCESS_TOKEN,
        siteId: process.env.NETLIFY_DEPLOYMENTS_SITE2_PLUGIN_SITE_ID,
      },
    },
  },
});

Local development

For local development, you can add the config properties in your .env file:

NETLIFY_DEPLOYMENTS_SITE1_PLUGIN_BUILD_HOOK="https://api.netlify.com/build_hooks/xxxxxxxxxxxxxxxxxxxxxxxx"
NETLIFY_DEPLOYMENTS_SITE1_PLUGIN_ACCESS_TOKEN="<netlify-access-token>"
NETLIFY_DEPLOYMENTS_SITE1_PLUGIN_SITE_ID="xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"
NETLIFY_DEPLOYMENTS_SITE2_PLUGIN_BUILD_HOOK="https://api.netlify.com/build_hooks/xxxxxxxxxxxxxxxxxxxxxxxx"
NETLIFY_DEPLOYMENTS_SITE2_PLUGIN_ACCESS_TOKEN="<netlify-access-token>"
NETLIFY_DEPLOYMENTS_SITE2_PLUGIN_SITE_ID="xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"

Server

You can save these values as process env variable on your server (e.g. this guide is for Heroku).

Credits

Thanks to jclusso for making strapi-plugin-netlify-deployments which this is heavily built from.