iT邦幫忙

2017 iT 邦幫忙鐵人賽
DAY 12
3
Modern Web

Node.JS - 30 天入門學習筆記系列 第 12

Day12 - Express.js 簡介及安裝

  • 分享至 

  • xImage
  •  

今天,邁入鐵人賽的第十二天。
現在清晨4點哩,小編睡不著,所以來發文。
發完,再去補眠。。。
我們來看看吧!

express 是基於 node.js web 應用程式的一種開發框架,可以快速搭建一個功能完整的網站。

express.js 是建構 在 Node.js 中介軟體模組的,我們叫它connect,它的運作就是在處理HTTP請求的函數;每處理完一個中介軟體函式,會再傳給下一個中間軟體的函式。(更多細節請看:https://goo.gl/ryvrte

http://ithelp.ithome.com.tw/upload/images/20161212/20103526sA8tAUy7Q4.png

為何使用express.js 的理由

來幫它打廣告....
1.它是快速,集思廣益,極簡的Node.js Web架構。(這不是首頁嗎?)
2.容易配置及客製化。
3.可以為你應用程式的Http methods及URLs 定義路由(Routes)。
4.包含不同的中介軟件,讓你可以在request及respones間,加入一些任務執行。
5.容易與 不同的 模板引擊整合,像是Jade, Vash, EJS…。
6.允許你定義一個 錯誤處理的 中介軟件。
7.容易為你的應用程式提供靜態文件和資源。
8.允許你建立 REST API server。
9.易於與database做連線,像是MongoDB, Redis, MySQL

如何安裝express

如果,你要globally 安裝,直接在command prompt 輸入
npm install -g express

Node.js 應用程式初始化,自動加入package.json

在command prompt,首先,我們建立一個資料夾:
mkdir myapp

進入該資料夾:
cd myapp

輸入指令:
npm init

根據步驟,輸入與這個應用程式的相關資料,它會以詢答的方式讓你寫入一些資訊,幫你建好一個package.jsonmyapp 這就是你的一個node.js 應用程式

如圖:
http://ithelp.ithome.com.tw/upload/images/20161212/20103526fGhsglguyo.png

進入資料夾一看,自動產生的檔案及資訊,如圖:
http://ithelp.ithome.com.tw/upload/images/20161212/20103526zf2PU5uP73.png

在應用程式裡安裝express套件

下方指令,會在你的應用程式裡安裝express,假設,我們用上面新增的myapp為例。
C:\myapp> npm install express --save

http://ithelp.ithome.com.tw/upload/images/20161212/20103526eA8i7BYY0v.png

其中,–save 會在你應用程式的 package.json 裡, 加入 express的相關資訊,如上圖。

以上,為你的應用程式,完成了express的安裝。


如何在Visual Studio 建立express 應用程式

1.新增/專案/選擇Blak Node.js Web Application/輸入檔名
http://ithelp.ithome.com.tw/upload/images/20161212/20103526zjZcSx2lVf.png

2.建立專案後,在方案總管之下,有一個npm,按下右鍵/Install New npm Package
http://ithelp.ithome.com.tw/upload/images/20161212/20103526xrCilE5fJm.png

3.此時,彈出一個packages install 視窗,我們可以尋找要安裝的套件。
http://ithelp.ithome.com.tw/upload/images/20161212/20103526oBSuCCD8lB.png

4.輸入express 後,它自動幫我們找到套件,安裝即可!
http://ithelp.ithome.com.tw/upload/images/20161212/20103526IRNSFCvsYq.png

5.安裝好以後,會自動產生一些相關模組,及寫入package.json資訊。
http://ithelp.ithome.com.tw/upload/images/20161212/20103526n2XRGUCS8T.png

以上,我們完成了,在visual studio 裡 express 應用程式的安裝。

更多與Express相關的連結

express 的中文化官方網站


上一篇
Day11 - Node.js EventEmitter
下一篇
Day13 - express web application
系列文
Node.JS - 30 天入門學習筆記32
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言