TypeScript-first philosophy in NestJS - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to define a NestJS controller using TypeScript decorators.

NestJS

import { Controller, Get } from '@nestjs/common';

@Controller('[1]')
export class AppController {
  @Get()
  getHello(): string {
    return 'Hello World!';
  }
}

Drag options to blanks, or click blank then click option'

Aapp

BAppController

Chello

Droot

Attempts:

3 left

💡 Hint

Common Mistakes

Using the class name instead of a route string.

Leaving the decorator empty which defaults to root.

The @Controller decorator takes a string that defines the route path. Here, 'app' sets the base route for this controller.

2fill in blank

medium

Complete the code to inject a service into a NestJS controller constructor.

NestJS

import { Controller } from '@nestjs/common';
import { AppService } from './app.service';

@Controller('app')
export class AppController {
  constructor(private readonly [1]: AppService) {}
}

Drag options to blanks, or click blank then click option'

AappService

BAppService

Cappservice

Dservice

Attempts:

3 left

💡 Hint

Common Mistakes

Using the class name with uppercase first letter as variable name.

Using a generic name like 'service' which is unclear.

By convention, the injected service is named in camelCase matching the class name, here appService.

3fill in blank

hard

Fix the error in the following NestJS service method signature by completing the return type.

NestJS

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

@Injectable()
export class AppService {
  getData(): [1] {
    return { message: 'Data fetched' };
  }
}

Drag options to blanks, or click blank then click option'

Aany

Bobject

Cstring

DRecord<string, string>

Attempts:

3 left

💡 Hint

Common Mistakes

Using string which is incorrect for an object return.

Using any which loses type safety.

The method returns an object with string keys and string values, so Record<string, string> is the precise TypeScript type.

4fill in blank

hard

Fill both blanks to create a NestJS DTO class with two properties having types and decorators.

NestJS

import { IsString, IsInt } from 'class-validator';

export class CreateUserDto {
  @[1]()
  name: string;

  @[2]()
  age: number;
}

Drag options to blanks, or click blank then click option'

AIsString

BIsNumber

CIsInt

DIsBoolean

Attempts:

3 left

💡 Hint

Common Mistakes

Using IsNumber for age which allows floats.

Using IsBoolean which is wrong type.

IsString validates that name is a string, and IsInt validates that age is an integer number.

5fill in blank

hard

Fill all three blanks to complete a NestJS module importing a service and controller.

NestJS

import { Module } from '@nestjs/common';
import { [1] } from './app.service';
import { [2] } from './app.controller';

@Module({
  imports: [],
  controllers: [[3]],
  providers: [AppService],
})
export class AppModule {}

Drag options to blanks, or click blank then click option'

AAppService

BAppController

DAppModule

Attempts:

3 left

💡 Hint

Common Mistakes

Using the module class name in imports or controllers.

Forgetting to add the controller to the controllers array.

The module imports AppService and AppController. The controller is listed in the controllers array.

Practice

1. What is the main benefit of the TypeScript-first philosophy in NestJS?

easy

A. It makes the app run faster at runtime.

B. It removes the need for any testing.

C. It helps catch errors early by using types.

D. It allows writing code without any types.

Solution

1. Step 1: Understand TypeScript's role

   TypeScript adds types to JavaScript, which helps find mistakes before running the code.

2. Step 2: Connect to NestJS philosophy

   NestJS uses TypeScript-first to improve code safety and clarity by leveraging types.

3. Final Answer:

   It helps catch errors early by using types. -> Option C

4. Quick Check:

   TypeScript-first = catch errors early [OK]

Hint: TypeScript-first means using types to find errors early [OK]

Common Mistakes:

• Thinking it makes runtime faster
• Believing it removes need for tests
• Assuming it means no types needed

2. Which of the following is the correct way to define a typed controller method in NestJS using TypeScript-first philosophy?

easy

A. async getUser(): Promise<User> { return this.userService.find(); }

B. async getUser() { return this.userService.find(); }

C. async getUser(): any { return this.userService.find(); }

D. async getUser(): string { return this.userService.find(); }

Solution

1. Step 1: Check method return type

   TypeScript-first means explicitly typing the return value, here Promise<User>.

2. Step 2: Compare options

   async getUser(): Promise<User> { return this.userService.find(); } uses correct typing; others omit or use wrong types like any or string.

3. Final Answer:

   async getUser(): Promise<User> { return this.userService.find(); } -> Option A

4. Quick Check:

   Explicit return type = async getUser(): Promise<User> { return this.userService.find(); } [OK]

Hint: Always specify method return types explicitly [OK]

Common Mistakes:

• Omitting return type annotation
• Using 'any' instead of specific types
• Using wrong return types like string

3. Given this NestJS service method using TypeScript-first philosophy:

async findUser(id: number): Promise {
  const user = await this.userRepository.findOneBy({ id });
  return user ?? null;
}

What is the type of the value returned when no user is found?

medium

A. undefined

B. an empty object {}

C. throws an error

D. null

Solution

1. Step 1: Analyze return statement

   The method returns user ?? null, which means if user is nullish, return null.

2. Step 2: Understand nullish coalescing

   If findOneBy returns undefined, the expression returns null explicitly.

3. Final Answer:

   null -> Option D

4. Quick Check:

   Nullish coalescing returns null if no user [OK]

Hint: ?? operator returns right side if left is null or undefined [OK]

Common Mistakes:

• Assuming undefined is returned
• Thinking an error is thrown
• Expecting empty object instead of null

4. Identify the error in this NestJS controller method using TypeScript-first philosophy:

@Get(':id')
async getUser(@Param('id') id: string): Promise<User> {
  return this.userService.findUser(id);
}

medium

A. The method should not be async if it returns a Promise.

B. The return type should be Promise if user might not exist.

C. The parameter id should be typed as number not string.

D. The decorator @Get is missing a path.

Solution

1. Step 1: Check return type correctness

   If findUser can return null when user not found, the controller must reflect that in its return type.

2. Step 2: Compare options

   The return type should be Promise if user might not exist. correctly points out the return type should allow null. The parameter id should be typed as number not string. is not always true because id can be string if parsed later.

3. Final Answer:

   The return type should be Promise if user might not exist. -> Option B

4. Quick Check:

   Return type must match possible null values [OK]

Hint: Return types must include null if possible [OK]

Common Mistakes:

• Ignoring possible null return
• Thinking async keyword is wrong here
• Assuming @Get needs path always

5. You want to create a NestJS DTO (Data Transfer Object) that enforces a required name string and an optional age number using TypeScript-first philosophy. Which of these is the best TypeScript definition?

hard

A. export class CreateUserDto { name: string; age?: number; }

B. export interface CreateUserDto { name?: string; age: number; }

C. export type CreateUserDto = { name?: string; age?: number; };

D. export class CreateUserDto { name?: string; age: number; }

Solution

1. Step 1: Identify required and optional properties

   The name must be required (no question mark), age optional (with question mark).

2. Step 2: Match with options

   export class CreateUserDto { name: string; age?: number; } correctly defines name as required and age as optional in a class, which is standard for NestJS DTOs.

3. Final Answer:

   export class CreateUserDto { name: string; age?: number; } -> Option A

4. Quick Check:

   Required name, optional age = export class CreateUserDto { name: string; age?: number; } [OK]

Hint: Use '?' for optional properties, omit for required [OK]

Common Mistakes:

• Marking required fields as optional
• Using interface instead of class for DTO
• Making optional fields required