準備 Web 應用程式程式碼

已完成

在此單元中,您將了解如何建立 Web 應用程式的程式碼,並將其整合到原始程式碼控制存放庫。

啟動載入 Web 應用程式

既然您已建立用來部署 Web 應用程式的資源,就必須準備要部署的程式碼。 有許多方式可以啟動載入新的 Web 應用程式,因此,我們會知道這裡看到的內容可能與您使用的不同。 目標是快速為您提供一個起點來完成整個部署週期。

注意

此頁面上顯示的所有程式碼和命令僅供說明之用;您不需要執行任何動作。 我們將在後續練習中加以使用。

dotnet 命令列工具為 .NET SDK 的一部分,可讓您直接為新的 Web 應用程式建立程式碼。 特別是,您可以使用 dotnet new 命令來從範本產生新的應用程式:

dotnet new mvc --name <YourAppName>

此命令會在新的資料夾中,使用指定的名稱來建立新的 ASP.NET Core MVC 應用程式。

為了快速建立起始的 Web 應用程式,您可以使用 Java 生態系統中常用的 Maven (mvn) 命令列工具。 特別是,Maven 包含稱為 archetype 的功能,其可以使用範本,針對不同類型的應用程式,快速建立起始程式碼。 您可以使用 maven-archetype-webapp 範本來產生能在首頁顯示 "Hello World!" 之簡單 Web 應用程式的程式碼。

mvn archetype:generate -DgroupId=example.webapp -DartifactId=helloworld -DinteractiveMode=false -DarchetypeArtifactId=maven-archetype-webapp

此命令會建立 helloworld 資料夾,以包含我們應用程式的原始程式碼。

您可以使用與 Node.js 配套的節點套件管理員 (npm) 命令列工具來建立新的應用程式。 init 命令會建立您應用程式所需的新 package.json

npm init -y

如果您開啟已在目前資料夾上建立的 package.json 檔案,則可將 start 項目新增至 scripts 區段,以描述應該如何執行您的 Web 應用程式:

...
  "scripts": {
    "start": "node index.js"
  },
...

完成後,您可以在新的 index.js 檔案中撰寫 Web 應用程式的實際程式碼:

const http = require('http');
const port = process.env.PORT || 3000;

http.createServer(function(request, response) {
  response.writeHead(200, { 'Content-Type': 'text/plain' });
  response.end('Hello World!');
}).listen(port);

console.log(`Server running at http://localhost:${port}`);

此範例程式碼會建立伺服器來接聽您電腦的連接埠 3000,並使用 "Hello World!" 訊息來回覆每個要求。

若要使用數行程式碼來建立新的起始 Web 應用程式,您可以使用 Flask,這是常用的 Web 應用程式架構。 您可以使用下列命令來安裝 Flask:

pip install flask

當 Flask 可在您的環境中使用之後,您可以使用下列程式碼來建立最基本的 Web 應用程式:

from flask import Flask
app = Flask(__name__)

@app.route("/")
def hello():
    return "Hello World!\n"

此範例程式碼會建立伺服器,以使用 "Hello World!" 訊息來回覆每個要求。

將程式碼新增至原始程式碼控制

在您的 Web 應用程式程式碼準備好之後,下一個步驟通常是將該程式碼放入原始程式碼控制存放庫,例如 Git。 如果您的電腦上已安裝 Git,則在您的原始程式碼資料夾上執行這些命令會將存放庫初始化。

git init
git add .
git commit -m "Initial commit"

這些命令可讓您將本機 Git 存放庫初始化,並使用您的程式碼來建立第一個認可。 您直接獲得的好處是使用認可來保存變更的歷程記錄。 稍後,您也可以同步本機存放庫與遠端存放庫;例如裝載於 GitHub 上。 這可讓您設定持續整合與持續部署 (CI/CD)。 雖然我們建議針對實際執行的應用程式使用原始程式碼控制存放庫,不過這並非將應用程式部署到 Azure App Service 的必要條件。

注意

使用持續整合與持續傳遞,即可透過將每個程式碼變更的組建、測試及部署自動化處理,以可靠的方式提供更頻繁的程式碼部署。 其可讓您更快速且更有效率地為應用程式提供新功能與錯誤 (Bug) 修正。