我們的網站是由Docker來架設，

首先先編寫一個Dockerfile。

Dockerfile是一種文本文件，其中包含了一個image的所有指令，從而讓Docker引擎可以自動構建一個包含所需應用程序的映像。也可以說它是一個使用container的說明書，依照環境與使用者需求編寫指令。

Image與container 完成後，這一個完整的docker host就可以與其中的flask程式做溝通，以達成在本地端的瀏覽器上呈現我們的網站。

首先建立一個資料夾，用以放置Dockerfile文件、python flask程式與模型資料。

開啟命令題字元，輸入WSL進入Linux虛擬環境。WSL (Windows Subsystem for Linux) 它是一個適用於Linux的Windows子系統

輸入cd /mnt/c/Users/XXX/website_v7，進入Dockerfile所在的目錄中

輸入docker image build -t bdse29image2 -f ./Dockerfile.txt .

這串指令是透過Dockerfile來建置映像檔。docker引擎會按照dockerfile步驟自動建置映像。

輸入docker container run -dit --name bdse29test4 -p 8082:5000 bdse29image2

-d：參數表示啟動一個後台執行的容器，也就是說容器會在背景執行而不會顯示 log 訊息在終端機上。

-i：參數表示開啟標準輸入（stdin），讓使用者可以跟容器互動。

-t：參數表示開啟一個偽終端（pseudo-TTY），這樣才能進行輸入輸出的互動操作。

-p 8082:5000：參數表示將主機的 8082 port 對應到容器的 5000 port，而我們的flask設定port=5000 ，讓瀏覽器可以透過 [http://localhost:8082](http://localhost:8082/) 訪問我們的網站。

Docker Desktop是運行在Windows和Mac上的一個應用程式，用於管理Docker容器的平台。它允許用戶快速地在自己的本地機器上設置Docker環境，並且可以管理所有Docker資源，包括Docker容器、映像檔和網路等。

Docker Desktop提供了一個簡單、方便的方式來管理Docker容器和映像檔，使得開發人員和系統管理員能夠更輕鬆地使用Docker來開發、測試和部署應用程式。

在docker desktop介面中，進入 bdse29test4 的 Files 區域，可以在目錄/app/中看到我們的app.py檔與templates、static相關資料夾(專題資料透過Dockerfile裡面寫好的步驟，複製到這個container，讓它能夠與主網頁連動，並呈現出來)。

commit 用來將容器轉換為映像檔： docker commit [container-name] [your-dockerhub-username]/[repository-name]:[tag] docker commit bdes29test4 frankwu2023/bdse29appimage4:latest

push用來上傳映像檔： docker push [your-dockerhub-username]/[repository-name]:[tag] docker push frankwu2023/bdse29appimage4:latest

在Docker Hub上上傳Docker容器是免費的，但是如果要將您的網站或應用程式放在網際網路上以供公眾訪問，需要支付相關的費用。需要租用一個網域名稱，以及一個虛擬或實體主機或服務器來託管網站或應用程式。具體費用會根據需求而定。

我們同時也使用ngrok來架設我們的網站， ngrok是一個免費的開放原始碼的工具，它的原理是建立一個反向代理，將本地伺服器連接給公共網路，並將對這個公共網路的請求轉發到本地伺服器上。 指定本地伺服器端口和ngrok的端口。在運行命令之後，ngrok會生成一個公共網址，用於存取本地伺服器的應用程式。在瀏覽器中打開這個網址，就可以預覽和測試本地的應用程式。

首先建置一個Docker虛擬網路，指令: docker network create bdse29network (docker network list可以查看虛擬網路清單)。

隨後將欲連接的網站容器與我透過官方指令所製作的ngrok容器放入docker虛擬網路中，透過設定好的端口將ngrok容器(bdse29ngrok)與我們網頁所在的容器(bdse29web2)連接。

建置指令: docker run --network bdse29network --name bdse29ngrok -e NGROK_AUTHTOKEN=<token> ngrok/ngrok http bdse29web2:5000

因此我們的容器連接就完成了，可以透過ngrok連上我們的網站。