In the previous module, we covered the backend part of our course. We have a database that can store the comments, and we learned few bits about GraphQL and Hasura. We also mentioned that we're going to connect to Hasura via GraphQL to add and retrieve comments, and that's what we're going to focus on in this module.

We will integrate with Hasura from within a frontend application. In the following lessons, we will create a custom React hook that will have the logic responsible for sending POST requests with GraphQL queries and mutations.

However, we need a sample application that we can use to demonstrate the commenting system. We'll go with a simple blog as it perfectly fits the comments use-case.

We're going to use theNext.js blog starter as it's pretty simple and lets us get started quickly.

Next.js is a frontend framework created on top of React, enabling server-side rendering and creating static websites (e.g., blogs).

We introduced two new terms — let's quickly see what they mean:

Server-side rendering: A typical React application renders its content on the client-side — in the browser. Server-side rendering (SSR) means rendering web apps on a server and passing HTML to the browser.

A static website displays the same content for every user — its content is fixed (static).

This course doesn't require knowledge about Next.js, but if you want to learn more about Next itself, you can check outNext.js docs.

Setting up the sample app#

In theNext.js blog starter repository, we can see setup instructions. Let's use the first command: