1. 導入: なぜフロントエンド開発にNode.jsが必要なのか
フロントエンド開発の現場では、ReactやVue.jsといったフレームワークを使う際に「Node.js」が不可欠です。Node.jsは、本来ブラウザでしか動かなかったJavaScriptを、サーバーサイド（PCやサーバー上）で実行可能にする環境です。API（Application Programming Interface）を自作することで、フロントエンドからデータを取得・送信する練習ができるようになり、本番環境に近い開発体験が得られます。
2. 基礎知識: Node.jsで動くAPIとは？
APIとは、システム同士がやり取りするための窓口です。Node.jsでAPIを作る際、最もよく使われるのが「Express」というライブラリです。
HTTPメソッド: サーバーに対して「何をしてほしいか」を伝える命令です。
・GET: データを取得する
・POST: データを送信・保存する
これらを理解することで、フロントエンドから「このボタンを押したらデータを保存する」といった機能が実現できるようになります。
3. 実装/解決策: サーバーを立ち上げてみよう
Node.jsでAPIを作るには、まずプロジェクトの初期化が必要です。ターミナルで以下のコマンドを実行します。
1. npm init -y （設定ファイルの作成）
2. npm install express （Expressのインストール）
その後、JavaScriptファイルを作成し、サーバーを起動させます。
4. サンプルプログラム: シンプルなAPIサーバー
以下のコードを「server.js」として保存してください。
// expressモジュールを読み込みます
const express = require(‘express’);
const app = express();
const port = 3000;
// JSON形式のデータを受け取れるように設定します
app.use(express.json());
// ブラウザからアクセスされた時の処理（GET）
app.get(‘/api/message’, (req, res) => {
res.json({ message: ‘こんにちは！APIからデータが届きました’ });
});
// サーバーを起動します
app.listen(port, () => {
console.log(`サーバーがポート ${port} で起動しました`);
});
※実行方法: ターミナルで「node server.js」と入力し、ブラウザで http://localhost:3000/api/message にアクセスしてみてください。
5. 応用・注意点: 現場で役立つポイント
CORS（クロスオリジンリソース共有）への対策:
フロントエンド（例: React）とNode.jsサーバーを別のポートで動かすと、ブラウザのセキュリティ機能で通信がブロックされることがあります。この場合、「cors」というライブラリをインストールし、設定を追加することで解決可能です。
エラーハンドリング:
本番環境では、存在しないURLへのアクセスやサーバーエラーが発生した際に、適切なステータスコード（404や500など）を返すことが重要です。まずは小さなAPIを作り、フロントエンドから「fetch」関数を使ってデータを取得する練習から始めてみましょう。