Skip to content

healeycodes/gatsby-serverless-comments

Repository files navigation

gatsby-serverless-comments

My blog post: Adding Comments to Gatsby with Netlify Serverless Functions + GitHub


Use Netlify serverless functions to let users add comments to a static website.

  1. 👩 User enters a comment and clicks submit.
  2. ⚙️ A serverless function receives the data and hits GitHub's API.
  3. 🔧 It reads the existing comments.json , appends the new comment, and saves.
  4. 🚧 A new commit triggers a Netlify build.
  5. ✅ The new version of the website is deployed!

The new comment is visible ~30 seconds ⏰ after the first click.


See /src/pages/index.js for the user visible page.

See /functions/comment.js for the serverless function.

Why?

  • Accept user comments and store them on GitHub. No database required.

  • Avoid using third-party plugin solutions that leak your user's data.


Setup

Set the following environmental variables on Netlify:

  • GITHUB_PAT_TOKEN to your GitHub personal access token.
  • GITHUB_REPO to the repository where this code is located.
  • GITHUB_USER your GitHub username.

Set up the site on Netlify to continuously deploy on commits (this the default).

Visit the deploy preview, or production version, and submit a comment from the root path (/). There is a example form that submits a PUT request.

You should see a 204 response in the browser console. Else, check the Netlify functions logs for errors.

Releases

No releases published

Packages

No packages published