---
tags: backend, deploy
---
# Heroku 部署 SOP
步驟僅供參考，因為我其實沒有照著這步驟跑過 QQ，都是事後才整理的，不過要做的事情大概就這些，基本上應該不會錯？
1. 註冊 Heroku 帳號，並且填好信用卡資訊：[傳送門](https://signup.heroku.com/)
2. 建立一個新的資料夾，把寫好的作業複製一份到裡面，然後新建 .gitignore，與 package.json


.gitignore：

/node_modules
npm-debug.log
.DS_Store
/*.env

package.json，我直接搬 mtr04 的 package.json 會出錯，所以重新寫一份：

{
  "name": "herukodraw-example",
  "version": "1.0.0",
  "description": "This example is so cool.",
  "main": "index.js",
  "scripts": {
    // 要執行 db:migrate 才會建起資料庫
    "db:migrate": "npx sequelize-cli db:migrate",
    // push 上 Heroku 時會執行 npm run start, 
    // 所以要寫好這個指令, 建立 DB 與 執行 index.js
    "start": "npm run db:migrate && node index.js", 
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [
    "example",
    "heroku"
  ],
  "author": "jane-doe",
  "license": "MIT",
  "dependencies": {
    // 確認好自己用了哪些模組
    "bcrypt": "^5.0.0",
    "body-parser": "^1.19.0",
    "connect-flash": "^0.1.1",
    "ejs": "^3.1.5",
    "express": "^4.17.1",
    "express-session": "^1.17.1",
    "jquery": "^3.5.1",
    "mysql": "^2.18.1",
    "mysql2": "^2.2.5",
    "sequelize": "^6.3.5",
    "sequelize-cli": "^6.2.0"
  },
  "devDependencies": {
    "sequelize-cli": "^6.2.0"
  },
  // 寫給 Heroku 的伺服器看, 他才知道要用什麼執行環境
  "engines": {
    "node": "10.x"
  }
}

3.改寫 index.js 的 PORT

const express = require('express');
const bodyParser = require('body-parser');
const session = require('express-session');
const flash = require('connect-flash');

const prizeController = require('./controllers/prizeController')
const adminController = require('./controllers/adminController')

const app = express();
// 要設定 port 讀取環境變數
const port = process.env.PORT || 3000;
// 以下省略

4. 進入 Heroku 官網建立 APP，取好名字就按 Create app：[傳送門](https://dashboard.heroku.com/new-app)

5. 進入 app 管理頁面，點 Resources 標籤，搜尋 ClearDB，按 Submit Order Form(需要填好信用卡付款資訊，不然不給用)
6. 安裝好 Heroku CLI，需要重開機：[傳送門](https://devcenter.heroku.com/articles/heroku-cli)
7. 開啟 Terminal 輸入 heroku login
11. 輸入 heroku create，這邊會順便設定好 Heroku 遠端 git
8. 輸入 heroku addons:create cleardb:ignite 建立起資料庫
3. 改寫 config.json，這裡要在 production 加一個 use_env_variable，他的值會對應到你的資料庫，像我不小心建了兩個資料庫，所以會是 CLEARDB_RED_URL：

{
  "development": {
    "username": "root",
    "password": null,
    "database": "pool",
    "host": "localhost",
    "dialect": "mysql"
  },
  "test": {
    "username": "root",
    "password": null,
    "database": "database_test",
    "host": "127.0.0.1",
    "dialect": "mysql"
  },
  "production": {
    "username": "root",
    "password": null,
    "database": "database_production",
    "host": "127.0.0.1",
    "dialect": "mysql",
    "use_env_variable": "CLEARDB_RED_URL"
  }
}

我有兩個資料庫 Heroku 管理頁面的 Setting 可以看到

10. 在本機完成 commit

12. 輸入 git push heroku master，將檔案送到 Heroku，成功的話就可以看到網址

## Debug
可以在 Terminal 輸入 heroku logs --tail 來看出了什麼錯
例如，沒改好 PORT，出現錯誤的 PORT 訊息：

## 參考資料
[Deploying Node.js Apps on Heroku](https://devcenter.heroku.com/articles/deploying-nodejs)
[ClearDB MySQL](https://devcenter.heroku.com/articles/cleardb)
[BE201 部署：Heroku](https://lidemy.com/courses/390625/lectures/24510403)