Newsletter For Templates
Join the Community For Templates
Subscribe to Templates newsletter for the latest news and updates
Gatsby starter theme for creating Airtable-backed listings with features like responsive images, dark mode, and TailwindCSS styling.
NotGeek Blog is a personal blog focusing on Web, Software Engineering, Java, backend architecture, and design, sharing insights and code examples.
A minimal bento-like single-page portfolio website template built with Astro, offering sleek UI, SEO optimization, and blog support.
Astro-theme-vitesse is a minimal, SEO-friendly portfolio and blog theme for Astro, supporting Vue and UnoCSS, designed for performance and modern web standards.
Gatsby starter theme integrated with Airtable.
Install Node package manager (NPM) (if you haven't already).
$ git clone [email protected]:wkocjan/gatsby-airtable-listing.git
$ npm install
To use this project you have to have a Airtable account.
Once you have it, go to this base and click Copy base
button located in the top right corner.
Included columns:
name
(single line text)slug
(single line text, should be unique)summary
(single line text)image
(attachment)descrition
(long text)country
(single select)tags
(multiple select)url
(single line text)Copy included .env.example
file to .env
and fill it with your unique values:
AIRTABLE_API_KEY=""
AIRTABLE_BASE_ID=""
AIRTABLE_TABLE_NAME="Destinations"
You can find your API key and Base ID by clicking "Help" and then "API Documentation". Table name in the example is "Destinations" (case sensitive name).
You're now ready to go. If you want to customize the Airtable base, please refer to gatsby-source-airtable
plugin documentation.
The data from Airtable does not update automatically, even when you're running the develop
process.
If you modified any data in your Airtable base, please be sure to restart the development process, so the new data can be downloaded.
This project comes with a few handy commands for linting and code fixing. The most important ones are the ones to develop and ship code. You can find the most important commands below.
gatsby develop
Run in the project locally.
gatsby build
Run a production build into ./public
. The result is ready to be put on any static hosting you prefer.