DEV Community

Cover image for How to add pagination in FoalTS
Loïc Poullain
Loïc Poullain

Posted on • Edited on

4 2

How to add pagination in FoalTS

FoalTS is web framework for creating Node.Js applications. It is written in TypeScript, offers built-in dev tools and has a large set of integrated components required in common situations (password encryption, authentication, validation, etc).

When building a REST API, it is very common to add pagination on GET requests. This articles shows you how to do that.

First create a new project.

npm install -g @foal/cli
foal createapp todo-app
cd todo-app
npm run develop
Enter fullscreen mode Exit fullscreen mode

Then generate a new model called Todo:

foal generate entity todo
Enter fullscreen mode Exit fullscreen mode

Open the generated file src/app/entities/todo.entity.ts and complete its content:

import { Column, Entity, PrimaryGeneratedColumn } from 'typeorm';

@Entity()
export class Todo {

  @PrimaryGeneratedColumn()
  id: number;

  @Column()
  text: string;

}
Enter fullscreen mode Exit fullscreen mode

Great!

The next step is to create a controller that will handle GET requests at /todos:

foal generate controller todos --register
Enter fullscreen mode Exit fullscreen mode

Open src/app/controllers/todos.controller.ts and add a new route to list the todos:

import { Get, HttpResponseOK, ValidateQuery, Context } from '@foal/core';
import { getRepository } from 'typeorm';

import { Todo } from '../entities';

export class TodosController {

  @Get()
  @ValidateQuery({
    properties: {
      skip: { type: 'number' },
      take: { type: 'number' },
    },
    type: 'object',
  })
  async readTodos(ctx: Context) {
    const todos = await getRepository(Todo).find({
      skip: ctx.request.query.skip,
      take: ctx.request.query.take
    });
    return new HttpResponseOK(todos);
  }

}
Enter fullscreen mode Exit fullscreen mode

Now, if you send a GET request to http://localhost:3000/todos, the server will respond with an empty array since the database is empty.

You can add todos to your database with a shell script.

foal generate script create-todo
Enter fullscreen mode Exit fullscreen mode

Open the generated file src/scripts/create-todo.ts and complete its content:

import { createConnection } from 'typeorm';
import { Todo } from '../app/entities';

export const schema = {
  properties: {
    text: { type: 'string' }
  },
  required: [ 'text' ],
  type: 'object',
};

export async function main(args) {
  // Create a new connection to the database.
  const connection = await createConnection();

  // Create a new task with the text given in the command line.
  const todo = new Todo();
  todo.text = args.text;

  // Save the task in the database and then display it in the console.
  console.log(
    await connection.manager.save(todo)
  );

  // Close the connection to the database.
  await connection.close();
}
Enter fullscreen mode Exit fullscreen mode

Fill the database with some todos:

npm run build:scripts
foal run create-todo text="Learn TypeScript"
foal run create-todo text="Use FoalTS with MongoDB"
foal run create-todo text="Discover the CLI"
foal run create-todo text="Create a REST API with Foal"
foal run create-todo text="Download VSCode"
foal run create-todo text="Read the docs of TypeORM"
Enter fullscreen mode Exit fullscreen mode

That's it! Now it's time to test the API!

curl http://localhost:3000/todos
curl http://localhost:3000/todos?skip=1
curl http://localhost:3000/todos?take=2
curl "http://localhost:3000/todos?skip=1&take=3"
curl http://localhost:3000/todos?skip=notanumber
Enter fullscreen mode Exit fullscreen mode

Enjoy!

Image of Timescale

🚀 pgai Vectorizer: SQLAlchemy and LiteLLM Make Vector Search Simple

We built pgai Vectorizer to simplify embedding management for AI applications—without needing a separate database or complex infrastructure. Since launch, developers have created over 3,000 vectorizers on Timescale Cloud, with many more self-hosted.

Read more

Top comments (0)

Image of Docusign

🛠️ Bring your solution into Docusign. Reach over 1.6M customers.

Docusign is now extensible. Overcome challenges with disconnected products and inaccessible data by bringing your solutions into Docusign and publishing to 1.6M customers in the App Center.

Learn more