Validation and controller setup in Nest JS

#javascript #node #nestjs #typescript

Love to work with you, You can hire me on Upwork.

We have gone from defining first phase requirement to config load and TypeORM setup with migrations. Now we will look into setting up validation serialization and controller with Swagger Decorator’s.

We are starting with auth module, and we are going to create email controller instead of auth controller as we in future will add more services and controller for authentication provider like google, Facebook and LinkedIn. We already discussed APIs in getting started article, We are implementing those in here for controller and validation setup.

So I will just add controller with some comments and later will be explaining in details.

// src/modules/auth/email.controller.ts

import { Body, Controller, HttpCode, HttpStatus, Post } from '@nestjs/common';
import {
  ApiAcceptedResponse,
  ApiCreatedResponse,
  ApiForbiddenResponse,
  ApiNoContentResponse,
  ApiNotFoundResponse,
  ApiOperation,
  ApiTags,
} from '@nestjs/swagger';
import {
  EmailVerifyDto,
  LoginDto,
  RegisterDto,
  SendVerifyMailDto,
} from './email.dto';
import { EmailService } from './email.service';

// This is for swagger to aggregate all the APIs under this tag
@ApiTags('Auth Email')
// auth/email is path and it will get suffixed with /v1 as /v1/auth/email
@Controller({
  path: 'auth/email',
  version: '1',
})
export class EmailController {

  // It will be used later right now we are just 
  // going to return whatever we are getting from body
  constructor(private emailService: EmailService) {}

  @Post('/register')
  @ApiOperation({ summary: 'Register by email' })
  @ApiCreatedResponse({
    description: 'User successfully registered.',
  })
  // this actually overrides the default status code 
  @HttpCode(HttpStatus.CREATED)
  async register(@Body() registerDto: RegisterDto) {
    return registerDto;
  }

  @Post('/verify')
  @ApiOperation({ summary: 'Verify Email address.' })
  @ApiAcceptedResponse({
    description: 'Email verified successfully.',
  })
  @HttpCode(HttpStatus.ACCEPTED)
  async verify(@Body() emailVerifyDto: EmailVerifyDto) {
    return emailVerifyDto;
  }

  @Post('/login')
  @ApiOperation({ summary: 'Log in with Email.' })
  @HttpCode(HttpStatus.OK)
  async login(@Body() loginDto: LoginDto) {
    return loginDto;
  }

  @Post('/send-verify-email')
  @ApiOperation({ summary: 'Send Verification mail.' })
  @ApiNoContentResponse({
    description: 'Sent Verification mail.',
  })
  @ApiForbiddenResponse({
    description: 'User already verified.',
  })
  @ApiNotFoundResponse({
    description: 'User not found.',
  })
  @HttpCode(HttpStatus.NO_CONTENT)
  async sendVerifyMail(@Body() sendVerifyMailDto: SendVerifyMailDto) {
    return sendVerifyMailDto;
  }

  @Post('/reset-password-request')
  @ApiOperation({ summary: 'Send Reset Password mail.' })
  @ApiNoContentResponse({
    description: 'Sent Reset Password mail.',
  })
  @ApiForbiddenResponse({
    description: 'Please verify email first.',
  })
  @ApiNotFoundResponse({
    description: 'User not found.',
  })
  @HttpCode(HttpStatus.NO_CONTENT)
  async sendForgotMail(@Body() sendForgotMailDto: SendVerifyMailDto) {
    return sendForgotMailDto;
  }
}

// src/modules/auth/email.service.ts

import { Injectable } from '@nestjs/common';

@Injectable()
export class EmailService {
  constructor() {}
}

Have added some comments in the above code for understanding details of the code that are included. All the decorator starts with @Api are swagger decorators that generate code for us. So to define methods of the API we use @Get @post @Patch @head @Delete and @Put Decorators, they are very conveniently available from NestJS common library. You have to provide path, it automatically merges the base path from Controller decorator as suffix and starts working. You can also observer I have included emailService that we will discuss in the next article, But DTO’s will be in this article. DTO’s are for validation they are classes that have class-validator decorators and swagger decorators that help us the Body to validate and in same time it works as our swagger documentation.

You will see many decorators to even fetch some common data from request object or even Request itself. NestJS provide very convenient decorators for all those things. Like in above, I have used @Body decorator that actually gives me back body object from request. I can also fetch single field from body as @Body('email') previous code only fetches email from body, nothing else. We can also validate a particular body by providing a class with Validation Pipe. A Validation Pipe we are going to implement, but that will be global, not for every endpoint. So Validation Pipe Will take care of everything.

