Welcome to this lesson on enhancing your Todo REST API with filters and specific modifiers using NestJS. So far, we've covered the basics of setting up GET, POST, PUT, and DELETE requests which allows you to Create, Retrieve, Update, and Delete (CRUD) Todo items.
In this lesson, we'll build on those foundations by adding filters and specific modifiers to our API. You'll learn how to implement a filter to show only incomplete tasks and a modifier to mark tasks as complete. These features will make your API more flexible and powerful.
Filters allow users to retrieve specific subsets of data, making the API more versatile. Imagine a case where the client only wants to see the incomplete Todo items. In this section, we'll add a filter to show only incomplete Todo items using query parameters.
Query parameters are used to pass optional information to a web API. They are appended to the URL and can be accessed in the request handler. In practice, they are added to the URL and may look familiar to you. Let's say you want to list all of the Todos that are incomplete, we can support a filter in the GET requiest such as GET /todos?showIncomplete=1 via the query parameter.
We'll add a showIncomplete filter to our findAll method in the TodoController and TodoService.
TypeScript1// src/todo/todo.controller.ts 2@Controller('todos') 3export class TodoController { 4 constructor(private readonly todoService: TodoService) {} 5 6 @Get() 7 findAll( 8 // Introduce the query parameter called showIncomplete 9 @Query('showIncomplete') showIncomplete: boolean, 10 ): TodoDto[] { 11 // Pass the parameter along to the service 12 return this.todoService.findAll(showIncomplete); 13 } 14 15 // ... Existing GET, POST, PUT, and DELETE handlers 16}
TypeScript1// src/todo/todo.service.ts 2@Injectable() 3export class TodoService { 4 private todos: TodoDto[] = []; 5 6 findAll(showIncomplete?: boolean): TodoDto[] { 7 if (showIncomplete) { 8 return this.todos.filter(todo => !todo.completed); 9 } 10 11 return this.todos; 12 } 13 14 // ... Existing findOne, create, update, and delete methods 15}
Specific modifiers allow users to make targeted updates to individual items. In this section, we'll add a modifier to mark tasks as complete using path parameters.
Path parameters are used to identify specific resources in an API. They are part of the URL and can be accessed in the request handler.
We'll add a complete method to our TodoController and TodoService to mark tasks as complete. This will be a PUT request because we are modifying existing data (similar to updating). The URL for this modification will be PUT /todos/:id/complete.
TypeScript1// src/todo/todo.controller.ts 2@Controller('todos') 3export class TodoController { 4 constructor(private readonly todoService: TodoService) {} 5 6 // ... Existing GET, POST, and PUT handlers 7 8 // Note that we've defined a new PUT handler for /todos/:id/complete 9 @Put(':id/complete') 10 complete(@Param('id') id: string): TodoDto { 11 return this.todoService.markTodoComplete(id); 12 } 13 14 // ... Existing DELETE handler 15}
TypeScript1// src/todo/todo.service.ts 2@Injectable() 3export class TodoService { 4 private todos: TodoDto[] = []; 5 6 // ... existing retrieve, create, update, and delete methods 7 8 markTodoComplete(id: string): TodoDto | null { 9 // Simply call the update method with only the completed field 10 return this.updateTodo(id, {completed: true}); 11 } 12}
In this lesson, you learned how to enhance your To-Do REST API with filters and specific modifiers. We covered adding a showIncomplete filter and a complete modifier. These additions make your API more powerful and user-friendly.
- Query parameters enable filtering data.
- Path parameters allow targeted updates.
- Separation of concerns: controllers handle requests, services manage business logic.
Next, you'll get hands-on practice with these enhancements in the upcoming exercises. Try implementing more filters and modifiers to deepen your understanding.