業務でNestJSによるサーバーサイドを実装することになったため、備忘録として残していきます。
基本的なNestJSによるアプリケーション開発を行い、最終的にHelloWolrdできたら完成。
ゴール
- NestJSのアプリケーションを作成&サーバー起動し、
HelloWorldが表示されること - 作成された各ファイルの役割が大まかに理解できていること
参考リンク
開発環境
- VSCode
- 実行環境
- Node.js：
v16.x - yarn：
v.1.22.x
- Node.js：
- ライブラリ
- @nestjs/cli：
8.2.x
- @nestjs/cli：
導入手順
基本的には公式ドキュメントの通りに実行する
nest-cliのインストールnest newコマンドでプロジェクトフォルダの作成- サーバー起動&該当URLへアクセス
- 画面上にHelloWorldが表示
- [おまけ] 表示される文言とパスを変更してみる
実装
1. nest-cliのインストール
# nest-cliのinstall
$ npm i -g @nestjs/cli
# バージョン確認
$ nest -v
8.2.32. nest newコマンドでプロジェクトフォルダの作成
プロジェクトを作成したいディレクトリに移動し、下記コマンドを実行
$ nest new <プロジェクト名>
# パッケージマネジャーはyarnを選択
? Which package manager would you ❤️ to use? yarn生成ファイル
├── README.md
├── nest-cli.json
├── package.json
├── node_modules/
├── src
│ ├── app.controller.spec.ts
│ ├── app.controller.ts
│ ├── app.module.ts
│ ├── app.service.ts
│ └── main.ts
├── test
│ ├── app.e2e-spec.ts
│ └── jest-e2e.json
├── tsconfig.build.json
├── tsconfig.json
└── yarn.lock各ファイルの役割
| ファイル名 | 役割 |
app.controller.ts | ルーティング担当 |
app.controller.spec.ts | コントローラのユニットテスト |
app.module.ts | controllerやprovider(service)のまとめ役 |
app.service.ts | ビジネスロジック担当 |
main.ts | エントリーポイント |
※ 参考：https://docs.nestjs.com/first-steps#setup
3. サーバー起動&該当URLへアクセス
サーバー起動
package.jsonにデフォルトで記載されているscriptsコマンドを実行
※ start:devにすればwatchモードになるため、コード変更時にサーバーが自動で再起動される
# サーバー起動
$ yarn run startmain.ts内で3000番ポートがlistenされている
import { NestFactory } from '@nestjs/core';
import { AppModule } from './app.module';
async function bootstrap() {
const app = await NestFactory.create(AppModule);
await app.listen(3000);
}
bootstrap();該当URLへアクセス
localhost:3000にアクセスすると、下記のように「Hello World!」と表示される
もしくはcurlコマンドでも同様の結果が得られます
$ curl http://localhost:3000
Hello World!% 4. 表示される文言とパスを変更してみる
表示される文字を変更してみる
Hello Wroldを返しているapp.service.tsを修正して、Good Eveningと返すように変更
import { Injectable } from '@nestjs/common';
@Injectable()
export class AppService {
getHello(): string {
return 'Good Evening!'; //文言を変更
}
}
※ app.service.tsのgetHello()メソッドをcontrollerから呼んでいる
サーバー再起動後、curlコマンドで該当URLを叩いてみると表示が変わったことを確認できた
$ curl http://localhost:3000
Good Evening!% パスを変更してみる
今度はapp.controller.tsの修正して、アクセスするパスを変更してみる
import { Controller, Get } from '@nestjs/common';
import { AppService } from './app.service';
@Controller()
export class AppController {
constructor(private readonly appService: AppService) {}
@Get('evening') //ここにパスを追加
getHello(): string {
return this.appService.getHello();
}
}
@Getデコレータの引数に追加したいパスを書くと対象メソッドのみに反映される
※ @Controller('hello')と書いた場合は/hello/eveningとなり、controller全体に反映される
$ curl http://localhost:3000/evening
Good Evening!% さいごに
NestJSの触りの部分を記事にしてみましたが、今後は基本的なCRUD機能、module追加やmonorepo機能なども記事にしていければと思います。
ご覧いただきありがとうございました。
