Getting Started

First steps: CONTENTFUL SETUP

Create new Contentful Space

In the Contentful UI, request for a new space or create your new space. Turn on orchestration for the new space.

Next Steps: Blueshift Configuration

Populate blueshift catalogs to use in live content campaigns to feed into the project

Next Steps: NEXTJS SETUP

Once your Contentful space is populated with content entries & the Blueshift account has recommendation blocks + live content campaigns, continue onto the NextJS steps.

npm install

CONTENTFUL_SPACE_ID=your Space ID
CONTENTFUL_ACCESS_TOKEN=Content Delivery API token
CONTENTFUL_PREVIEW_ACCESS_TOKEN=Content Preview API token 
CONTENTFUL_ENVIRONMENT_ID=Choose env To Pull Data From
//Blueshift event api key is not currently an env var 
//because it is being used on the client
//it currently exists in the /public-keys/blueshift dir as 
//an exported variable.
export const bsft_event_key=your blueshift event api key

export async function fetchGraphQL(query: string, preview = false) {
  return fetch(
    `https://graphql.contentful.com/content/v1/spaces/${process.env.CONTENTFUL_SPACE_ID}/environments/YOUR_ENV_HERE`,
    {
      method: "POST",
      headers: {
        "Content-Type": "application/json",
        Authorization: `Bearer ${
          preview
            ? process.env.CONTENTFUL_PREVIEW_ACCESS_TOKEN
            : process.env.CONTENTFUL_ACCESS_TOKEN
        }`,
      },
      body: JSON.stringify({ query }),
    }
  ).then((response) => response.json());
}

to start the dev server and run the project locally.

Contentful

Getting Started

Analytics

First steps: CONTENTFUL SETUP

Next Steps: Blueshift Configuration

Next Steps: NEXTJS SETUP

Finishing Touches: Deployment

Related content