Todos Table

We need a table to store the todos that our application will manage, and also correct permissions on querying and inserting them. Hasura Console to the rescue.

Hasura Console is where you manage your project's database and GraphQL API.

Hasura Console

On your project's dashboard, click on the Hasura option on the left-side menu. You will find details of the Hasura installation, as well as an option to add Environment Variables. Go ahead and copy Hasura's Admin secret and use it to login to the Hasura console URL.

Nhost Hasura

If you are not familiar with the Hasura Console, now it is a good time to click around and explore.

Create todos table

Please make sure the DATA tab on the top menu is selected, and click on Create Table

We'll create a todos table with the following columns:

NameTypeDefault value
idUUIDgen_random_uuid()
created_atTimestampnow()
nameText
completedBooleanfalse

For the id and created_at columns you can either create them manually with the correct functions as default value or use the Frequently used columns option that is at the bottom of the Columns section. Values for those columns will be generated on insert.

Frequently used columns in the Hasura console

name and completed should be manually created as per the table above. Make sure you set the default value for completed to false.

Create a table in the Hasura console

Scroll down and click Add table.

Query Data

To make sure we have a working GraphQL API, we will now insert a couple of todos. Navigate to the Insert Row tab and create a couple of todos by specifying a name and clicking on save (see the animation bellow).

Insert todos

With todos in place, go back to the Nhost console and click on the GraphQL API option on the left-side menu. Copy-and-paste the following query and hit play.

query {
  todos {
    id
    created_at
    name
    completed
  }
}

The todos you just created should be part of the response shown on the right.

Permissions

Right now, the only way to query todos is by using the admin role with an admin-secret (x-hasura-admin-secret). We are going to change that behaviour so that anyone (public) is able to insert and select todos.

In the Hasura Console, go to your todos table and click on Permissions. We will set insert and select permissions for the public role.

The public role is used by users that are not logged in.

Insert

Row insert permissions should be set to Without any checks and Column insert permissions should only have name checked.

Hasura permissions public insert

Select

Row select permissions should be set to Without any checks and Column select permissions should have all columns checked.

Hasura permissions public insert

Anyone can now insert and select todos. This is not secure, but it's a good start. We will secure our backend later when we add authentication.

Next

Client App