Fusic Tech Blog

Fusicエンジニアによる技術ブログ

NestJSの開発環境構築
2024/03/25

NestJSの開発環境構築

NestJSとは

NestJSとはサーバーサイドアプリケーションのためのNode.jsフレームワークです。

特徴としては公式のGitHub にあるように

A progressive Node.js framework for building efficient and scalable server-side applications on top of TypeScript & JavaScript (ES6, ES7, ES8) heavily inspired by Angular

Angularに強く影響を受けているフレームワークです。

そのためTypeScriptで書け、書き方もAngularに似ているため、普段からAngularに慣れている人は簡単に導入できると思います。

GraphQLやWebSocketなどにも対応して多機能な印象です。

詳しくはスライドがあるので、興味のある方は見てください。

TypeScriptで作るサーバーサイドアプリケーション

今回は開発環境構築についてご紹介したいと思います。

開発環境構築(Docker + nestjs/cli)

コンテナ起動。カレンとディレクトリにマウントします。

$ mkdir nestjs-app $ cd nestjs-app

docker-compose.yml(webとdb)を作成します。

version: '3' 
services: 
  nest-app-web: 
    image: nestjs/cli:5.5.0 
    ports: 
      - 3030:3000 
    volumes: 
      - ./:/workspace/ 
    links: 
      - nest-app-db 
    tty: true 
  nest-app-db: 
    image: mysql:5.7 
    environment: 
      MYSQL_ROOT_PASSWORD: "root" 
      MYSQL_USER: "root" 
      MYSQL_PASSWORD: "root" 
      MYSQL_DATABASE: "root" 
    ports: 
      - 13306:3306

コンテナを起動します。

$ docker-compose up -d

起動したらnest-app-web側のコンテナへログインします。

$ docker-compose exec nest-app-web sh

ログイン後、CLIのバージョン確認をしてみます。

$ nest -V

以上で開発環境が整いました。

プロジェクト作成

カレンとディレクトリにプロジェクトを作成します。

$ nest new .

description, version, authorと順番に聞かれ、最後にpackage managerを選択します。

公式のdockerイメージでの環境の場合はnpmからでないと動きませんでした。

次にパッケージをインストールします。

$ npm install

インストールが終わったらサーバーを起動してみます。

$ npm run start

今回の場合は, 3030ポートにマッピングしているので、localhost:3030にブラウザからアクセスすると「Hello World!」とテキストが表示されていれば成功です。

最後に

公式Dockerイメージを使うことで簡単にNestJSの開発環境を構築することができました。

Angularはもちろんのこと、Vue.jsなど最近のフロントエンドフレームワークなどではTypeScriptサポートの流れがあります。

サーバーサイドもTypeScriptにすることで、フロントエンドとの親和性も高くなり、さらにこのNestJSはExpressベースで動くので、そのままSSRすることも可能だと思われます(まだ試せてません…)。

次回は、TypeORMを使ってDBとの連携について書きたいと思います。

Daiki Urata

Daiki Urata

フロントエンド/モバイルアプリなどを主に開発しています。