Web アプリケーション コードを準備する

  • 3 分

このユニットでは、Web アプリケーションのコードを作成し、ソース管理リポジトリに統合する方法について説明します。

Web アプリケーションをブートストラップする

Web アプリケーションをデプロイするためのリソースを作成したので、デプロイするコードを準備する必要があります。 新しい Web アプリケーションをブートストラップする方法は多数あります。そのため、ここで学習する内容は、慣れ親しんでいるものとは異なる場合があります。 目標は、デプロイまでの完全なサイクルを完了するための開始点を迅速に提供することにあります。

Note

このページに示されているすべてのコードとコマンドは、説明するためだけのものであり、実行する必要はありません。 これらは、後続の演習で使用します。

.NET SDK の一部である dotnet コマンドライン ツールを使用すると、新しい Web アプリケーションのコードを直接作成できます。 特に、dotnet new コマンドを使用して、テンプレートから新しいアプリケーションを生成することができます。

dotnet new mvc --name <YourAppName>

このコマンドを実行すると、新しい ASP.NET Core Model-View-Controller (MVC) アプリケーションが、指定された名前で新しいフォルダーに作成されます。

スターター Web アプリケーションを短時間で作成するには、Java エコシステムでよく使用される Maven (mvn) コマンドライン ツールを使用できます。 特に、Maven には、"アーキタイプ" と呼ばれる機能が含まれます。これにより、テンプレートを使って、さまざまな種類のアプリケーションのスターター コードをすばやく作成できます。 maven-archetype-webapp テンプレートを使用して、そのホームページに "Hello World!" を表示する、単純な Web アプリのコードを生成できます。

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

このコマンドを実行すると、アプリケーションのソース コードを含む helloworld フォルダーが作成されます。

Node.js にバンドルされている Node Package Manager (npm) コマンドライン ツールを使用して、新しいアプリケーションを作成できます。 init コマンドを実行すると、アプリケーションに必要な新しい package.json が作成されます。

npm init -y

現在のフォルダー内に作成された package.json ファイルを開いた場合は、start エントリを scripts セクションに追加して、Web アプリケーションの実行方法を記述できます。

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

これを完了すると、Web アプリケーションの実際のコードを新しい index.js ファイルに記述できます。

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 アプリケーション スターターを作成するには、一般的に使用される Web アプリケーション フレームワークである Flask を使用します。 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 にアプリケーションをデプロイできることは要件ではありません。

注意

CI/CD を使用すると、コードを変更するたびのビルド、テスト、デプロイを自動化することで、信頼性の高い方法でより頻繁にコードをデプロイできます。 これにより、アプリケーションの新しい機能とバグ修正をより迅速かつ効率的に配信できます。