今日目標說明

前端地基打好了，今天輪到後端登場！我們將建立一個 Node.js 專案，並引入 Express 框架。這是一套極度輕量且靈活的後端框架。更重要的是，我們會特別為後端環境加上 TypeScript (TS) 的支援。

核心程式碼片段

首先，建立後端資料夾並初始化 npm：

mkdir backend
cd backend
npm init -y

接著，安裝 Express 以及 TypeScript 相關套件：

# 安裝 express 主程式
npm install express

# 安裝開發環境需要的 typescript 與相關型別檔
npm install -D typescript @types/express @types/node ts-node-dev

安裝完成後，我們可以建立 src/index.ts 來撰寫我們的第一支測試 API：

// src/index.ts
import express, { Request, Response } from 'express';

const app = express();
const port = 3000;

// 定義一個簡單的健康檢查 API
app.get('/api/health', (req: Request, res: Response) => {
  res.status(200).json({ status: 'ok', timestamp: new Date().toISOString() });
});

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

在 package.json 的 scripts 中加入啟動指令 "dev": "ts-node-dev src/index.ts"，就可以透過 npm run dev 啟動後端伺服器了！

【技術原理解析】為什麼後端堅持要上 TypeScript？

許多初學者在寫 Node.js 時習慣直接寫純 JavaScript (JS)，為什麼我們願意花費額外力氣去配置編譯環境，堅持使用 TypeScript？

1. 提前攔截「低級錯誤」：在 JS 中，如果您把 req.body.pokemonId 拼錯成 req.body.pokmonId，程式依然會順利啟動，直到執行到那一行時才大崩潰。TS 則會在您打字的當下就畫上紅線警告您。
2. 無敵的「自動補全 (IntelliSense)」：透過 @types/express，當您打出 req. 時，編輯器會精準提示所有可用的屬性與方法，再也不用去背誦 API 文件。
3. 重構的底氣：未來若資料庫欄位名稱修改（例如把 pokemon_id 改成 pokedex_num），TS 會明確指出整個專案所有受影響的地方，讓後端維護與重構變得無比安心。

短期來看，設定 TS 稍嫌麻煩；但長期來看，它為後端帶來的穩定度是無價的。

實際畫面截圖

1. 啟動後端伺服器的終端機畫面

2. API測試成功的畫面 (使用瀏覽器或 Postman 訪問 http://localhost:3000/api/health)

小結

後端伺服器成功跑起來了，且擁有了強型別的護城河！現在我們前後端都準備就緒。但系統還缺少一個能持久化儲存寶可夢資料的地方，明天我們將申請輕量強大的 Turso 雲端資料庫！