We need an endpoint for swagger too, So first we need all the DTO we have imported from email.dto.ts files and global validation pipe with swagger setup for our application.

// src/modules/auth/email.dto.ts

import { ApiProperty } from '@nestjs/swagger';
import { Transform } from 'class-transformer';
import {
  IsEmail,
  IsNotEmpty,
  IsString,
  IsStrongPassword,
} from 'class-validator';

const strongPasswordConfig = {
  minLength: 8,
  minLowercase: 1,
  minNumbers: 1,
  minSymbols: 1,
  minUppercase: 1,
};

export class RegisterDto {
  @ApiProperty({ example: 'example@danimai.com' })
  @IsEmail()
  @Transform(({ value }) =>
    typeof value === 'string' ? value.toLowerCase() : value,
  )
  email: string;

  @ApiProperty({ example: 'Password@123' })
  @IsString()
  @IsStrongPassword(strongPasswordConfig)
  password: string;

  @ApiProperty({ example: 'Danimai' })
  @IsString()
  @IsNotEmpty()
  first_name: string;

  @ApiProperty({ example: 'Mandal' })
  @IsString()
  @IsNotEmpty()
  last_name: string;
}

export class EmailVerifyDto {
  @ApiProperty({ example: 'vhsbdjsdfsd-dfmsdfjsd-sdfnsdk' })
  @IsString()
  verify_token: string;
}

export class LoginDto {
  @ApiProperty({ example: 'example@danimai.com' })
  @IsEmail()
  @Transform(({ value }) =>
    typeof value === 'string' ? value.toLowerCase() : value,
  )
  email: string;

  @ApiProperty({ example: 'Password@123' })
  @IsString()
  @IsStrongPassword(strongPasswordConfig)
  password: string;
}

export class SendVerifyMailDto {
  @ApiProperty({ example: 'example@danimai.com' })
  @IsEmail()
  @Transform(({ value }) =>
    typeof value === 'string' ? value.toLowerCase() : value,
  )
  email: string;
}

export class ResetPasswordDto {
  @ApiProperty({ example: 'Password@123' })
  @IsString()
  @IsStrongPassword(strongPasswordConfig)
  password: string;

  @ApiProperty({ example: 'vhsbdjsdfsd-dfmsdfjsd-sdfnsdk' })
  @IsString()
  reset_token: string;
}

// src/utils/validation-options.ts

import {
  HttpException,
  HttpStatus,
  ValidationError,
  ValidationPipeOptions,
} from '@nestjs/common';

const validationOptions: ValidationPipeOptions = {
  transform: true,
  whitelist: true,
  errorHttpStatusCode: HttpStatus.UNPROCESSABLE_ENTITY,
  exceptionFactory: (errors: ValidationError[]) =>
    new HttpException(
      {
        status: HttpStatus.UNPROCESSABLE_ENTITY,
        errors: errors.reduce(
          (accumulator, currentValue) => ({
            ...accumulator,
            [currentValue.property]: Object.values(
              currentValue.constraints,
            ).join(', '),
          }),
          {},
        ),
      },
      HttpStatus.UNPROCESSABLE_ENTITY,
    ),
};

export default validationOptions;

// src/utils/bootstrap.ts

import {
  INestApplication,
  ValidationPipe,
  VersioningType,
} from '@nestjs/common';
import { ConfigService } from '@nestjs/config';
import { DocumentBuilder, SwaggerModule } from '@nestjs/swagger';
import { SerializerInterceptor } from './serializer.interceptor';
import validationOptions from './validation-options';

// for swagger documentation builder it takes application and gives back us with setup
export const documentationBuilder = (
  app: INestApplication,
  configService: ConfigService,
) => {
  const config = new DocumentBuilder()
    .addBearerAuth()
    .setTitle(configService.get('app.name'))
    .setDescription('The Danimai API description')
    .setVersion('1')
    .build();

  const document = SwaggerModule.createDocument(app, config);
  SwaggerModule.setup('docs', app, document);
};

// some global implementation in one function like URI versioning, global pipe and interceptor
export const createApplication = (app: INestApplication) => {
  app.enableShutdownHooks();
  app.enableVersioning({
    type: VersioningType.URI,
  });
  app.useGlobalInterceptors(new SerializerInterceptor());
  app.useGlobalPipes(new ValidationPipe(validationOptions));

  return app;
};

// src/utils/serializer.interceptor.ts

import {
  Injectable,
  NestInterceptor,
  ExecutionContext,
  CallHandler,
} from '@nestjs/common';
import { Observable } from 'rxjs';

@Injectable()
export class SerializerInterceptor implements NestInterceptor {
  intercept(context: ExecutionContext, next: CallHandler): Observable<unknown> {
    return next.handle().pipe();
  }
}

