用Node.js寫第一個Web服務器：Express框架快速上手

爲什麼用Node.js和Express？¶

Node.js是一個基於Chrome V8引擎的JavaScript運行環境，讓我們可以在服務器端用JavaScript編寫代碼。而Express是Node.js最流行的Web框架，它就像一個“腳手架”，能幫我們快速搭建Web服務器，處理路由、請求和響應等複雜工作，比直接用Node.js原生API要簡單得多。

環境準備：安裝Node.js和npm¶

在開始前，我們需要先安裝Node.js（包含npm包管理器）。

下載安裝Node.js：
訪問 Node.js官網，選擇LTS版本（穩定版）下載安裝。安裝完成後，打開終端（Windows用戶用命令提示符或PowerShell），輸入以下命令檢查是否安裝成功：

   node -v  # 查看Node.js版本
   npm -v   # 查看npm版本

如果顯示版本號，說明安裝成功。

第一步：創建項目並安裝Express¶

新建項目文件夾：
在你喜歡的位置（比如桌面）新建一個文件夾，命名爲 my-first-express-server，進入該文件夾：

   mkdir my-first-express-server
   cd my-first-express-server

初始化項目：
運行 npm init -y，快速生成一個默認的 package.json 文件（項目配置文件）：

   npm init -y

安裝Express框架：
執行以下命令安裝Express到項目中：

   npm install express

安裝完成後，你會看到 node_modules 文件夾和 package.json 中多了 dependencies 字段，記錄了Express的版本。

第二步：編寫第一個Web服務器¶

在項目文件夾中新建一個 server.js 文件（這是服務器的入口文件），然後複製以下代碼：

// 1. 引入Express模塊
const express = require('express');

// 2. 創建Express應用實例
const app = express();

// 3. 定義端口號（3000是常用的開發端口，避免衝突）
const port = 3000;

// 4. 定義路由：處理根路徑 '/' 的GET請求
app.get('/', (req, res) => {
  // req: 請求對象，包含請求的信息（如路徑、參數等）
  // res: 響應對象，用於返回數據給客戶端
  res.send('Hello, 這是我的第一個Express服務器！');
});

// 5. 啓動服務器，監聽端口
app.listen(port, () => {
  console.log(`服務器已啓動，訪問地址：http://localhost:${port}`);
});

代碼解釋¶

const express = require('express')：從Node.js的模塊系統中引入Express框架，相當於“拿到”Express這個工具。
const app = express()：創建一個Express應用實例，app 是我們後續操作的核心對象，用來定義路由、中間件等。
app.get('/', (req, res) => { ... })：定義一個路由規則：當客戶端用GET方法請求根路徑 '/' 時，執行括號內的函數。
'/' 是請求的路徑，app.get 表示只處理GET方法（還有 app.post、app.put 等處理其他HTTP方法）。
req 是請求對象，包含客戶端發送的信息（如URL參數、請求頭、查詢字符串等）。
res 是響應對象，用於向客戶端返回數據（文本、HTML、JSON等）。
res.send(...)：向客戶端發送數據，這裏發送了一段文本。
app.listen(port, ...)：啓動服務器，監聽 port 端口（3000），當服務器啓動成功後，執行回調函數，打印提示信息。

運行服務器¶

在項目文件夾的終端中執行以下命令：

node server.js

如果控制檯顯示 服務器已啓動，訪問地址：http://localhost:3000，說明服務器啓動成功！

測試服務器¶

打開瀏覽器，訪問 http://localhost:3000，你會看到頁面上顯示 Hello, 這是我的第一個Express服務器！。恭喜，你已經成功搭建了一個最簡單的Web服務器！

擴展：添加更多路由¶

Express的核心是路由，我們可以通過不同的路徑和HTTP方法處理不同的請求。比如，添加一個關於頁面和一個用戶頁面：

// 根路徑
app.get('/', (req, res) => {
  res.send('<h1>首頁</h1>'); // 也可以直接返回HTML
});

// 關於頁面
app.get('/about', (req, res) => {
  res.send('這是一個關於頁面，歡迎瞭解更多！');
});

// 用戶頁面（動態路徑參數）
app.get('/user/:id', (req, res) => {
  // req.params.id 是動態路徑參數（如訪問 /user/123 時，id=123）
  res.send(`用戶ID：${req.params.id}`);
});

現在重啓服務器，訪問 http://localhost:3000/about 和 http://localhost:3000/user/456，就能看到不同的內容了！

處理JSON數據和靜態文件¶

1. 返回JSON數據¶

如果需要返回JSON格式的數據（比如API接口），可以用 res.json()：

app.get('/api/data', (req, res) => {
  const data = {
    name: 'Node.js',
    framework: 'Express',
    version: '4.x'
  };
  res.json(data); // 自動設置Content-Type爲application/json
});

訪問 http://localhost:3000/api/data，會看到一個JSON對象。

2. 提供靜態文件（HTML/CSS/JS）¶

假設你有一個前端項目，需要在服務器上提供靜態資源（如HTML、CSS、圖片等），可以使用Express的內置中間件 express.static：

在項目根目錄新建一個 public 文件夾，放入靜態文件（如 index.html）：

   my-first-express-server/
   ├─ public/
   │  └─ index.html
   └─ server.js

在 server.js 中添加代碼：

   const path = require('path'); // 引入Node.js的path模塊，處理路徑
   app.use(express.static(path.join(__dirname, 'public'))); // 託管public文件夾下的靜態文件

現在，訪問 http://localhost:3000/index.html 就能看到 public 文件夾下的 index.html 內容了！

總結¶

通過這篇文章，你已經掌握了用Express框架快速搭建Web服務器的基本步驟：
1. 安裝Node.js和Express；
2. 創建項目並初始化；
3. 定義路由處理請求；
4. 啓動服務器並測試；
5. 擴展路由和功能（如返回JSON、靜態文件）。

Express的核心是“路由+中間件”，後續可以繼續學習中間件的使用（如處理錯誤、日誌記錄）、動態路由參數、表單提交等內容。現在，試着修改代碼，創建一個自己的路由或頁面吧！