Gatsby Source Maavee Database
A minimal source plugin to source specific ‘Brand’ data for the Maavee e-commerce store.
A minimal boilerplate for the essential files Gatsby looks for in a plugin.
Built from gatsby-starter-plugin
Usage
- Install npm package.
npm i @weareenvoy/gatsby-source-mvdb
- Update the
gatsby-config.js
of your gatsby project (where this plugin will be used) and include the plugin in theplugins
array.:
cd path-to-some-gatsby-project
module.exports = {
plugins: [
// other gatsby plugins
// ...
{
resolve: '@weareenvoy/gatsby-source-mvdb',
options: {
api_base_url: process.env.MV_DB_URL,
token: process.env.MV_DB_TOKEN,
},
},
],
}
Sample .env file
MV_DB_URL="XXX"
MV_DB_TOKEN="XXX"
- Verify the plugin was added correctly
You can verify your plugin was added to your site correctly by running gatsby develop
for the site.
You should now see a message logged to the console in the preinit phase of the Gatsby build process:
$ gatsby develop
...
Loaded gatsby-source-mvdb
...
BUILDING NODES FOR (X) BRANDS!
...
If the above was successful you will also see allBrand
in GraphiQL at http://localhost:8000/___graphql
Contributing
You may point your GatsbyJS project to a local copy of this plugin and test your updates. The usage is the same as described above with the difference of pointing to your local copy within your gatsby-config.js
file.
- Clone (or download) the repo and install npm packages.
git clone git@github.com:weareenvoy/gatsby-source-mvdb.git
cd gatsby-source-mvdb
npm install
- Go to the project that will use this plugin and update
gatsby-config.js
to point to your local copy of the plugin. Notice the linerequire.resolve('<path-to>/gatsby-source-mvdb')
where you specify the path to the plugin root folder:
module.exports = {
plugins: [
// other gatsby plugins
// ...
{
resolve: require.resolve(`../gatsby-source-mvdb`),
options: {
api_base_url: process.env.MV_DB_URL,
token: process.env.MV_DB_TOKEN,
},
},
],
}
Make sure you have the required .env
variables as described in the Usage section.
Directory Structure
The main files being used are as follows:
gatsby-node.js
Implements Gatsby sourceNodes API and calls functions in the next file, which handles the API calls.
api.js
Makes REST call to the client provided URL where they store their Brand data.