Set up the Gatsby store

After you set up the Gatsby store, you can customize it to suit your needs.

Prerequisites

Before you begin, ensure that you have the following accounts set up:

• Elastic Path Commerce Cloud account
• Stripe account - Stripe is used as the payment gateway.
• Algolia account - Algolia is used for searches.
• Algolia Places account - The checkout process uses Algolia Places for quick address lookup.

Set up the Gatsby store

1. Set up a store.

   From a command prompt, run the following commands:

   gatsby new gatsby-demo-store https://github.com/moltin/gatsby-demo-store
   cd gatsby-demo-store
   yarn
   

2. Configure the environment variables that are required to run the project.

   In the root directory, create an .env file and add the following variables with your account secrets:

   GATSBY_MOLTIN_CLIENT_ID=
   GATSBY_STRIPE_PUBLISHABLE_KEY=
   GATSBY_ALGOLIA_PLACES_APP_ID=
   GATSBY_ALGOLIA_PLACES_API_KEY=
   GATSBY_ALGOLIA_INDEX_NAME=
   ALGOLIA_ADMIN_KEY=
   GATSBY_ALGOLIA_API_KEY=
   GATSBY_ALGOLIA_APP_ID=
   GATSBY_ITEMS_PER_PAGE=
   

3. From your Commerce Manager, configure Stripe as the payment gateway.

4. Optionally, you can trigger a push of your Elastic Path Commerce Cloud catalog to Algolia.

   note

   Executing the push overwrites any product data you currently have within Algolia under the index name provided in GATSBY_ALGOLIA_INDEX_NAME.

   From a command prompt, run the following command:

   yarn build
   

5. Start the store.

   From a command prompt, run the following command:

   yarn dev