はじめに
ASP.NetのWebアプリケーションを作成したいと思ったのですが、RazorPagesの記事が少なく感じたので、備忘録も兼ねてまとめます。(やはりMVCが主流？)今回はWebサイトの作り方編と銘打って、プロジェクトの作成から初回実行までの手順を説明します。
開発環境
・Windows10 Home x64・ASP.net 6.0
出来上がりのイメージ
開発環境の準備
まずは開発に必要なコードエディターを用意していきます。 今回はASP.Netの開発に適したVisualStudio2022を使用します。まだインストールされていない方はこちらからインストールしてください。
※後から簡単に変更できるので、とりあえずASP.NetとWeb開発だけ選んでインストール
次に.NetのSDKをインストールします。
後から変更するのは少し手間なので、最新バージョンを先にインストールします。
プロジェクトの作成
ASP.Netでは1つのWebサイトを構成するファイルの集合のことを「プロジェクト」と呼びます。プロジェクトはVisualStudioの機能で数クリックで作成可能なので、さっそく作ってみましょう。1. Visual Studio 2022を起動する。
Windows左下の検索バーに「Visual Studio」と入力すると「Visual Studio 2022」が選択できるので、クリックしてください。
2. 「新しいプロジェクトの作成」を選択する。
3. 「ASP.NET Core Web アプリ」を選択する。
「C#」「Web」でソートすると見つかります。「次へ」を選択してください。
4. プロジェクトに名前を付ける。
Webサイトに好きな名前を付けられます。 今回は「SampleWebApp01」にしてみます。
保存するディレクトリも選択できるので、好きな場所を選択して「次へ」を選択してください。(今回はデスクトップのMyWorkフォルダを選択)
5. .NETのバージョンを選択する。
.NETのランタイム(実行環境)を選択できます。 最新バージョンである「.NET 6」を選択して、「作成」を選択してください。
6. プロジェクトが作成される。
↓の画面が表示されていれば大丈夫です。
実行してみる
まだなにもコードをいじってないですが、この段階でWebページとして動かすことが可能です。赤枠の実行ボタンを押して実行します。
以下のページが表示されれば実行成功です。
ヘッダーのHome,Privacyなどをクリックすると規定のページへ移動することができます。Privacyページに移動するとURLが/Privacyに変化していることを確認してください。ASP.Netではプロジェクトのディレクトリ階層をそのままURLに使用します。
実行中のVisual Studioに戻ってPages\Privacy.cshtmlを見てみると、先ほどのPrivacyページのhtmlを確認することができます。(@{}という記載が見られますが、Razor構文というものです。htmlの中でC#の文法を使用することができます。)
さいごに
意外に少ない手順で実行できたのではないでしょうか。 次回はRazorPagesとMVCの違いを確認した後、実際に独自のアプリケーションを実装したいと思います。↓サンプル
お疲れさまでした。
次回