A headless Ecommerce starter for Gridsome, using Elliot.
This uses the Elliot source plugin (gridsome-source-elliot
) to fetch data from Elliot, and download images for use with g-image
.
Elliot provides checkout & order API's to allow you a completely customised checkout experience, and this starter makes use of those. See it in action!
You will need your Elliot keys to get started - follow the steps below to do so:
- Login to Elliot Admin
- Choose a Domain Space
- Click on 'Get Headless' under the Developers section
- Choose an Experience, and click 'Copy Variables to Continue'
It is recommended to add these to a .env
file at the root of your project, as these are secret keys, and should NOT be exposed or included in a git repository etc.
Install the Gridsome CLI.
npm install -g @gridsome/cli # or
yarn global add @gridsome/cli
You can either directly download this repository, or use Gridsome's CLI to download and install dependencies for you.
# Clone repository
git clone https://github.com/thetre97/gridsome-starter-elliot.git
npm install # or
yarn install
# Download with CLI
gridsome create my-gridsome-site thetre97/gridsome-starter-elliot
Once you have your Elliot API keys (follow the steps above), add them to a .env
file in the project root.
.env
ELLIOT_KEYS="<paste variable string here>"
You can edit the source plugin options under gridsome.config.js
if needed.
Run gridsome develop
in the project root to start the local development server.
Take it away! The sky is the limit.