node.js 之學習 Express 的筆記(2)-安裝express

之前的文章:

• node.js 之學習 Express 的筆記(1) 
• node.js 一個package的檔案結構
• Node.js初探

暨昨天稍微了解一下Express是什麼之後，接下來要手動開始做了(怎麼有點像勞作課...)，說明一下這個簡單的步驟好了，首先我們要在我的電腦，安裝express，要怎麼安裝?，"從無到有"一定需要一些安裝的步驟，先確認有安裝node.js跟npm，接下來就可以開始下指令了!
[以下僅供參考...，若有疏漏或筆誤敬請指正，感謝!]

可考慮看官方文件: http://expressjs.com/guide.html


首先建立一個要放express的目錄
我的話呢 ...我是在我的家目錄
我的家目錄就是win，建立一個myhomepage(隨意取名的..)的資料夾

win@ubuntu:~$ pwd

/home/win

win@ubuntu:~$ mkdir myhomepage

myhomepage的資料夾用來放安裝好的express framework




接著開始安裝express

win@ubuntu:~/myhomepage$ sudo npm install -g express

加sudo只是為了避免報錯，你也可以 npm install -g express 就好了
-g是global的意思，我看官方的範例也是建議你安裝global，因為這樣你可以在任何地方都能使用到他。
然後就會開始安裝,會跑一長串的npm http GET https://XXX.XX........

確認安裝結果/是否安裝成功
可輸入express --help確認

win@ubuntu:~/myhomepage$ express --help

建立一個網站基本架構
接下來我們必須下express指令讓他去幫你建立一個網站的基本架構，這裡有件事情要注意的事情是template engine的設定，別忘了為什麼我們需要裝express，因為這個一個好用的web application framework for nodejs，所以express的option多半跟網站的規畫有關係，像css,template engine, session....等，express提供你兩種tamplate engine support，分別是 jade 跟 ejs，jade對我來說現在還很抽象，因為我不熟悉，所以我選擇了ejs(也沒有熟到哪去xdd)，但若是跟我一樣要選擇ejs的朋友們，我們在下express時要加上-e的參數，因為express預設的template是jade。

win@ubuntu:~/myhomepage$ express -e myhomepage

express -e(或者--ejs) 你的app_name

下了這個指令之後他會在我的myhomepage的目錄下面建立好一些資料夾跟檔案，
然後按照他的指示輸入cd myhomepage && npm install (你也可以分兩次下)
後面之所以要在下一句npm install是要檢查myhomepage目錄下的package.json
要安裝所有的dependencies



Then fire it up!  讓它動起來吧XD
Then fire it up!是我從官網上看到的小標，還蠻有趣的，意思就是說上面的步驟都做了的話
請你下node app.js 來啟動這個express的app

這個app預設是監聽port 3000
當你看到Express server listening on port 3000
就可以打開瀏覽器瀏覽localhost:3000(127.0.0.1:3000)
你會看到類似這樣的畫面:

到這裡...
事情已經告一個段落了，Express的基本安裝與看到他真的跑起來的步驟差不多就是這樣。
下面的部分我要來看這個express幫我建立在myhomepage資料夾的目錄結構，可忽略下半部。





===================這=是=華=麗=的=分=隔=線=================





觀察目錄結構
可以輸入tree -L 2觀察整個myhomepage目錄下的檔案結構

win@ubuntu:~/myhomepage/myhomepage$ tree -L 2

app.js
是一個js檔(廢話)xd，
裡面寫了很多整個網站的設定，比方說你這個網站，需要甚麼module，會寫在這個檔案，
包含routes的設定，view file的目錄是哪個，view engine的設定(是ejs還是jade)，靜態檔案的路徑位置(預設是寫public)， 但我發現不同版本的express的app.js的寫法好像有所不同，在下次的文章我會練習用node.js做一個靜態網站，練習一些設定，到時候就會寫到app.js這個檔了。

node_module資料夾
裡面的目錄都是這個網站安裝過的packaged

package.json
這個網站的一些基本資料，最常去改的地方就是 dependencies
在這次安裝的 myhomepage 的資料夾裡的 package.json 來說
只有express跟ejs
但難保以後不需要再擴增 dependencies
當我們需要新增其他 dependices 或是修改現有 dependencies時
到時候就需要再下一次install npm 指令
每下一次install npm，他就會去檢查這個package.json檔的依賴 (dependencies)
去幫你做安裝這些dependencies的動作。

Public資料夾
裡面又分三個子資料夾，分別是images,javascripts, stylesheets
public資料夾都是放些靜態的檔案
已經幫你分好三種資料夾了
方便管理css檔, js檔, 一般圖檔

routes資料夾跟views資料夾
routes資料夾，放load路徑的檔案，比方說我們可能設定首頁去load routes的index.js檔。
views資料夾放ejs的檔案。