Kament

Kament is a basic comments widget for static sites. It uses FaunaDB and runs on Deploy.

Features offered by Kament:

Serverless. Runs only when someone makes a request.
Data stays on your own accounts.
Login with GitHub - reduces spam to a good extent.
Supports markdown formatting.

To use Kament on your site, you need to first deploy the Kament API and then embed the Kament Client script on your site. The embeded script will communicate with the API to make comments happen. The following sections will detail the steps required to deploy and embed Kament on your site.

Deploy Kament API
Embed Kament on a Website

Deploy Kament API

We use Fauna to store the comments and user data. And GitHub for login facility. So in addition to deploying the API on Deploy, we need to acquire some credentials from both the platforms.

Our aim in the coming sections is to gather values for the following secrets that we will create on Deploy.

GITHUB_CLIENT_ID
GITHUB_CLIENT_SECRET
FAUNA_SECRET
JWT_SIGNING_SECRET

Fauna

Create an account on Fauna.com and a database (name it anything but kament would be a good choice).
Import the schema available at db/schema.gql by downloading it and uploading it on Fauna Dashboard of the just created database.
After import, go to Security section and create a new key with "Server" role.
Grab the value and create a file named secrets.txt and paste the value corresponding to the key name (FAUNA_SECRET). Use this method to store values until we reach to the Deploy step.

GitHub

Go to https://github.com/settings/applications/new and fill the form to create a new oAuth application. Choose the callback url same as the website url you're going to embed Kament on.
After successful creation, you'll be routed to the application page and presented with Client Id and a button to generate a new client secret.
Grab the client Id and create a secret named GITHUB_CLIENT_ID with the ID. Click on "generate client secret" and grab the presented value to create a secret named GITHUB_CLIENT_SECRET.

The Client ID is used in the Kament's client side script to initiate auth flow when a new user tries to comment.

And now you have only one secret left to fill out: JWT_SIGNING_SECRET. Create a random string that includes wide variety of characters.

Deploy

TODO

Embed Kament on a Website

Add these two elements to the <head></head> of your page.

<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/gh/satyarohith/kament@cb745b279c9fc64359c00c198b45eb129f2933d9/client/dist/kament.css"
/>
<script
  defer
  src="https://cdn.jsdelivr.net/gh/satyarohith/kament@cb745b279c9fc64359c00c198b45eb129f2933d9/client/dist/kament.js"
  type="module"
/>

And then create a div with id named kament providing the data attributes required by kament.

<div
  data-post-id="{slug}"
  data-kament-endpoint="{endpoint}"
  data-github-client-id="{github_client_id}"
  id="kament"
></div>

The value of the data-post-id should be unique for every page and the value data-kament-endpoint should be the base URL of the Kament API. The value of data-github-client-id should be the same as the one provided in the GITHUB_CLIENT_ID secret (don't worry - it is completely safe to expose the GitHub client id).