Node.js + MongoDB建立最愛球員清單

※ 專案起源

建立一個屬於自己喜愛球員的清單。

※ 成果發表

※ 專案開發環境

1. 架設 Node.js 伺服器。

原因：為了讓我所使用的程式語言JavaScript ，擁有能夠開發網路應用程式的能力，所以我用Node.js 來架設伺服器。

優點：

• 有了 Node.js，JavaScript 可以直接建立、讀取、修改和刪除電腦內的檔案，並且能和資料庫連通。
• Node.js具有網路應用程式需要的功能，例如作為伺服器處理用戶端發出請(request) 並給予回應 (response) 等。

2. 用 Express.js 進行全端開發。

原因：Express 提供了一個強大的路由系統、豐富的內建中間件、使用模板引擎來動態生成 HTML等優點，讓程式碼更簡潔，開發速度更快速。

優點： 有了「網路框架」 (web framework) 讓我能夠分割負責不同功能的程式碼，以增加每一份檔案的易讀性，也讓程式碼更容易被維護。

3. 用 MongoDB 資料庫。

原因：

• 現階段使用者最多、生態系也最完整的文件資料庫。
• 用 Express.js 開發應用程式時，會希望能直接用 JavaScript 操作資料庫，而不需要另外撰寫 SQL。

※ 專案開發技術

• 使用 Express handlebars，為球員清單做出佈局和局部樣板的畫面。

•  套入 Bootstrap在球員清單 的 HTML。
• 將Handlebars 的語法跟原有的 HTML 語法與格式配合，顯示動態資料：圖片連結 - player.image 是放在 src = "{{this.images.index}} " 裡面
• 在 handlebars 樣板中使用 each 迴圈，呈現多筆球員資料。
• 讀取 JSON 檔案 ，將外部資料帶入樣板引擎中，讓網頁呈現出 50位球員資料。
• 使用 :params 來取得網址資訊的路由，建立動態路由讓使用者可以在瀏覽器畫面上看到自己在網址列所輸入的內容。
• 透過 req.query 取得網址 ? 後方的查詢字串（queryString）
• 運用CRUD 功能，呈現瀏覽所有或特定球員資料，新增、修改和刪除球員資料。
• 依照RESTful 風格優化路由設計。
• 設定 express-session，來判斷使用者的登入狀態。
• 設定 Passport.js，完成登入功能。
• 運用middleware驗證登入狀態。
• 使用 connect-flash 來建立快閃訊息 (flash message)，作為提示使用者。
• 使用 bcrypt 處理密碼，讓使用者在登入和註冊時輸入的密碼。
• 整合 Facebook 第三方登入。
• Promise.all 語法結構重構種子資料 。

※ 專案功能

使用者可以在首頁看到所有球員的簡單資料：

1. 球員照片

2. 球員名稱

3. 球員背號

使用者可以再點進去看球員的詳細資訊：

1. 英文名字

2. 職位名稱

3. 身高

4. 體重

5. 學歷

6. 出生年月日

使用者可以透過搜尋球員名稱來找到特定的球員

使用者可以透過搜尋職位名稱來找到特定的球員

使用者可以新增一位球員

使用者可以瀏覽一位球員的詳細資訊

使用者可以瀏覽全部所有球員

使用者可以修改一位球員的資訊

使用者可以刪除一位球員

使用者可以註冊

使用者可以登入

使用者可以透過Facebook Login 直接登入