Setting up a Node development environment

為了使你能快速的開發 web 應用，Node 和 Express 非常容易安裝，這個部分說明哪些工具是需要的、在 Ubuntu、macOS 和 Windows 中安裝 Node 和 Express 的最簡單方法、展示如何測試安裝成功與否。

Express 開發環境包含 Nodejs、NPM 套件管理器的安裝, 還有 Express Application 產生器(可選)。

Node 和 NPM 套件管理器會從準備好的 binary package、安裝檔、 作業系統的套件管理器或是從源檔一起安裝。接著 Express 會透過 NPM 進行安裝，成為你所有個別 Express web 應用的依賴項(以及其他函式庫，如模板引擎，資料庫驅動程式，身份驗證中間層，用於提供靜態文件的中間件等)

NPM 也可用來安裝 Express 應用程式產生器(全域用)，一個方便的工具幫助你創造符合 MVC 模式的 Express web app 骨架。你不一定要使用應用程式產生器，因為每個 Express 應用程式不需要擁有同樣的檔案結構或依賴項。但為了專注於學習本身以及習慣模組化架構，我們會在接下來的教學中使用它。

典型的開發環境還包含其他工具，例如：編輯程式碼使用的文字編輯器、IDE，進行版本控置管理不同版本程式碼的Git。這邊假設你已經有這種工具了(尤其是文字編輯器)

Node 可以執行在 Windows、macOS、各種 Linux、Docker 等等(nodejs 的下載頁面有完整的列表)，在開發階段中個人電腦應該都有足夠的效能來執行 Node 。Express 執行在 Node 環境中，所以也能所有有安裝 Node 的平台上執行。

在這份教學中我們提供 Windows、macOS 和 Ubuntu Linux 的 Node 安裝教學。

Node 有許多版本，更新的版本代表著 bug 的修復、支援更新版本的 ECMAScript(JavaScript)標準和更好的 Node APIs 。

基本上你應該使用最新的 LTS 版本(*long-term supported，*長期維護版)。這種版本比『Current』版本更穩定而且還擁有最新的功能及持續性的更新維護。除非 LTS 不支援你需要的功能才使用『Current』版本。

而 Express ？永遠使用最新版！

諸如資料庫、模版引擎、驗證引擎等等都屬於應用程式的一部分，這些依賴項會透過 NPM 導入應用程式環境中，在後續的章節將會進一步探討。

為了使用 Express，首先要在你的電腦上安裝 Node 和Node Package Manager (NPM)。接下來用最簡單的方法在 Ubuntu Linux 16.04、 macOS 和 Windows 10 上安裝 Nodejs 的 Long Term Supported (LTS)版本吧

直接使用安裝檔吧！

1. 下載需要的安裝檔：

   1. 開啟 https://nodejs.org/en/
   2. 對於大部分的使用者來說，直接下載 LTS 版本

2. 下載完成後雙擊安裝檔，並照著安裝流程繼續。

安裝 Node 8.x LTS 版本最簡單的方法是使用套件管理器，只要在 terminal 上執行兩行指令

curl -sL https://deb.nodesource.com/setup_8.x | sudo -E bash -
sudo apt-get install -y nodejs

測試 Node 安裝最簡單的方法是在 terminal/command 上執行"version"這個指令，它會顯示當前的 Node 版本:

>node -v
v8.9.4

NPM 應該會隨著 Node 一起安裝，可以用相同的方法進行測試:

>npm -v
5.6.0

接著用稍為令人興奮的方法來測試吧！讓我們創件一個非常基本的『純 Node』伺服器，當你開啟正確的網頁時它會在瀏覽器上顯示"Hello World"

