Uno de los problemas mas comunes a la hora de crear una API es justamente la documentación de la misma. Para eso, desde la documentación de Nest nos recomiendan utilizar una libreria llamada Swagger, que también se incluye Nest pero debemos instalarla utilizando npm install @nestjs/swagger. Una vez que lo instalamos, importamos dos elementos de Swagger dentro de nuestro main.ts

import { SwaggerModule, DocumentBuilder } from '@nestjs/swagger';

Una vez que lo instalamos, la documentación nos enseña como configurarlo. Acá tenes el link a la documentacion.

  const config = new DocumentBuilder()
    .setTitle('Cats example') //Titulo de la API
    .setDescription('The cats API description') //Descripcion
    .setVersion('1.0') //Versionado
    .addTag('cats') //Tags
    .build(); //Crea la documentación
  const document = SwaggerModule.createDocument(app, config);
  //Crea el documento
  SwaggerModule.setup('api', app, document);

Ahora, si nosotros levantamos el servidor y vamos a la ruta /api nos aparecera esto

Swagger ha creado toda una interfaz grafica en la que podemos ver todas las rutas de nuestra aplicación y ver los valores que acepta o los tipos de respuesta que puede obtener.

Swagger ha creado toda una interfaz grafica en la que podemos ver todas las rutas de nuestra aplicación y ver los valores que acepta o los tipos de respuesta que puede obtener.

Como ves, están todas separadas y mezcladas. Si quisiera darles un orden puedo agregarle tags a las rutas. Eso lo debo hacer dentro de los controladores con un decorador propio de Swagger.

  @ApiTags('tasks')
  @Get()
  getAllTasks(@Query() query: any) {
    console.log(query);
    return this.taskService.getTasks();
  }

Ahora, todos los endpoints con el tag tasks se verán dentro de esa carpeta.

Ahora, todos los endpoints con el tag tasks se verán dentro de esa carpeta.

Supongamos que queremos agregarle una descripcion a cada endpoint, algo que suele ocurrir cuando uno trabaja documentando APIS. Swagger lo hace muy sencillo

  @ApiTags('tasks')
  @ApiOperation({ summary: 'Obtiene todas las tareas' })
  @Get()
  getAllTasks(@Query() query: any) {
    console.log(query);
    return this.taskService.getTasks();
  }

Cuando nosotros guardamos, ahora se ve asi

Captura de Pantalla 2024-05-06 a la(s) 15.38.07.png

Como te habia dicho mas arriba, también se puede documentar las posibles respuestas que tendrá el endpoint. Eso también lo podes documentar utilizando otro decorador de Swagger

  @ApiTags('tasks')
  @ApiOperation({ summary: 'Obtiene todas las tareas' })
  @ApiResponse({ status: 200, description: 'Devuelve todas las tareas' })
  @Get()
  getAllTasks(@Query() query: any) {
    console.log(query);
    return this.taskService.getTasks();
  }

Y esto se verá asi

Dentro de Responses se ve la respuesta que nosotros le dijimos.

Dentro de Responses se ve la respuesta que nosotros le dijimos.

Algo muy bueno también de Swagger es que los DTO también se muestran.

Captura de Pantalla 2024-05-06 a la(s) 15.43.54.png