{"id":20619764,"url":"https://github.com/twtrubiks/deploying-flask-to-heroku","last_synced_at":"2025-08-25T21:07:12.969Z","repository":{"id":84518912,"uuid":"80339183","full_name":"twtrubiks/Deploying-Flask-To-Heroku","owner":"twtrubiks","description":"Deploying a Flask App To Heroku Tutorial","archived":false,"fork":false,"pushed_at":"2019-08-28T13:41:28.000Z","size":208,"stargazers_count":93,"open_issues_count":0,"forks_count":52,"subscribers_count":4,"default_branch":"master","last_synced_at":"2025-04-15T12:16:21.864Z","etag":null,"topics":["deploy","flask","heroku","python","tutorial"],"latest_commit_sha":null,"homepage":null,"language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/twtrubiks.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2017-01-29T10:02:13.000Z","updated_at":"2024-08-20T01:58:40.000Z","dependencies_parsed_at":null,"dependency_job_id":"375596d7-8ed7-41f2-926b-12ad5797d6fe","html_url":"https://github.com/twtrubiks/Deploying-Flask-To-Heroku","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/twtrubiks/Deploying-Flask-To-Heroku","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/twtrubiks%2FDeploying-Flask-To-Heroku","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/twtrubiks%2FDeploying-Flask-To-Heroku/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/twtrubiks%2FDeploying-Flask-To-Heroku/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/twtrubiks%2FDeploying-Flask-To-Heroku/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/twtrubiks","download_url":"https://codeload.github.com/twtrubiks/Deploying-Flask-To-Heroku/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/twtrubiks%2FDeploying-Flask-To-Heroku/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":272131802,"owners_count":24878988,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-08-25T02:00:12.092Z","response_time":1107,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["deploy","flask","heroku","python","tutorial"],"created_at":"2024-11-16T12:12:27.885Z","updated_at":"2025-08-25T21:07:12.927Z","avatar_url":"https://github.com/twtrubiks.png","language":"CSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Deploying-Flask-To-Heroku\n\nDeploying a Flask App To Heroku Tutorial 📝\n\n* [Youtube Demo](https://youtu.be/fidKOYWWfkM)\n* [How to use Heroku Postgres deploying](https://youtu.be/OvQetdMN88E)\n\n今天教大家如何佈署 Flask App 到 [Heroku](https://dashboard.heroku.com/)\n\n[Heroku](https://dashboard.heroku.com/) 免費版本\n\n* 可以創造 5個 app。\n* 24小時一定要休息6小時的規定。\n* 支援很多種程式語言。\n* 有SSL(https)。\n\n更多說明請參考 [Heroku](https://dashboard.heroku.com/)\n\n## 教學\n\n### 步驟一\n\n先註冊 Heroku 帳號，請到 [Heroku](https://dashboard.heroku.com/)  註冊\n\n### 步驟二\n\n請安裝 [Heroku CLI](https://devcenter.heroku.com/articles/heroku-cli#download-and-install) (請選擇符合自己得作業系統，這裡用 Windows 介紹)\n\n安裝過程，如果已經有安裝過 [Git](https://git-scm.com/) ，可以把勾勾拿掉，\n\n![alt tag](http://i.imgur.com/A3QLRpA.jpg)\n\n安裝完後，請使用你的 cmd (命令提示字元) 輸入以下指令\n\n```cmd\nheroku --version\n```\n\n如果安裝正確，會跳出你安裝的 Heroku CLI 版本\n\n![alt tag](http://i.imgur.com/UuWGUk1.jpg)\n\n接著再請你使用你的 cmd (命令提示字元) 輸入你的 [Heroku](https://dashboard.heroku.com/) 帳號  和 密碼\n\n```cmd\nheroku login\n```\n\n![alt tag](http://i.imgur.com/6vtoORM.jpg)\n\n### 步驟三\n\n請先 clone 我的簡單 flask 範例\n\n```cmd\ngit clone https://github.com/twtrubiks/Deploying-Flask-To-Heroku.git\n```\n\n在資料夾裡，有幾個比較重要的檔案，分別為\n\n* requirements.txt\n* Procfile\n* runtime.txt\n\n#### requirements.txt\n\n這個檔案是要告訴 [Heroku](https://dashboard.heroku.com/) 你的環境需要那些其他的套件\n\n你可以使用 cmd (命令提示字元) 輸入以下指令查看目前電腦所安裝的套件\n\np.s 請安裝你需要的套件即可\n\n```cmd\npip freeze\n```\n\n![alt tag](http://i.imgur.com/WxuORWB.jpg)\n\n然後可以使用以下指令匯出文字檔 requirements.txt\n\n```cmd\npip freeze \u003e requirements.txt\n```\n\n![alt tag](http://i.imgur.com/mlhGXOk.jpg)\n\n該目錄底下會多出 requirements.txt\n\np.s 可以把不需要安裝的套件從 requirements.txt 裡移除\n\n#### Procfile\n\nProcfile 這個檔案是要告訴 [Heroku](https://dashboard.heroku.com/) 要如何啟動這個 web app\n\n在 [Heroku](https://dashboard.heroku.com/) 裡，官方使用 [Gunicorn](http://gunicorn.org/) 來啟動 web server，請參考\n\n[python-gunicorn Heroku](https://devcenter.heroku.com/articles/python-gunicorn)\n\n所以在 **requirements.txt** 裡，請記得要輸入 [gunicorn](http://gunicorn.org/)\n\nProcfile 檔案，基本使用方法如下\n\n```text\nweb gunicorn app_run:app\n```\n\napp_run 就是你的 app_run.py，請依照自己設定的名稱自行修改\n\n#### runtime.txt\n\nruntime.txt 檔案裡，只需要簡單的填入你想要指定的 python 版本\n\n```text\npython-3.4.3\n```\n\n可參考 [Heroku python-runtimes](https://devcenter.heroku.com/articles/python-runtimes)\n\n如果你不想指定 python 的版本，這個檔案可以忽略。\n\n### 步驟四\n\n#### 先創造 Heroku application\n\n方法一 :\n\n使用你的 cmd (命令提示字元) 輸入以下指令\n\n```cmd\nheroku create\n```\n\n![alt tag](http://i.imgur.com/OJS8K3N.jpg)\n\np.s 你看到的網址會和我看到的不一樣，請輸入你看到的\n\n方法二 :\n\n到網頁上新增一個 [Heroku application](https://dashboard.heroku.com/new?org=personal-apps)\n![alt tag](http://i.imgur.com/8KVzbfD.jpg)\n\n#### 初始化\n\n使用你的 cmd (命令提示字元) 切換到目錄底下，先著初始化\n\n```cmd\ngit init\n```\n\n#### 佈署\n\n指定 remote\n\n```cmd\nheroku git:remote -a tranquil-earth-29753\n```\n\ntranquil-earth-29753 這是我自己的，請輸入你的\n\n這些指令你可以在 web app 裡的 deploy 看到\n\n![alt tag](http://i.imgur.com/hQ5FN7A.jpg)\n\n基本上就是 git 的操作，如不清楚什麼是 [Git](https://git-scm.com/)\n\n可以參考我之前寫的 [Git-Tutorials](https://github.com/twtrubiks/Git-Tutorials)\n\n```cmd\ngit add .\ngit commit -am \"make it better\"\ngit push heroku master\n```\n\n![alt tag](http://i.imgur.com/pRC4WGW.jpg)\n\n![alt tag](http://i.imgur.com/gPaK7kd.jpg)\n\n佈署完畢，網址的格式為，如上面這張圖\n\n```url\nhttps://[ 你的 app 名稱 ].herokuapp.com/\n```\n\n例如我的網址格式為\n\n```url\nhttps://tranquil-earth-29753.herokuapp.com/\n```\n\ncommit ID [4a42e26aee2bff1b10247d7e8a75d4d86b0c83b8](https://github.com/twtrubiks/Deploying-Flask-To-Heroku/tree/4a42e26aee2bff1b10247d7e8a75d4d86b0c83b8)\n\n## 畫面\n\n如果使用我的範例佈署成功，畫面應該如下\n\n我的網址為 [https://tranquil-earth-29753.herokuapp.com/](https://tranquil-earth-29753.herokuapp.com/)\n\n![alt tag](http://i.imgur.com/WGjBKEJ.jpg)\n\n## LOG 資訊\n\n**log 的資訊非常重要** ，因為有時候本機端可以正常運行，但佈署上去就無法運行，\n\n所以這時候就要看 log 資訊。\n\n可以使用以下指令查看你在 heroku上 的 web app 的 log\n\n```cmd\nheroku logs\n```\n\n![alt tag](http://i.imgur.com/1Oe5rER.jpg)\n\n或是可以從網頁端查看\n\n![alt tag](http://i.imgur.com/NmyRvxs.jpg)\n\n網址格式為\n\n```url\nhttps://dashboard.heroku.com/apps/[ 你的 app 名稱 ]/logs\n```\n\n## 如何在 heroku 上使用 database\n\n請先到下列網址建立 database\n[heroku addons](https://elements.heroku.com/addons)\n\n你會看到很多 db ，這裡用 Heroku Postgres 當作範例\n\n![alt tag](http://i.imgur.com/AxoKeka.jpg)\n\n接著安裝就行了，如果你還沒有登入，他會請你先登入\n\n![alt tag](http://i.imgur.com/FCaqoPB.jpg)\n\n選擇你的 db 是要給哪個專案用的\n\n![alt tag](http://i.imgur.com/BQZVgjc.jpg)\n\n接著選擇方案，這裡選擇 FREE 方案\n\n![alt tag](http://i.imgur.com/jleHgxw.jpg)\n\n接下來你就會看到 DB 已經被建立了\n\n![alt tag](http://i.imgur.com/aa1kX6o.jpg)\n\n點擊他，就可以跳到下面的畫面\n\n![alt tag](http://i.imgur.com/eGQKDg1.jpg)\n\n接著按 View Credentials\n\n![alt tag](http://i.imgur.com/HuHQUvm.jpg)\n\n可以看到自己 db 的一些資料，包含 帳號、密碼 資訊\n\n![alt tag](http://i.imgur.com/roGcz1i.jpg)\n\n現在我們來建立 DB 的 TABLE\n\n先將 URI 這個很長的連接字串，貼到 [dbModel.py](https://github.com/twtrubiks/Deploying-Flask-To-Heroku/blob/master/dbModel.py) 裡面\n\n```python\napp.config[\n    'SQLALCHEMY_DATABASE_URI'] = 'postgres://XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX'\n```\n\n請貼自己的連接字串!!!\n\n之後，我們使用 [Flask-Migrate-Tutorial](https://github.com/twtrubiks/Flask-Migrate-Tutorial) 來建立  DB 的 TABLE，\n\n如果不懂，請參考  [Flask-Migrate-Tutorial](https://github.com/twtrubiks/Flask-Migrate-Tutorial) 範例。\n\nP.S 假如你和我一樣是使用 PostgreSQL ， 需要額外安裝套件 [psycopg2](http://initd.org/psycopg/)\n\n```cmd\npip install psycopg2\n```\n\n一切處理完畢之後，再進行部屬就完成了。\n\n下圖為簡單的範例  [Demo](https://flask-demo-test.herokuapp.com/index)\n\ncommit ID [ce4c8ee68f58c861a5a8072793912b204c186906](https://github.com/twtrubiks/Deploying-Flask-To-Heroku/tree/ce4c8ee68f58c861a5a8072793912b204c186906)\n\n![alt tag](http://i.imgur.com/j1JAKS4.jpg)\n\ndatabase information 就是將 db 的資料全部顯示出來\n\n![alt tag](http://i.imgur.com/a6F14Aw.jpg)\n\n## Heroku 注意事項\n\n因為 heroku 的關係，有些人可能會遇到佈署失敗的問題，可以試著將 [runtime.txt](https://github.com/twtrubiks/Deploying-Flask-To-Heroku/blob/master/runtime.txt)  修改為 3.6.2\n\n## 執行環境\n\n* Windows 10\n\n## Reference\n\n* [Heroku](https://dashboard.heroku.com/)\n\n## Donation\n\n文章都是我自己研究內化後原創，如果有幫助到您，也想鼓勵我的話，歡迎請我喝一杯咖啡:laughing:\n\n![alt tag](https://i.imgur.com/LRct9xa.png)\n\n[贊助者付款](https://payment.opay.tw/Broadcaster/Donate/9E47FDEF85ABE383A0F5FC6A218606F8)\n\n## License\n\nMIT license\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftwtrubiks%2Fdeploying-flask-to-heroku","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftwtrubiks%2Fdeploying-flask-to-heroku","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftwtrubiks%2Fdeploying-flask-to-heroku/lists"}