Gatsby meets Airtable.

Ismail Ghallou
June 17th, 2019 · 2 min read

Before seeking funding or thinking about ways to profit from your idea, you surely need to build an MVP as a proof of concept of your idea first and when it comes to MVPs, everyone hates to spend time picking the tech stack, setting up some mockups, working on both the front-end and back-end sides which leads most of entrepreneurs using third-party services to do less coding, services such as:

  • Heroku
  • Firebase
  • Netlify
  • Airtable
  • Gatsby
  • etc…

In this article, we’ll cover up building React MVPs using Airtable to handle the backend, before we get to the definitions, let’s first check the options we have when it comes to building React apps, basically we have these 3 options:

  • CRA - create-react-app - which offers client-side rendering only
  • Next JS - which offers server-side rendering
  • Gatsby Js - which offers pre-rendering which means server-side rendering during build time


We will go with Gatsby as it has more pros than cons and it’s easier to setup than Next Js, Gatsby is a new static site generator built with React, webpack & GraphQL, it is based on Node js unlike Jekyll and Hugo. It allows you to create hybrid apps that contain static & dynamic content.

the static pages are generated during build time


Airtable is simply a better Google spreadsheet that can be used like an admin panel to manage your content. You start by creating a new base then you started creating tables with content, each base provides a nice documented API which you can query from your Gatsby app.

Static & Dynamic content

Using Airtable source plugin, you can actually fetch the content during build time from your Airtable base, the plugin is called gatsby-source-airtable, but you will have to redeploy your website when ever you change something from Airtable and your API key is not exposed to the client unlike if you want to add dynamic content to do CRUD operations, there are of course methods to avoid exposing your API key but Airtable has to handle this like other services do.

Upcoming webinar

If you’d like to know more about building MVPs with Gatsby & Airtable, you can sign up to our upcoming webinar where Ismail Ghallou aka Smakosh will walk you through explaining every part with a real life demo which will be open sourced and shared with you. He will answer all your questions as well so make sure to sign up!

In case you missed the Webinar, it has been recorded and can be seen here

More articles from Obytes

Choose the right React Native Navigation library.

In this article, we will take a look at the possible solutions to make the best navigation experience for users and developers too. We will discuss the most popular solutions and help you make the right choice.

March 7th, 2019 · 5 min read

Importance of lean UX in creating products people love.

Lean UX is a way to apply the methods of learning as quickly as possible and reducing the cycle time, through the build, measure and learn loop commonly used in the Lean methodology

February 11th, 2019 · 2 min read


Our mission and ambition is to challenge the status quo, by doing things differently we nurture our love for craft and technology allowing us to create the unexpected.