動手建置你的個人網站! Azure App Service 手把手教學
Part 1. Azure App Service 是什麼
Azure App Service 是 Azure 平台服務，能夠將您的 .NET、.NET Core、Java、Node.js、Python、PHP 和 Ruby 程式碼打包部署到雲端容器中，也可以透過 Azure DevOps, Github 等進行自動部署。
同時，Azure App Service 也擁有自動垂直擴容和水平擴容的能力，可以應付尖離峰的流量需求，也因為以上的特性，App Service 一直都是我的客戶使用服務排行榜中名列前茅的服務。
Part 2. Azure App Service 建置與設定
Azure App Service 可以快速將程式碼部署上到雲端容器，非常適合用來建置網站，今天的教學有將維持一貫的傳統，希望在盡可能減少程式碼撰寫的前提下實作本次教學。
今天我們將帶來一個完整的部署流程，包含將 Github 上的 Python Flask 網站程式碼連接到 Azure App Service 中，並將其設定並部署成為網站!
首先第一步，你必須要有一個 Azure 帳號，如果你還沒有 Azure 帳號，可以透過信用卡申請 200 美金的免費額度，如果你是學生，則不需要信用卡就可以申請免費的 100 美金，我將過去寫的 Azure 免費額度申請教學連結放在此處。
有了 Azure 帳號後，首先讓我們登入到 Azure 的環境: portal.azure. com
點擊左上的「建立資源」並在搜尋框輸入 「Web 應用程式」就會找到這個服務，他就是我們今天的主角啦!
點擊建立後，我們需要輸入此服務的設定細節，完成這個頁面的設定後，就可以部署此服務啦!
首先，我們先新增一個「資源群組」，資源群組跟資源之間的關係，簡單比喻就類似班級跟學生的概念，可以想像每個資源(學生)都需要對應到一個資源群組(班級)，但一個資源(學生)只能屬於一個資源群組(班級)，一個資源群組(班級)卻可以有很多資源(學生)，彼此之間存在這樣的從屬關係。
接著，我們要為這個服務的執行個體建立名稱以及對應的訂價層，也就是服務的收費方式，名稱同樣可以按照自己的喜好建立。另外，我們還需要選擇未來部署這個容器的方式是透過代碼或其他方式以及使用的程式語言。
因為我們是使用 python flask 建置的網站框架，我們在此處選擇「代碼」&「python 3.7」，地區則可以自由選擇。
接下來我們要建置 App Service 的方案，這項參數會決定未來 App Service 的服務能力，可以分為開發/測試、生產環境等不同規格，每個規格中也可以依照 CPU 及記憶體細分規格，本次我們選擇免費的 F1 定價層，另外需要注意，免費層級的定價層無法進行擴展以及自定網域。
設定完成後，點選「檢閱 + 建立」，點擊後畫面會自動跳轉進行服務的驗證，驗證通過後就可以點選「建立」，同樣的，畫面也會自動跳轉，開始進行服務的部署。這個步驟大約需要五分鐘的時間來完成建立。
建立完成後，點選「前往資源」，畫面就會跳轉到我們建置好的 App Service 服務，可以看到系統已經為我們指派好一組網站 URL 同時下方有一些簡單的 metrics 方便即時掌握使用狀況。
Part 3. 開始使用 App Service 建置網站
點選左側「部署中心」並選擇來源為「Github」，可以看到 CI/CD 的選項中除了 Github 外，也包含 Git, Bitbucket 等來源提供大家選擇
選擇 Github 後，會需要登入自己的 Github 帳號並將專案位置連結，以方便系統抓取程式碼並自動進行部署。
如果還沒有 Github 的朋友，可以申請一個帳號，並 folk 我已經寫好的 python flask 專案，內含本次要使用的網站程式碼，專案連結請點選此處。
選擇 folk 後，回到 Azure App Service 部署中心登入 Github 並選擇到剛剛 folk 好的專案，最後點選右上角的「儲存」。
儲存後，系統就會自動開始進行連接，此時系統會到 Github 中連接專案程式碼並自動撰寫 yaml 檔案進行部署。
從部署中心的紀錄中可以看到部署進度，此時點選「建置/部署紀錄」或到 Github 專案中點選「Actions」也都可以看到詳細的 pipeline 部署進度。
部署成功後，回到 Azure App Service 的「概觀」頁面，再點選右邊的 URL。
江江! 成功啦! 我們的網站已經完成部署而且可以顯示了!
Part 4. 總結
本篇教學透過 Github 程式碼結合 Azure App Service 在短時間內建立網站，若您具備 flask 開發能力，更可將您自己的程式碼上傳到 Github 而不需要 folk 我的程式碼，成功建置出一個網站是不是很有成就感呢!
如果你覺得這系列的文章對你有幫助的話，請不吝拍手或留言，你的支持是我寫 Medium 的最大動力。
