We are recently developed a site into the gatsby. basically contact us feature is common in all website.
and we are implementing Mailchimp because it's a very popular platform in email market.

So, I will show you how to setup a Mailchimp in the Gatsby site.

## Using gatsby-source-mailchimp

Use your Mailchimp API key to download your campaigns into Gatsby’s GraphQL data layer!

Install the package by running the following command: `npm i gatsby-source-mailchimp --save`

### How to configure
Once the installation is complete, you can now add this plugin to your gatsby-config.js, like so:

Configure mailchimp Key and add this {resolve: `gatsby-source-mailchimp`} into the plugins array. code looks like

```
module.exports = {
  // ...
  plugins: [
    {
      resolve: 'gatsby-source-mailchimp',
      options: {
        // Avoid including your key directly in your file.
        // Instead, opt for adding them to .env files for extra
        // security ;)
        key: 'asd712jdas90122jdas90122jkadsd1-usXX',
        rootURL: 'https://usXX.api.mailchimp.com/3.0',
      },
    },
  ],
  // ...
}
```

Above is the minimal configuration required to have it work. By default,
This plugin was made out of a specific necessity, so it doesn't cover all of Mailchimp’s data sources, focusing only on campaigns.

this plugin are provide few options. you can refer here.

## Using `.env` variables to hide your key
If you don’t want to attach your API key to the repo, you can easily store it in .env files by doing the following:

```
// In your .env file
MAILCHIMP_KEY = 'asd712jdas90122jdas90122jkadsd1-usXX';
```

```
// In your gatsby-config.js file
require('dotenv').config({
  path: `.env.${process.env.NODE_ENV}`,
});

module.exports = {
  // ...
  plugins: [
    {
      resolve: 'gatsby-source-mailchimp',
      options: {
        key: process.env.MAILCHIMP_KEY,
        rootURL: 'https://usXX.api.mailchimp.com/3.0',
        // ...
      },
    },
  ],
  // ...
};
```