Take a moment to look back at the advancement of modern JavaScript in the last few years.
There are certainly a few specific frontend techs that pop to your mindβReact, Node, Redux, etc.
You canβt argue that Vue.js and GraphQL also made significant waves in the ever-growing JS pond.
Now, what if I told you that the tool leveraging both to build powerful websites and apps has arrived?
Yes, Vue.js finally found its Gatsby, and itβs called Gridsome.
It quickly caught the attention of our team and today Iβm putting it to the test by building my own Vue & GraphQL-powered e-commerce app.
This tutorial will highlight some of Gridsomeβs neat features while using Airtable as a handcrafted database.
Steps π
- Creating a Gridsome project
- Handling a products sheet in Airtable
- Crafting a Gridsome data source plugin to fetch products from Airtable
- Querying data with GraphQL
- Building Vue.js views & listing
- Adding the buy button
First, a bit of context.
Intro to Gridsome: Leveraging Vue.js & GraphQL
Please donβt feel ignorant if this is the first time you've read about Gridsome as itβs only a few months old. Though, spoiler alert, youβll probably hear about it more and more in the months to come.
Itβs a Vue-based static site generator that connects to any CMS or data source from a GraphQL layer.
It was strongly inspired by what Gatsby does for React.
β Read the full post and technical tutorial here
Top comments (0)