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.
- 👩 User enters a comment and clicks submit.
- ⚙️ A serverless function receives the data and hits GitHub's API.
- 🔧 It reads the existing
comments.json, appends the new comment, and saves. - 🚧 A new commit triggers a Netlify build.
- ✅ 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.
-
Accept user comments and store them on GitHub. No database required.
-
Avoid using third-party plugin solutions that leak your user's data.
Set the following environmental variables on Netlify:
GITHUB_PAT_TOKENto your GitHub personal access token.GITHUB_REPOto the repository where this code is located.GITHUB_USERyour 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.