Above are some new things we have introduced, like validation pipe that helps us in documentation. But be with me, we will understand them one by one as we move forward, just include them as for now. As we right now have a bootstrap file, we can utilize that in our main.ts file.

// src/main.ts

import { NestFactory } from '@nestjs/core';
import { AppModule } from './modules/app/app.module';
import { ConfigService } from '@nestjs/config';
import { createApplication, documentationBuilder } from './utils/bootstrap';

async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  const configService = app.get(ConfigService);

  // bootstrapped functions
  createApplication(app);
  documentationBuilder(app, configService);

  await app.listen(configService.get('app.port') || 8000);
}
bootstrap();

Even now we will not get any output as we don’t have included anything in auth.module.ts and that is not included in app.module.ts parent module file.

// src/modules/auth/auth.module.ts

import { Module } from '@nestjs/common';
import { EmailController } from './email.controller';
import { EmailService } from './email.service';

@Module({
  controllers: [EmailController],
  providers: [EmailService],
})
export class AuthModule {}

And we include this module in main app module.

import { Module } from '@nestjs/common';
import { ConfigModule } from '@nestjs/config';
import { configLoads } from '../config';
import { TypeOrmModule } from '@nestjs/typeorm';
import { TypeORMConfigFactory } from '../database/typeorm.factory';
import { AuthModule } from '../auth/auth.module';

// here we have included that
const modules = [AuthModule];

export const global_modules = [
  ConfigModule.forRoot({
    load: configLoads,
    isGlobal: true,
    envFilePath: ['.env'],
  }),
  TypeOrmModule.forRootAsync({
    useClass: TypeORMConfigFactory,
  }),
];

@Module({
  imports: [...global_modules, ...modules],
})
export class AppModule {}

It is just first setup to cover everything else, in upcoming series. If now you will run the application using

npm run start:dev

It will show you this, where every router getting mapped with AuthModule Instance.

[10:23:03 PM] File change detected. Starting incremental compilation...

[10:23:03 PM] Found 0 errors. Watching for file changes.

[Nest] 29745  - 04/05/2024, 10:23:04 PM     LOG [NestFactory] Starting Nest application...
[Nest] 29745  - 04/05/2024, 10:23:04 PM     LOG [InstanceLoader] AppModule dependencies initialized +12ms
[Nest] 29745  - 04/05/2024, 10:23:04 PM     LOG [InstanceLoader] TypeOrmModule dependencies initialized +0ms
[Nest] 29745  - 04/05/2024, 10:23:04 PM     LOG [InstanceLoader] ConfigHostModule dependencies initialized +0ms
[Nest] 29745  - 04/05/2024, 10:23:04 PM     LOG [InstanceLoader] AuthModule dependencies initialized +5ms
[Nest] 29745  - 04/05/2024, 10:23:04 PM     LOG [InstanceLoader] ConfigModule dependencies initialized +0ms
[Nest] 29745  - 04/05/2024, 10:23:04 PM     LOG [InstanceLoader] TypeOrmCoreModule dependencies initialized +74ms
[Nest] 29745  - 04/05/2024, 10:23:04 PM     LOG [RoutesResolver] EmailController {/auth/email} (version: 1): +24ms
[Nest] 29745  - 04/05/2024, 10:23:04 PM     LOG [RouterExplorer] Mapped {/auth/email/register, POST} (version: 1) route +2ms
[Nest] 29745  - 04/05/2024, 10:23:04 PM     LOG [RouterExplorer] Mapped {/auth/email/verify, POST} (version: 1) route +0ms
[Nest] 29745  - 04/05/2024, 10:23:04 PM     LOG [RouterExplorer] Mapped {/auth/email/login, POST} (version: 1) route +1ms
[Nest] 29745  - 04/05/2024, 10:23:04 PM     LOG [RouterExplorer] Mapped {/auth/email/send-verify-email, POST} (version: 1) route +0ms
[Nest] 29745  - 04/05/2024, 10:23:04 PM     LOG [RouterExplorer] Mapped {/auth/email/reset-password-request, POST} (version: 1) route +0ms
[Nest] 29745  - 04/05/2024, 10:23:04 PM     LOG [NestApplication] Nest application successfully started +2ms

And to view Swagger you have to go to http://localhost:8000/docs/ in browser, it will show the UI for swagger

But above is nothing as it does not work as expected, it only takes body validates and returns error if invalid or returns same data if valid. So we need to implement services for this controller.

Let us meet in the next, and complete this API endpoints one by one and deep dive into more concept of Nest JS. Thank you