[React]環境部署

透過以下的簡易步驟，來部署React網站

以下依照不同的Server列出說明

項次	部署位置	地端/雲端	部署方式	說明
1	Windows Server(iis)	地	手動	本地VM，測試環境或者待管Server時會使用
2	Azure	雲	手動	透過VS Code或FTP去部署
3	Azure	雲	自動	透過CI/CD方式去部署

• Window Server(iis)

1.先設定iis站台的URL Rewrite (SPA網站都可參考此設定)

//Web.config

更多資訊可參考保哥此篇文章說明

2.使用Terminal執行語法npm run build，以產生實體檔(檔案預設放在dist

3.手動搬移檔案至Server

•  Azure (手動上傳)

手動上傳還可區分成VS Code部署以及FTP部署兩種

• VS Code部署

1. 安裝Azure App Service Extension
   
2. 使用語法npm run build產生實體檔(檔案預設放在dist資料夾)
   
3. 使用滑鼠右鍵對選dist資料夾中的Deploy to Web App…
   
4.  點選Sign in Azure
   
5. 選擇登入Azure帳號
   
6. 登入成功後選擇建立Azure App Service段落所建立App Service
   
7. 點選Deploy以部署到 App Service
   
8. 佈署成功可點選右下角的Browse WebSite查看(須過一段時間才能正常顯示)

• FTP部署

1. 使用語法npm run build產生實體檔(檔案預設放在dist資料夾)
2. 從Azure的App Service頁面點選左側的Deployment center。
3.  點選FTP credentials就可以看到FTP的連線設定
4. 使用FTP工具(例.Filezilla)連線並將欲部署的檔案更新上去。

•  Azure (CI/CD)

因CI/CD會被SourceControl的不同影響，待有實作時再回補說明