SQL Server Management Studio (SSMS)とAzureを使用して、非常にシンプルなデータベースアプリケーションを作成する手順を説明します。
本記事では例として「ユーザーが名前を入力してデータベースに保存し、保存した名前を表示する」という簡単なWebアプリを作成する手順をご紹介します。
事前準備
AzureにSQL Databaseを作成する方法およびSQL Server Management Studio（SSMS）のインストール方法は割愛します。
※ 必要に応じて過去の記事をご参照ください。
SSMSによるデータベースへの接続と準備
SQL Server Management Studio (SSMS) を使用してAzure SQL Databaseに接続してデータの構造を定義し、アプリケーションを利用するための準備を行います。
Azure SQL Databaseに接続
1. SSMSの接続ウィンドウが表示されたら、必要な認証情報（ユーザー名とパスワード）を入力し、[接続]をクリックします。
※必要に応じて、Azureポータルでファイアウォール設定を行ってください。
テーブルの作成
1. 接続後、[新しいクエリ]をクリックし、クエリウィンドウを開きます。
2. クエリウィンドウを開いたら、SQL文を入力し、テーブルを作成します。
CREATE TABLE Users (
Id INT IDENTITY(1,1) PRIMARY KEY,
Name NVARCHAR(100) NOT NULL
);
3. SQL文を入力したら[実行(X)]をクリックします。
4. 赤枠内の[メッセージ]に以下のような内容が表示されることを確認します。
コマンドは正常に完了しました。 完了時刻: 2025-05-21T14:35:48.8433381+09:00
Node.jsを使ったアプリケーションの作成
続いて、サーバーサイドのJavaScript実行環境であるNode.jsを使用して、データベースと連携する簡単なWebアプリケーションを作成します。
Node.jsのインストール
アプリケーションに必要なパッケージをインストールし、Webブラウザ経由でデータベースにアクセスするための基盤を整えます。
今回は、クライアントPCにNode.jsをインストールし、Azure SQL Databaseと接続します。
※ すでにNode.jsの実行環境がある場合、本章はスキップしてください
1. Node.jsの公式サイトから、最新のインストーラーをダウンロードしてインストールします。
2. ダウンロードした[node-v22.15.1-x64.msi]をダブルクリックし、インストールを開始します。
3. インストールウィザードに従い、[Next]をクリックします。
4. インストールが完了したら、[Finish]をクリックします。
インストールの確認
1. コマンドプロンプトまたはPowerShellを開き、次のコマンドを実行してインストールを確認します。
※ バージョン番号が表示される場合はインストールされていますが、表示されない場合はNode.jsがインストールされていません。
node -v v22.15.1
プロジェクトフォルダの作成
アプリケーションに関連するすべてのファイルを整理するためのプロジェクトフォルダを作成します。
1. 任意の場所に新しいフォルダを作成します。今回は[SimpleDBApp]という名前のフォルダを作成します。
npmプロジェクトの初期化
package.jsonファイルを作成します。このファイルは、プロジェクトの初期化、依存関係の管理、プロジェクト設定の記述で利用します。
1. 作成したフォルダを右クリックし、「ターミナルで開く」というオプションを選択し、以下のコマンドを実行します。
npm init -y
必要なパッケージのインストール
今回は以下のパッケージをインストールします。
- mssql
- Azure SQL Databaseと接続してデータ操作を行うためのライブラリです。
- このパッケージを使用して、データベースにクエリを送信することができます。
- body-parser
- HTTPリクエストボディをJavaScriptオブジェクトとして解析するためのミドルウェアです。
- クライアントから送信されたデータを容易に取得できます。
- mssql
- Azure SQL Databaseと接続してデータ操作を行うためのライブラリです。
- このパッケージを使用して、データベースにクエリを送信することができます。
インストールの手順です。
1. npmプロジェクトの初期化手順と同じく「ターミナルで開く」というオプションを選択し、以下のコマンドを実行します。
npm install express mssql body-parser
スクリプトの作成
スクリプトを作成することで、Node.jsを使ったWebアプリケーションの基本機能を実装し、ユーザーからのリクエストに応じてデータベースと連携できるようにします。
1. プロジェクトフォルダ内に index.js という名前のファイルを作成し、以下のコードを貼り付けます。、
※ Azure SQL Databaseの接続情報は環境に合わせて修正してください。
const express = require("express");
const bodyParser = require("body-parser");
const sql = require("mssql");
const app = express();
const port = 3000;
// ボディをパースするためのミドルウェア
app.use(bodyParser.urlencoded({ extended: true }));
// データベース接続設定
const config = {
user: "<ユーザー名>",
password: "<パスワード>",
server: "<サーバー名>.database.windows.net",
database: "<データベース名>",
options: {
encrypt: true // Azureの場合は必ずtrue
}
};
// ルートエンドポイント
app.get("/", (req, res) => {
res.send(`
<form action="/submit" method="POST">
<input type="text" name="name" required>
<button type="submit">名前を保存</button>
</form>
`);
});
// フォーム送信後の処理
app.post("/submit", async (req, res) => {
try {
const { name } = req.body;
let pool = await sql.connect(config);
await pool.request().query(`INSERT INTO Users (Name) VALUES ('${name}')`);
res.send(`名前 '${name}' が保存されました！`);
await pool.close();
} catch (err) {
res.status(500).send("エラー: " + err);
}
});
// サーバーを起動
app.listen(port, () => {
console.log(`サーバーは http://localhost:${port} で実行中`);
});
index.jsを作成後の最終的なフォルダ構成は以下のようになります。
アプリケーションの起動とテスト
アプリケーションの基本的な動作確認と、ユーザー入力のデータベース保存機能が正常に動作することを確認します。
アプリケーションを使用可能な状態にする
まず、アプリケーションを使用可能にするために、以下のコマンドを実行し、アプリケーションが指定したポート（例: 3000）で待機するようにします。
1. ターミナルで以下のコマンドを実行して、サーバーを起動します。
node index.js
2. コマンド実行後に以下のメッセージが表示され、サーバーが正常に動作していることを確認できます。
サーバーは http://localhost:3000 で実行中
アプリケーションからデータベースにデータを保存する
サーバーが正常に動作していることを確認したら、ブラウザを開き、サーバーが提供するホームページ（フォーム）を確認します。
1. http://localhost:3000 にアクセスします。
2. [hoge123]という名前を登録します。
3. 名前が保存されたら以下のメッセージが表示されます。
データの確認方法
続いて、データベースとの連携が正しく行われていることを検証するために、アプリケーションで保存したデータが正しいかどうかを確認します。
Azure Portalからの確認
Azure Poralから、対象のSQLサーバーにデータが追加されているかどうかを確認します。
1. 対象のSQLサーバーをクリックします。
2. 概要から[SQLデータベース]をクリックし、対象のデータベースを選択します。
3. SQLデータベースの概要ページから[クエリ エディター（プレビュー）]をクリックします。[ログイン][パスワード]を入力したら[OK]をクリックします。
4. ログインが成功したら[テーブル]をクリックします。
5. [3点リーダー]から[データを編集します（プレビュー）]をクリックすると、入力した名前（hoge123)が追加されていることがわかります。
SQL Server Management Studio (SSMS) での確認
Azureポータルからではなく、SSMSを使って確認する事も出来ます。SSMSで対象のSQLサーバーに接続し、データが追加されているかどうかを確認します。
1. 以下のSQL文を入力し、実行します。
SELECT * FROM Users WHERE Name = 'hoge123';
2.赤枠内の[結果]に以下の内容が表示されることを確認します。
| Id | Name | |
| 1 | 1 | hoge123 |
おわりに
SSMSとAzureを使用したシンプルなデータベースアプリケーション作成方法をご紹介しました。
このアプリは、ユーザーが名前を入力してデータベースに保存し、その結果を表示するというシンプルなもので、初心者の方でも簡単に実装できます。学習用に使うことはもちろんのこと、勤怠管理やタスク管理といった業務ツールの開発の際にもご活用ください。
石黒 允規（日本ビジネスシステムズ株式会社）
ネットワークインテグレーション部に所属しており、主にAzureに関する業務を行っています。 JBS野球部にも所属しており、週末を楽しく過ごしております
担当記事一覧