ASP.NET Razor Pagesで最初のプロジェクトを作成しよう！超初心者でも迷わない完全手順
生徒
「ASP.NET Razor Pagesって聞いたことはあるんですが、最初のプロジェクトってどうやって作るんですか？」
先生
「Razor Pagesは、画面と処理がセットで考えられるので、初心者にもとても向いています。」
生徒
「パソコン操作もあまり得意じゃないんですが、大丈夫でしょうか？」
先生
「大丈夫です。電源を入れてマウスを動かすところから、順番に説明していきます。」
1. ASP.NETとRazor Pagesの位置づけを知ろう
ASP.NETは、Microsoftが提供しているWebアプリケーションを作るための仕組みです。 Webアプリケーションとは、インターネットブラウザを使って動くアプリのことです。 例えるなら、ホームページに「考える力」を持たせたものです。
Razor Pagesは、ASP.NET Coreの中にある開発方法のひとつです。 画面（HTML）と処理（C#）をセットで管理できるため、 ノートの1ページに説明と答えが一緒に書いてあるような感覚で理解できます。 そのため、ASP.NET初心者やプログラミング未経験者に特におすすめされています。
2. Razor Pagesで何ができるのか
Razor Pagesを使うと、ログイン画面、問い合わせフォーム、簡単な管理画面など、 日常でよく見るWebサービスを作ることができます。 ボタンを押したら画面が切り替わる、文字を入力したら保存される、 こうした動きをC#という言語で実現します。
難しそうに聞こえますが、Razor Pagesでは「1画面＝1セット」という考え方なので、 迷子になりにくいのが特徴です。 これは、引き出しにラベルが貼ってある状態に近く、 どこに何があるかすぐに分かります。
3. 開発に必要なものを準備しよう
Razor Pagesで開発するために必要なものは、たった2つです。 ひとつはVisual Studio、もうひとつは.NET SDKです。 Visual Studioは、文章を書くためのワープロソフトのようなもので、 プログラムを書くための専用ノートだと考えてください。
.NET SDKは、プログラムを動かすための道具箱です。 料理で例えると、Visual Studioがキッチン、 .NET SDKが包丁やフライパンにあたります。 これらを用意することで、Razor Pagesのプロジェクトが作れるようになります。
4. Visual Studioで新しいプロジェクトを作成する
Visual Studioを起動したら、「新しいプロジェクトを作成」をクリックします。 ここでは「ASP.NET Core Web アプリ」を選びます。 この選択が、Razor Pagesへの入口になります。
次にプロジェクト名を入力します。 これはフォルダの名前なので、日本語ではなく英語で入力しましょう。 例として「RazorPagesSample」などが分かりやすいです。
5. Razor Pagesを選択してプロジェクトを完成させる
プロジェクトの種類を選ぶ画面で、「Razor Pages」を選択します。 認証の種類は「なし」で問題ありません。 ここではログイン機能などは使いません。
「作成」ボタンを押すと、自動でたくさんのファイルが作られます。 これは、最初から使える道具一式が用意された状態です。 初心者が一から作る必要はありません。
6. 最初から用意されている画面を確認しよう
プロジェクトが作成されたら、実行ボタンを押してみましょう。 ブラウザが起動し、サンプル画面が表示されます。 これがRazor Pagesの最初の動作確認です。
@page
@model IndexModel
<h1>Hello Razor Pages!</h1>
<p>これは最初から用意されているページです。</p>
このHTMLに似た書き方がRazor構文です。 HTMLの中にC#を書けるのが特徴です。
7. PageModelで処理を書く基本
Razor Pagesでは、画面と一緒にPageModelという処理用のクラスがあります。 ここにC#のコードを書きます。 画面がノート、PageModelが計算用のメモ帳だと思ってください。
public class IndexModel : PageModel
{
public string Message { get; set; }
public void OnGet()
{
Message = "Razor Pagesへようこそ";
}
}
画面側でこのMessageを表示すると、文字が表示されます。
8. Razor構文でデータを表示してみよう
Razor構文を使うと、C#の値をそのまま画面に表示できます。 これは、紙に書いたメモをそのまま黒板に写すような感覚です。
<p>@Model.Message</p>
Razor Pagesへようこそ
このように、最初のプロジェクトだけでも、 画面表示と処理のつながりをしっかり体験できます。