1. 複製以下的文字到名為hellonode.js的檔案中，目前我們只用到 Node 而已。

   js

   //載入HTTP模組
   var http = require("http");
   
   //創建HTTP 伺服器並監聽8000埠
   http
     .createServer(function (request, response) {
       // Set the response HTTP header with HTTP status and Content type
       response.writeHead(200, { "Content-Type": "text/plain" });
   
       // Send the response body "Hello World"
       response.end("Hello World\n");
     })
     .listen(8000);
   
   // Print URL for accessing server
   console.log("Server running at http://127.0.0.1:8000/");
   

   這段程式載入『http』模組，並創建一個伺服器 (createServer()，並在 8000 埠上監聽 HTTP requests。 The script then prints a message to the console about what browser URL you can use to test the server. The createServer() function takes as an argument a callback function that will be invoked when an HTTP request is received — this simply returns a response with an HTTP status code of 200 ("OK") and the plain text "Hello World".

   備註：Don't worry if you don't understand exactly what this code is doing yet! We'll explain our code in greater detail once we start using Express!

2. Start the server by navigating into the same directory as your hellonode.js file in your command prompt, and calling node along with the script name, like so:

   bash

   >node hellonode.js
   Server running at http://127.0.0.1:8000/
   

3. Navigate to the URL (http://127.0.0.1:8000/). If everything is working, the browser should simply display the string "Hello World".

Next to Node itself, NPM is the most important tool for working with Node applications. NPM is used to fetch any packages (JavaScript libraries) that an application needs for development, testing, and/or production, and may also be used to run tests and tools used in the development process.

You can manually use NPM to separately fetch each needed package. Typically we instead manage dependencies using a plain-text definition file named package.json. This file lists all the dependencies for a specific JavaScript "package", including the package's name, version, description, initial file to execute, production dependencies, development dependencies, versions of Node it can work with, etc. The package.json file should contain everything NPM needs to fetch and run your application (if you were writing a reusable library you could use this definition to upload your package to the npm respository and make it available for other users).

The following steps show how you can use NPM to download a package, save it into the project dependencies, and then require it in a Node application.

1. First create a directory for your new application and navigate into it:

   bash

   mkdir myapp
   cd myapp
   

2. Use the npm init command to create a package.json file for your application. This command prompts you for a number of things, including the name and version of your application and the name of the initial entry point file (by default this is index.js). For now, just accept the defaults:

   bash

   npm init
   

   If you display the package.json file (cat package.json), you will see the defaults that you accepted, ending with the license.

   json

   {
     "name": "myapp",
     "version": "1.0.0",
     "description": "",
     "main": "index.js",
     "scripts": {
       "test": "echo \"Error: no test specified\" && exit 1"
     },
     "author": "",
     "license": "ISC"
   }
   

3. Now install the Express library in the myapp directory. The package will automatically be saved to the dependencies list in your package.json file.

   bash

   npm install express
   

   The dependencies section of your package.json will now appear at the end of the package.json file and will include Express.

   json

   {
     "name": "myapp",
     "version": "1.0.0",
     "description": "",
     "main": "index.js",
     "scripts": {
       "test": "echo \"Error: no test specified\" && exit 1"
     },
     "author": "",
     "license": "ISC",
     "dependencies": {
       "express": "^4.16.2"
     }
   }
   

4. To use the library you call the require() function as shown below.

   js

   var express = require("express");
   var app = express();
   
   app.get("/", function (req, res) {
     res.send("Hello World!");
   });
   
   app.listen(8000, function () {
     console.log("Example app listening on port 8000!");
   });
   

   This code shows a minimal "HelloWorld" Express web application. This imports the "express" module and uses it to create a server (app) that listens for HTTP requests on port 8000 and prints a message to the console explaining what browser URL you can use to test the server. The app.get() function only responds to HTTP GET requests with the specified URL path ('/'), in this case by calling a function to send our Hello World! message.

   Create a file named index.js in the root of the "myapp" application directory and give it the contents shown above.

5. You can start the server by calling node with the script in your command prompt:

   bash

   >node index.js
   Example app listening on port 8000
   

6. Navigate to the URL (http://127.0.0.1:8000/). If everything is working, the browser should simply display the string "Hello World!".

If a dependency is only used during development, you should instead save it as a "development dependency" (so that your package users don't have to install it in production). For example, to use the popular JavaScript Linting tool eslint you would call NPM as shown:

npm install eslint --save-dev

The following entry would then be added to your application's package.json:

  "devDependencies": {
    "eslint": "^4.12.1"
  }

In addition to defining and fetching dependencies you can also define named scripts in your package.json files and call NPM to execute them with the run-script command. This approach is commonly used to automate running tests and parts of the development or build toolchain (e.g., running tools to minify JavaScript, shrink images, LINT/analyse your code, etc).

For example, to define a script to run the eslint development dependency that we specified in the previous section we might add the following script block to our package.json file (assuming that our application source is in a folder /src/js):

"scripts": {
  ...
  "lint": "eslint src/js"
  ...
}

To explain a little further, eslint src/js is a command that we could enter in our terminal/command line to run eslint on JavaScript files contained in the src/js directory inside our app directory. Including the above inside our app's package.json file provides a shortcut for this command — lint.

We would then be able to run eslint using NPM by calling:

npm run-script lint
# OR (using the alias)
npm run lint

This example may not look any shorter than the original command, but you can include much bigger commands inside your npm scripts, including chains of multiple commands. You could identify a single npm script that runs all your tests at once.

The Express Application Generator tool generates an Express application "skeleton". Install the generator using NPM as shown (the -g flag installs the tool globally so that you can call it from anywhere):

npm install express-generator -g

To create an Express app named "helloworld" with the default settings, navigate to where you want to create it and run the app as shown:

express helloworld

express --help

NPM will create the new Express app in a sub folder of your current location, displaying build progress on the console. On completion, the tool will display the commands you need to enter to install the Node dependencies and start the app.

{
  "name": "helloworld",
  "version": "0.0.0",
  "private": true,
  "scripts": {
    "start": "node ./bin/www"
  },
  "dependencies": {
    "body-parser": "~1.18.2",
    "cookie-parser": "~1.4.3",
    "debug": "~2.6.9",
    "express": "~4.15.5",
    "jade": "~1.11.0",
    "morgan": "~1.9.0",
    "serve-favicon": "~2.4.5"
  }
}

Install all the dependencies for the helloworld app using NPM as shown:

cd helloworld
npm install

Then run the app (the commands are slightly different for Windows and Linux/macOS), as shown below:

# Run the helloworld on Windows
SET DEBUG=helloworld:* & npm start

# Run helloworld on Linux/macOS
DEBUG=helloworld:* npm start

The DEBUG command creates useful logging, resulting in an output like that shown below.

>SET DEBUG=helloworld:* & npm start

> helloworld@0.0.0 start D:\Github\expresstests\helloworld
> node ./bin/www

  helloworld:server Listening on port 3000 +0ms

Open a browser and navigate to http://127.0.0.1:3000/ to see the default Express welcome page.

We'll talk more about the generated app when we get to the article on generating a skeleton application.

你現在有一個 Node 開發環境在你的電腦上運行，可以用來創造 Express 網頁應用。你也看到如何用 NPM 來加載 Express 到一個應用中，以及看到如何使用 Express 應用產生器，創建應用，然後執行它們。

下一篇文章，我們開始跟著教程一步一步實作，使用這個開發環境與搭配工具，建立一個完整的網頁應用。

• Downloads page (nodejs.org)
• Installing Node.js via package manager (nodejs.org)
• Installing Express (expressjs.com)
• Express Application Generator (expressjs.com)

• 前頁
• 概述：Express web framework (Node.js/JavaScript)
• 次頁