Skip to content
A gatsby starter using Google Sheets
CSS JavaScript
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
src
.gitignore
.prettierrc
LICENSE
README.md
gatsby-browser.js Initial commit from gatsby: (https://github.com/gatsbyjs/gatsby-start… May 21, 2019
gatsby-config.js
gatsby-node.js
gatsby-ssr.js
package.json
yarn.lock

README.md

Gatsby

Gatsby Starter Google Sheets

Kick off your project with this boilerplate. This starter ships with the main Gatsby configuration files along with the gatsby-source-google-spreadsheet you might need to get up and running blazing fast with the blazing fast app generator for React.

🚀 Quick start

  1. Create a Gatsby site.

    Use the Gatsby CLI to create a new site, specifying the default starter.

    # create a new Gatsby site using the starter
    gatsby new gatsby-site https://github.com/harshil1712/gatsby-starter-googlesheets
  2. Start developing.

    Navigate into your new site’s directory and start it up.

    cd gatsby-site/
  3. Open the source code and start editing!

    Before running the development server you will need to add credentials to the .env file.

    SPREADSHEET_ID=<YOUR_SPREADHEET_ID>
    CLIENT_EMAIL=<SERVICE_ACCOUNT_EMAIL>
    PRIVATE_KEY=<YOUR_PRIVATE_KEY>

    You can get the SPREADSHEET_ID from the URL of your sheet, https://docs.google.com/spreadsheets/d/<SPREADSHEET_ID>/edit#gid=12345. You will have to create a service account which will provide you with the service account email id and a private key. To know more about creating service account you can visit here. After creating a service account share your sheet with edit permission with the given email id.

    gatsby develop

    Your site is now running at http://localhost:8000!

    Note: You'll also see a second link: http://localhost:8000/___graphql. This is a tool you can use to experiment with querying your data. Learn more about using this tool in the Gatsby tutorial.

    Open the gatsby-site directory in your code editor of choice and edit src/pages/index.js. Save your changes and the browser will update in real time!

You can’t perform that action at this time.