做好發佈前的準備後，接著可以將產品託管在 主機供應商(hosting provider)，此教材選擇了 Heroku，為一個有提供 資源受限的永久免費 選項的 雲端 PaaS 服務（Platform as a Service）。其已將大部分生產環境設置好，較易上手、成本低，但靈活性也較低。因此適合此處選來演示學習成果。

Git repository

Heroku 需通過 Git 添加一個名為 heroku 的 git remote，來指向在 Heroku雲端的 repository。並使用 Git 來上傳/同步所做的任何更改。

• 在 GitHub 建立新的 repository。
• 在電腦上安裝 git。
• 輸入指令將 Git repository 複製到你的電腦（local repository）：
  git clone https://...你的Git repository的 URL
  （URL 可在右邊的 Clone or download按鈕 上取得。）
• 將你的產品（其中不包括 /node_modules - 因為將由 Heroku 提供）複製到該資料夾。
• 因為 git 不會自動追蹤新建立的檔案，需以指令 git add -A 將所有檔案列入追蹤。
• 以指令 git status 查看版本庫狀態，來檢查你將要 commit 的檔案是否正確。
• 確認無誤後，以指令 git commit -m '你的註解'，將檔案 commit 到 local repository。
• 最後再以指令 git push origin master，將 local repository 同步到 Git repository 。

Update the app for Heroku

為了讓 app 能在 Heroku 上運行，需要做一些調整。

• 設定 Node 版本：在 Heroku 上運行，Node 是由其配置，須告知使用哪個版本，因此需在 package.json 上新增該項目。

"version": "0.0.0",
"engines": {
  "node": "10.15.3"
},
"private": true,

• 設定 Database 配置：一般建議在 開發 ＆ 產品 使用不同的 Database，為了能彈性使用不同的 Database，改成使用 環境變數 來設定 Database 的配置。

const mongoDB = process.env.MONGODB_URI || process.env.MONGODB_DEV

（這裡原文教學將開發用的Database寫在code裏頭，後來隔天研究git時，想想不太對，應該不能把任何金鑰寫進code，因此我先暫時把兩個都寫在環境變數裏頭。參考）

• 安裝 dependencies 並測試：做任何改變後，都須測試是否一切符合預期。而此處沒有 dependencies ，因此需重新安裝來使用。
• 更新上 Github：最後再將更新的部分保存進 Github，並註解這次更新的版本所做的操作（調整以配合在heroku上運行）。

Deploy on Heroku

• 首先需要註冊帳號、安裝client
• 建立 Heroku repository：也就是在我們的 git 環境，建立了一個名為 heroku 的 git remote（指向 remote repository 的 pointer）。
  （以指令 heroku create 執行）
  （可以自訂名稱，或是隨機生成。名稱將會用來生成你的 URL。）
  第一次創建，會要求你導向登入頁面，並登入：
  （heroku: Press any key to open up the browser to login or q to exit:）
  
• 同步 app 到 Heroku repository：將上傳 app、獲取 dependencies，並打包到 dyno，並啟動站點。
  （以指令 git push heroku master 執行）
• 打開網站：成功啟動站點後，可以指令打開瀏覽器進入網站，或是使用URL進入網站。
  （以指令 heroku open 執行）
• 設置環境變數：
  • 將 NODE_ENV 設定為 production：
    heroku config:set NODE_ENV='production'
  • 用前面所學的方法為 production 建立獨立的 database。並設定 MONGODB_URI：
    heroku config:set MONGODB_URI='你新的 MongoDB 的 URL'
    （看起來建立第二個需要付費，因此我暫時先直接用原本的。）
  • 每次設定完 環境變數，heroku 都會重新啟動。可以用 heroku config 查詢已設定的 環境變數。
• Heroku也提供許多 addons 可加以利用。
• Heroku也提供一些 debug 方法：
  • heroku logs：列出當下所有的 log。
  • heroku logs --tail ：列出當下所有的 log，並持續更新。
  • heroku ps：列出 dyno 的狀態。（如：其剩餘使用時間）
  • heroku git:remote -a '你的專案名字'：重新將 git 連接到 heroku 的專案

到目前為止，總算是完成了 The Local Library website 的教學啦，今天將我的圖書館網站成功發佈上線，並放上我的GitHub。接下來將繼續學習其他部分並以此圖書館網站來實踐，增加其完整度。

小插曲：最近發現，當 npm 有新版本時，在你使用後，會出現提示訊息告訴你。