Node.js in Docker

Node.js

不管你有沒有開發過 web 前端，你一定(可能)聽過 Node.JS 。網路上 Node.js 的介紹看了一大堆， 但完全不知道到底要怎麼用，阿它到底是要寫前端還是要寫後端的 ? 我相信大部分的人都要這個疑問。

此篇會用簡短範例(4個檔案)，展示如何快速建立 Node.JS 的環境，然後你就可以自行開發啦。

以下簡單介紹一下 Node.js 及 NPM

Node.js 是一個基於 Chrome V8 JavaScript 引擎的開放源碼、跨平台運行時環境，專門用於執行 JavaScript 代碼。它最早於 2009 年由 Ryan Dahl 開發，主要目的是擴展 JavaScript 的應用範圍，讓它可以不僅僅運行在瀏覽器中，還能作為服務端技術，實現高效、非阻塞（non-blocking）的服務器應用程式。

Node.js 內建 NPM（Node Package Manager），這是世界上最大的開源程式庫之一，擁有超過百萬個現成的套件，讓開發者可以快速整合各種功能模組。

Node.js in Docker

我們來使用 Docker 建立 Node.js 環境，示範 Node.js 在前端的開發如何使用。

資料夾如下

Dockerfile: 建立 image 所需的設定檔，其中敘述 nodejs 使用哪個版本

package.json: 在 nodejs 的環境中，需要下載那些模組

server.js: 容器 run 起來時，要執行的 script, 這邊是使用 express 顯示 html 的檔案

Dockerfile

# 使用官方的 Node.js Docker 映像
FROM node:hydrogen-alpine3.20

# 設定工作目錄
WORKDIR /app

# 複製 package.json 和 package-lock.json (如果有)
COPY package*.json ./

# 安裝依賴
RUN npm install

# 複製所有文件到工作目錄
COPY . .

# 開放端口（假設使用的是 8080 端口）
EXPOSE 8080

# 啟動應用程式
CMD ["node", "server.js"]

package.json

{
  "name": "my-nodejs-app",
  "version": "1.0.0",
  "description": "A simple Node.js web server",
  "main": "server.js",
  "scripts": {
    "start": "node server.js"
  },
  "dependencies": {
    "bootstrap": "^5.3.3",
    "express": "^4.17.1"
  }
}

server.js

const express = require('express');
const path = require('path');
const app = express();


// 指定靜態文件資料夾
app.use(express.static(path.join(__dirname, 'public')));
app.use('/bootstrap', express.static(path.join(__dirname, 'node_modules/bootstrap/dist')));


// 啟動伺服器
const PORT = process.env.PORT || 8080;
app.listen(PORT, () => {
    console.log(`Server is running on port ${PORT}`);
});

build image

docker build -t my-nodejs-app .

run container

docker run -it -p 8080:8080 -v D:\codes\Docker\Node\test\package.json:/app/package.json -v D:\codes\Docker\Node\test\public:/app/public my-nodejs-app

package.json mount 進 app : 因為在 container 中，使用 npm install <module> package.json 會被改變，外部的檔案可以保留變更。

public 資料 mount 進 app: 方便你新增檔案，及保留變更修改。

在 Container 中看檔案結構

執行結果:

檔案都附上去了，有興趣的自己試一下吧！