Node.js/TypeScriptでのユーザー管理REST APIの構築（パート1：Express.js）

REST APIをNode.js/TypeScriptで構築する（パート1: Express.js）

Node.jsでREST APIを構築する場合、リクエスト処理やルート管理を行うために、Express.jsは最もよく使われるフレームワークの一つです。Express.jsは小さなサイズで強力かつ柔軟な機能を提供し、プロジェクトに簡単に統合できます。このシリーズの記事では、Node.js/TypeScriptとExpress.jsを使ってユーザー管理のREST APIを構築する方法を紹介します。

使用するパッケージ:

• Express
• Typescript
• Cors: Expressのミドルウェアで、クロスオリジンリソースシェアリングを有効にするためのものです。

I. 必要なパッケージのインストールと初期設定

まず、以下のコマンドを実行します:

npm init

次に、以下のコマンドで必要なパッケージをインストールします:

npm i express cors

さらに、開発用のパッケージも追加します:

npm i –save-dev @types/cors @types/express typescript

パッケージをインストールした後、`package.json`は以下のようになります（インストールする時期によってバージョンは異なります）:

II. プロジェクト構造

この段階での基本的なプロジェクト構造は、以下の2つのファイルで構成されます:

• app.ts
• users/users.routes.config.ts

ここでは、各モジュールがその責任を持つようにプロジェクト構造を分けています。ユーザーモジュールには、ユーザー関連のロジックが含まれ、将来的にはユーザー以外のモジュールも作成することができます。

次回の記事では、ユーザーモジュールの中に`middleware`, `controllers`, `services`, `daos`, `dto` フォルダを追加し、各レイヤーの業務処理を明確に分ける方法を紹介します。

III. ルートとエントリーポイントapp.tsの実装

usersフォルダ内に`users.routes.config.ts`ファイルを作成し、以下のコードを記述します：

import express from 'express';

export class UsersRoutes {
    app: express.Application

    constructor(app: express.Application) {
        this.app = app;
        this.configureRoutes();
    }

    configureRoutes() {
        this.app.route(`/users`)
            .get((req: express.Request, res: express.Response) => {
                res.status(200).send(`List of users`);
            })
            .post((req: express.Request, res: express.Response) => {
                res.status(200).send(`Post to users`);
            });

        this.app.route(`/users/:userId`)
            .get((req: express.Request, res: express.Response) => {
                res.status(200).send(`GET requested for id ${req.params.userId}`);
            })
            .put((req: express.Request, res: express.Response) => {
                res.status(200).send(`PUT requested for id ${req.params.userId}`);
            })
            .patch((req: express.Request, res: express.Response) => {
                res.status(200).send(`PATCH requested for id ${req.params.userId}`);
            })
            .delete((req: express.Request, res: express.Response) => {
                res.status(200).send(`DELETE requested for id ${req.params.userId}`);
            });
        return this.app;
    }
}

`UsersRoutes`クラスは、ユーザーモジュールのルートを設定し、ルートごとにリクエストとレスポンスを処理します。

• Request: クライアントからの要求に関する情報を含むオブジェクトです。ヘッダー、パラメーター、クエリ、ボディなどが含まれます。
• Response: サーバーがクライアントに送る応答を表すオブジェクトで、データを送信したり、ヘッダーやステータスコードを設定するためのメソッドを提供します。

次に、エントリーポイント`app.ts`の実装を行います：

import * as bodyparser from 'body-parser';
import cors from 'cors';
import express from 'express';
import * as http from 'http';
import { UsersRoutes } from './users/users.routes.config';

const app: express.Application = express();
const port = 3000;

app.use(bodyparser.json());
app.use(cors());

new UsersRoutes(app);

app.listen(port, () => {
    console.log(`Server running at http://localhost:${port}`);
});

ここで新たに`body-parser`パッケージをインポートしています。

body-parserは、Express.jsのミドルウェアで、クライアントから送信されたHTTPリクエストのボディからデータを取り出すために使用されます。

次に、`express()`関数はExpressアプリケーションを作成するメソッドです。`app.listen()`を使って、サーバーを起動し、特定のポート（ここでは3000）でクライアントからの接続を待機します。

IV. TypeScript設定とpackage.jsonの調整

前述のコードを実装した後、サーバーを起動するための簡単な設定を行います。

まず、`tsconfig.json`というファイルを作成し、以下の設定を記述します：

{
    "compilerOptions": {
        "target": "es2016", // TypeScriptが変換するECMAScriptのバージョンを指定
        "module": "commonjs", // コンパイル後のモジュールシステム（ここではCommonJS）
        "outDir": "./dist", // コンパイルされたJavaScriptコードのディレクトリ
        "strict": true, // 厳格な型チェック
        "esModuleInterop": true, // TypeScriptとJavaScriptモジュールの互換性
        "inlineSourceMap": true // ソースマップをJavaScriptファイルに埋め込む
    }
}

次に、`package.json`の`scripts`セクションを調整します：

"scripts": {
    "start": "tsc && node ./dist/app.js",
    "debug": "export DEBUG=* && npm start",
    "test": "echo \"Error: no test specified\" && exit 1"
}

ここで、`tsc`はTypeScriptファイルをコンパイルしてJavaScriptに変換し、`node ./dist/app.js`でサーバーを実行します。

V. APIテスト

アプリケーションを起動するには、以下のコマンドを実行します：

npm start

APIが正しく動作するかをテストするために、curl（Linux）またはInvoke-WebRequest（Windows）を使用します：

GETメソッド：

curl --request GET 'localhost:3000/users/12345'
Invoke-WebRequest -Uri 'http://localhost:3000/users/12345' -Method Get

POSTメソッド：

curl --request POST 'localhost:3000/users' \
--data-raw "{}"
Invoke-WebRequest -Uri 'http://localhost:3000/users' -Method Post -ContentType 'application/json' -Body '{}'

これで、基本的なアプリケーションの骨組みが完成しました。次回の記事では、ユーザーモジュールのServices、Middleware、Controllers、Modelsの実装を紹介します。

次回もお楽しみに。

Vắn Quang Quí PHP Developer