1. Next.jsのAPIルーティングとは

Next.jsのAPIルーティングは、APIエンドポイントを簡単に作成できる機能です。pages/apiディレクトリ内にファイルを作成するだけで、エンドポイントが自動的に生成されます。これにより、バックエンドAPIを簡単に構築できます。

2. 主な使用方法

APIルーティングを利用するには、次の手順に従ってください。

1. pages/apiディレクトリを作成します。
2. そのディレクトリ内に、エンドポイントに対応するJavaScriptファイル（.jsまたは.ts）を作成します。
3. ファイル内で、エクスポートされたデフォルト関数（リクエストハンドラ）を定義します。この関数は、リクエストオブジェクト（req）とレスポンスオブジェクト（res）を引数に取ります。

例:

export default function handler(req, res) {
  res.status(200).json({ message: 'Hello from the API!' });
}

これにより、/api/helloエンドポイントが生成されます。

3. メリット

Next.jsのAPIルーティングには、以下のようなメリットがあります。

• シンプルな構成: APIエンドポイントの作成が簡単で、追加のサーバー設定やバックエンドフレームワークが不要です。
• 開発効率の向上: フロントエンドとバックエンドを同じプロジェクト内で管理できるため、開発効率が向上します。
• 自動的なコード分割: Next.jsは自動的にコード分割を行い、必要な部分だけをロードします。これにより、パフォーマンスが向上します。

4. 実際の使用例

以下に、Next.jsのAPIルーティングを用いた簡単なCRUDアプリケーションの例を示します。

1. ユーザー情報を取得するAPIエンドポイント:

import { getUsers } from '../../../lib/users';

export default async function handler(req, res) {
  if (req.method === 'GET') {
    const users = await getUsers();
    res.status(200).json(users);
  } else {
    res.status(405).json({ message: 'Method not allowed' });
  }
}

1. ユーザー情報を追加するAPIエンドポイント:

import { createUser } from '../../../lib/users';

export default async function handler(req, res) {
  if (req.method === 'POST') {
    const user = await createUser(req.body);
    res.status(201).json(user);
  } else {
    res.status(405).json({ message: 'Method not allowed' });
  }
}

1. ユーザー情報を更新するAPIエンドポイント:

import { updateUser } from '../../../lib/users';

export default async function handler(req, res) {
  if (req.method === 'PUT') {
    const user = await updateUser(req.query.id, req.body);
    res.status(200).json(user);
  } else {
    res.status(405).json({ message: 'Method not allowed' });
  }
}

1. ユーザー情報を削除するAPIエンドポイント:

import { deleteUser } from '../../../lib/users';

export default async function handler(req, res) {
  if (req.method === 'DELETE') {
    await deleteUser(req.query.id);
    res.status(204).json({});
  } else {
    res.status(405).json({ message: 'Method not allowed' });
  }
}

上記の例では、/api/usersエンドポイントを作成し、HTTPメソッドに応じて異なる処理を行っています。また、各エンドポイントでlib/users.jsから関数をインポートして、データ操作を行っています。
これにより、Next.jsのAPIルーティングを使って、シンプルかつ効率的にCRUDアプリケーションを構築できます。