# Add github based comments on your gridsome blog

## Overview

This is a guide on how you can add GitHub based comments on your Gridsome powered blog like shown in the picture below.

![Gitalk Demo](//images.ctfassets.net/7xvuet8e2li4/4zAyUeUg8yjPh3wqN8aqjP/99fc74f8e27bd2911660b00e12dc3bab/Unnamed.jpg)

We will use a component named `Gitalk` in this article. All the comments are stored in a github issue. So, you don't need a seperate database for storing the comments.

## Let's Start

### Create a GitHub OAuth application

- Go to your [Github App Settings](https://github.com/settings/apps).
- Go to OAuth Apps.
- Create new OAuth application.
- Fill in all the required details. In the `Authorization callback URL` fill in the `URL` where your site will be deployed.
- Copy the <u>Client ID</u> and <u>Client Secret</u> from your OAuth App.

<br>

### Configure your Gridsome app

First of all, install the gitalk gridsome plugin.

```bash
yarn add gridsome-plugin-gitalk
```
<br>

Now, in your `gridsome.config.js` add the following block to your plugins.

```javascript
module.exports = {
  ...,
  plugins: [
    ...,
    {
      use: "gridsome-plugin-gitalk",
      options: {
        clientID: "kuy78h87gg87g8g89", // The client id you copied earlier.
        clientSecret: "r248hf924hfhh8fh8a2", // The client secret you copied earlier.
        repo: "nishantwrp-website", // The name of the github repo where the comments should be stored.
        owner: "nishantwrp", // The username of the owner of the github repository.
        admin: ["nishantwrp"], // The usernames of the admins of the repository.
      }
    }
}
```

<br>

Now, you're all set. You can just use the gitalk component in your `Vue` files like below.

```html
<Gitalk />
```

## That's all

If you did everything correctly, the comments and github authentication should work correctly when you deploy it. For further advanced configurations please refer to the [plugin docs](https://github.com/nishantwrp/gridsome-plugin-gitalk). Thanks!

<hr>

Hi, I'm Nishant Mittal. Thanks for reading this post. Feel free to comment or reach out on [Twitter](https://twitter.com/nishantwrp) in case of any queries. You can also find me on [Github](https://github.com/nishantwrp), [Linkedin](https://www.linkedin.com/in/nishantwrp/).