バナナでわかる！NestJS入門！

はじめに

NestJSをこらから学習する方向けの記事となります。
やることは簡単。
プロジェクトをさくっと構築してREST APIでバナナを取得するだけです。

NestJSとは？

NestJSは、サーバーサイドアプリケーションを作るためのフレームワークです。サーバーサイドアプリケーションというのは、ウェブサイトの裏側で動くシステムのことです。NestJSでは、「モジュール」「コントローラー」「サービス」という3つの主要な部分を組み合わせてアプリケーションを作ります。これらを簡単に説明すると、次のようになります。

モジュール（Module）：パーツをまとめる箱

アプリケーションを実行する上で、アプリケーションが使う機能を登録するための機能です。
ルートモジュールが必ずあり、さらにその配下に各機能ごとのモジュールがぶら下がる構成になります。

コントローラー（Controller）：ルーティング担当

クライアントからのリクエストを受け付けて、レスポンスを返す役割を担います。
コントローラーにコードを書くと肥大化してしまうため、ルーティング処理をコントローラーに任せてビジネスロジックはサービスに書きます。

サービス（Service）：実際の処理

実現したい処理を書くところ。コントローラから呼び出します。

全体像については以下の記事の図がわかりやすいです。
https://baapuro.com/NestJS/one/#story

使うもの

• VSCode or Cursorエディタ
• Rest Client
• Nest CLI

準備

まずはNestCLIをインストールします。
以下のコマンドを実行しましょう。

npm i -g @nestjs/cli

公式サイトはこちら（英語）
https://docs.nestjs.com/

続いてプロジェクトを作成します。
以下のコマンドを実行して構築します。

nest new hello-nestjs

npmを選択してEnterを押します。

プロジェクトの構築が完了したら、以下のように表示されます。

作成したプロジェクトを、VSCodeまたはCursorエディタで開きましょう。

次に不要なファイルとフォルダを削除します。

app.controller.spec.ts, app.controller.ts, app.service.ts, testフォルダを削除します。

app.module.tsを以下のようにします。

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

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

これで準備は完了です。

バナナをGETしよう！

モジュールを作成する

まずはじめに、モジュールを作成しましょう。

以下のコマンドを実行します。

nest g module animal-foods

animal-foodsモジュールが作成されます。

ルートモジュールであるapp.moduele.tsに、AnimalFoodsModuleが自動的に登録されます。

コントローラとサービスを作成する

続いてコントローラとサービスを作成しましょう。

以下のコマンドを実行し、コントローラを作成します。

nest g controller animal-foods --no-spec

--no-specオプションをつけることで、テストファイルが作成されなくなります。

以下のコマンドを実行し、サービスを作成します。

nest g service animal-foods --no-spec

これでコントローラとサービスが追加されました。

AnimalFoodsModuleの中に、コントローラとサービスが自動的に登録されます。

サービスを実装する

サービスクラスを実装してみましょう。

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

@Injectable()
export class AnimalFoodsService {
    findBanana() {
        return 'BA🍌NA🍌NA';
    }
}

findBananaメソッドでバナナを見つけます。

コントローラを実装する

コントローラからサービスクラスであるAnimalFoodsServiceをインポートし、findBananaメソッドを呼び出します。
コントローラとサービスで実装を分けることにより、コントローラの肥大化を防ぎます。

import { Controller, Get } from '@nestjs/common';
import { AnimalFoodsService } from './animal-foods.service';

@Controller('animal-foods')
export class AnimalFoodsController {
    constructor(private readonly animalFoodsService: AnimalFoodsService) {}

    @Get()
    findBanana() {
        return this.animalFoodsService.findBanana();
    }
}

Getデコレータをつけることにより、HTTP　GETリクエストを受け取ることができます。

これでアプリケーションは完成です。

REST Clientでバナナを取得しよう

それでは完成したアプリケーションを実行し、バナナを取得しましょう。

まずはRest Clientを準備します。

以下の記事を参考にしてみましょう。

https://zenn.dev/collabostyle/articles/ff82f0d86e80e3

restclientフォルダを作成し、request.httpファイルを作成ます。

@baseUrl = http://localhost:3000/animal-foods

# 🍌
GET {{baseUrl}}

以下のコマンドを実行し、アプリを起動します。

npm run start:dev

Send Requestを実行してリクエストを送ります。

バナナがGETできればOKです。お疲れ様でした！

参考

https://zenn.dev/kisihara_c/books/nest-officialdoc-jp