Node.js - Express.js 介紹與起手式 - iT 邦幫忙::一起幫忙解決難題，拯救 IT 人的一天

node

Nội Dung Chính

Express 簡介

Express.js 是基於 Node.js 所開發的前後端網頁框架，特性為快速極簡，主要運作是在處理 HTTP 請求的函數，處理每個中介函式，再傳給下一個中間軟體的函式。如下圖：

圖片於網站內

可以整合 Firebase，MySQL, Mongo 等資料庫，但因為輕量又整合 NPM，而學習 Express.js 也能了解後端邏輯的觀念，例如：AJAX post 底層運作可以知道後端工程師收到前端所發出的 request 之後要做什麼事情，或是 EJS template 知識掌握後可以跟後端有更良好的溝通。

安裝與設定

安裝指令：

npm install express --save

安裝完後會專案下的 package.json 的 dependencies 看到 express 就完成了。

package.json

{
  "name": "nodejs",
  "version": "1.0.0",
  "description": "node practice",
  "main": "firebase.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "hsuchihting",
  "license": "MIT",
  "dependencies": {
    "express": "^4.18.1", //這裡
    "firebase": "^8.10.1" 
  }
}

安裝完後在跟目錄下建立一個 app.js，並且引入並使用 express 相關套件。

app.js

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

啟動 web 伺服器

可以使用後，現在做啟動網頁伺服器，畢竟最終是要呈現在網頁上的，使用 app 裡面的 get() 方法，來啟動 web 伺服器。

app.js

app.get('/',(request,response)=>{
  response.send(`<h1>Hello, Node</h1>`)
})

// 監聽 port

const port = process.env.port || 3000;
app.listen(port)

這邊的程式碼是否似曾相識？也就是啟動 creatServer 的方法， createServer 是引入 http 的模組，這裡則是引入地套件式不同的，這邊式引入 express 模組。

在開啟畫面輸入 localhost:3000 或是 127.0.0.1:3000
這樣就能透過 express 將後端資料渲染在網頁上了。

Node.js – Express.js 介紹與起手式 – iT 邦幫忙::一起幫忙解決難題，拯救 IT 人的一天

Express 簡介

安裝與設定

啟動 web 伺服器

參考資料