This is a Gatsby template for creating a catalogue websites based on Google Sheets data.
WebSheets Listing Page is an open-sourced Gatsby template that generates listing/directory websites based on Google Sheets data. The generated website will be a fast-loading static progressive web app with SEO and offline capabilities.
If you find this project helpful in any way, you can support my coffee intake in making this at https://www.buymeacoffee.com/sohafidz. ☕️
npm install -g gatsby-cli
Anyone on the Internet with this link can view
site
tab) and details of items you want to list *on the listing
tab)
site
, listing
) should NOT be changed.gatsby new [YOUR_SITE_NAME] tengkuhafidz/WebSheets-Listing-Page
.env
file on the project root and add the following environment variables
GATSBY_GOOGLE_CREDENTIALS
="Google-Api-Key-With-Quatations"GATSBY_SHEET_URL
="Google-Sheets-URL-With-Quotations"npm start
http://localhost:8000
http://localhost:8000/___graphql
npm run build
npm run serve
http://localhost:9000
Having an issue? The following are common setup mistakes that might have caused it. Please ensure that the following are set properly.
Anyone on the Internet with this link can view
ENABLED
for the project that you're using the API key of.env
file on your project root with the following params: GATSBY_GOOGLE_CREDENTIALS
, GATSBY_SHEET_URL
With prettier, eslint, and husky configured out of the box.
.
├── node_modules
├── src
├── static
├── .gitignore
├── .eslintrc.js
├── .prettierrc.js
├── gatsby-browser.js
├── gatsby-config.js
├── LICENSE
├── yarn-lock.json
├── package.json
├── tailwind.config.js
├── postcss.config.js
└── README.md
You may contact me via email at [email protected].
Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.