gitalk logo

I decided to change the comment system on the site to something based on Github as it seems more fitting to the continuous deployment with JAMstack.

Gitalk seems to be the best free option available at the moment.

I looked around at gatsby sites with gitalk on github & found they all seem to use old components with no hook support.
So I ended up creating a new component that allows the use of hooks for the GraphQL queries.

Gitalk Features #

Creating a Component With Hooks #

I used useEffect to load Gitalk after the comments component is loaded.
(old non hook components I found use componentDidMount)

useEffect(() => {
  const GitTalkInstance = new Gitalk({
    clientID:  "...",
  // ...
  // options below
  })
  GitTalkInstance.render('gitalk-container')
})

This allows use of react hooks.
I use useSiteMetadata hooks for the GraphQL queries.

Source Code #

The source for the site is available on github.

equk-gatsby