この記事では、Webアプリ開発未経験者がC#を使用して初めてアプリを作成し、そのアプリをAzureを使用してクラウド上で公開するまでの手順を紹介します。
1.開発環境
- OS:Windows
- IDE:MicrosoftVisualaStudio 2022
- フレームワーク:ASP.NET MVC
- ORMツール:Entity Framework
- クラウドプラットフォーム:Microsoft Azure
- DBツール:A5:SQL Mk-2
2.開発アプリについて
今回はUdemyの講座でC#を学びながら、作成した簡単なToDoアプリを使用しました。
ToDoアプリの機能概要
・ログイン認証機能 ※新規ユーザー登録機能無し
・ToDoリストの新規作成、詳細登録、削除
3.アプリをクラウド上に公開してみた
ToDoアプリが完成したので、さっそくMicrosoft Azureを使いクラウド上にアプリを公開していく手順を説明していきます!
1.VisualStudioからMicrosoftAzureにAppServiceとSQLサー
バーを作成、接続
①VisualStudioを開きソリューションエクスプローラーのアプリ名のところで右クリ
ック、発行を選択する。
②公開画面→新規作成→Azure→AzureAppService(Windows)→設定項目を入力→作成
AzureのAppServiceが完成!
③公開画面→サービスの依存関係→SQLServerデータベースの接続するを選択→
AzureSQLDatabase→新規作成→各設定をして作成
依存関係の構成の進行状況が終わるとAzureにSQLデータベースが完成!
④その他にAzureでIPアドレス、ファイアウォール、サブネット、仮想ネットワーク
設定をする。
2.AppサーバーのSQL認証を行いSQLデータベースの接続
①ツール→NuGetパッケージマネージャー→パッケージマネージャー コンソール
を開いて
Update-Database ConnectionString "データベース接続文字列" -ConnectionProviderName “System.Data.SqlClient”
を入れる。
【データベース接続文字列
の取得】
SQLデータベースから”データベース接続文字列の表示”を選択。
画像内のADO.NET(SQL認証)をすべてコピー、文字列内のPasswordは{~}削除し、データベース作成時のパスワードを入れる。
②Web.configにタグと要素を追加
データベース接続文字列の情報
を入れるための<connectionStrings>
タグ
データベース接続情報を追加するための要素<add>を追加
3.データベース管理ツール(A5SQL Mk-2)を使用し、Azure上
のSQLサーバーに接続
①A5SQL Mk-2を開き、データベースの追加と削除から追加を選択し、
MicrosoftSQLServerとSQLServerCompactを選択して各設定を行い接続
最後にWeb上でアプリが正常に動作するか確認します!
プロトコルhttps、ログイン画面からサインインしてIndex画面へ
認証のデータベース実装も問題なさそう。
CreateNewからTodoの追加も確認ができ動作も正常そうなので
これでAzureを使用してWebアプリの公開が完了です!
4.Webアプリの作成、公開を終えて
はじめてのWebアプリ開発で.NET MVCはGUIの要素を取り入れたプログラミンでC#,HTML,CSSを新たに楽しく学べることができました。Azureを使ったクラウド上への公開作業はすごく苦手なところでしたが色々な開発をするうえでは必要不可欠なたくさんの情報と知識が増え、またWeb上でアプリを確認できたことの達成感がありました!