Building the Backend with Keel

For the final application, we want to be able to create a new user, assign a role to that user and see it reflected in the database. To do this, we need to define our schema in a schema.keel file like so:

enum UserRole {
    Customer
    Vendor
}
 
model User {
    fields {
        identity Identity
        name Text
        role UserRole @default(UserRole.Customer)
    }
 
    actions {
        create createUser() with (name, role) {
            @set(user.identity = ctx.identity)
            @permission(expression: ctx.isAuthenticated)
        }
    }
}

In our schema, we have created an enum (opens in a new tab) for the user roles. Enums in Keel are a named set of values, which are useful when you want very specific options in a particular field.

Our model (opens in a new tab) User has the following fields:

• Identity (opens in a new tab): holds the logged-in user identity
• name: holds the name of the user
• role: holds the UserRole enum and we have specified the default option for the field to be Customer

For actions (opens in a new tab), we have a single create action called createUser which allows you to create a new user with a name and a role. We have also set the identity of the user to be the logged-in user identity. For Permission (opens in a new tab), we have specified that the createUser action can be carried out by any authenticated user.

Now that we have defined our schema, all we need to do is head over to the Keel console (opens in a new tab), create a new project by selecting a blank project in the Keel console and deploy our backend on Keel by making a push to the generated GitHub repository.

With your backend deployed on Keel, head over to the API explorer tab and grab your API endpoint. For the purpose of this tutorial, we’ll be using the JSON API.

Generating the Keel Client

As well as using the APIs directly in three forms, we can generate a TypeScript client for our frontend project so that we can easily work with your APIs with full end-to-end type safety. We can do that by running the following command in the folder where our Keel schema is present:

keel client

The above command will automatically create a new file called keelClient.ts in the root folder, we’ll need this file when working on the front end.