【ASP.NET Core 2.0】Razor Pages ウェブアプリの作成
ASP.NET Core 2.0がどのようなものなのか、実際にアプリを作成したいと思います。
公式のチュートリアルを沿って行います。
前提条件
- .NET Core 2.0.0 SDK
- ASP.NET および Web 開発ワークロードを含む Visual Studio 2017 バージョン 15.3
- Entity Framework Core 2.0
プロジェクトを作成
[ ファイル ] -> [ 新規作成 ] -> [ プロジェクト ]を選択
[ visual C# ] -> [ Web ] -> [ .NET Core ] -> [ ASP.NET Core Web アプリケーション ]を選択
プロジェクト名を RazorPagesMovie とします。
[ .NET Core ]-> [ ASP.NET Core 2.0 ]-> [ Web アプリケーション ]を選択
ソリューション構成は以下の通りです。
フォルダー/ファイル | 内容 |
---|---|
wwwroot | JavaScript/CSS などの静的ファイル |
Pages | Razor Pagesのフォルダー |
appsettings.json | 構成設定ファイル(ASP.NET MVC の app.config) |
Program.cs | ASP.NET Core アプリをホスティングする。 |
Startup.cs | アプリケーションのサービスを構成する。 |
Pages フォルダの内容
ファイル名 | 内容 |
---|---|
_Layout.cshtml | アプリケーション共通のレイアウト |
_ValidationScriptsPartial.cshtml | jQuery-validation を呼び出す。 |
_ValidationScriptsPartial.cshtml | インポートする名前空間やタグヘルパーなど記述する。 |
_ViewStart.cshtml | ビュースクリプトが呼び出される直前に呼ばれる。 |
Entity Framework Core を使用しデータアクセス機能を作成する
エンティティの追加
[ ソリューション ] -> [ RazorPagesMovie ]を右クリック -> [ 追加 ] -> [ 新しいフォルダー ]
Models にリネーム。
[ Models ]を右クリック -> [ 追加 ] -> [ クラス ]
[ ASP.NET Core ] -> [ コード ] -> [ クラス ]
クラス名は Movie とします。
エンティティクラス Movie を定義します。
using System; namespace RazorPagesMovie.Models { public class Movie { public int ID { get; set; } public string Title { get; set; } public DateTime ReleaseDate { get; set; } public string Genre { get; set; } public decimal Price { get; set; } } }
クラスがレコード、プロパティがカラムに当たります。
IDは主キーとなり、自動で採番されます。
データベースコンテキストの追加
Models フォルダーに MovieContext を追加し、以下のように定義ます。
コンテキストクラスは Microsoft.EntityFrameworkCore.DbContext を継承します。
using Microsoft.EntityFrameworkCore; namespace RazorPagesMovie.Models { public class MovieContext : DbContext { public MovieContext(DbContextOptions options) : base(options) { } public DbSet<Movie> Movie { get; set; } } }
appsettings.json ファイルに接続文字列を追加します。
{ "Logging": { "IncludeScopes": false, "LogLevel": { "Default": "Warning" } }, "ConnectionStrings": { "MovieContext": "Server=(localdb)\\mssqllocaldb;Database=Movie-1;Trusted_Connection=True;MultipleActiveResultSets=true" } }
Startup.cs で DI コンテナーを使用して、データベース コンテキストを登録します。
Microsoft.EntityFrameworkCore と RazorPagesMovie.Models をインポートします。
※ UseSqlServer メソッドが見つからな場合、ソリューションをビルドしてください。
using Microsoft.AspNetCore.Builder; using Microsoft.AspNetCore.Hosting; using Microsoft.Extensions.Configuration; using Microsoft.Extensions.DependencyInjection; using Microsoft.EntityFrameworkCore; using RazorPagesMovie.Models; namespace RazorPagesMovie { public class Startup { // 略 public void ConfigureServices(IServiceCollection services) { services.AddDbContext<MovieContext>(options => { options.UseSqlServer(Configuration.GetConnectionString(nameof(MovieContext))); }); services.AddMvc(); } // 略 } }
ソリューションをリビルドしエラーが起こらないことを確認します。
スキャフォールディング ツールの追加と最初のマイグレーションの実行
[ ツール ] -> [ NuGet パッケージマネージャー] -> [ パッケージマネージャーコンソール]
次のコマンドを入力します。
# スキャフォールディング エンジンを実行する Visual Studio Web コード生成パッケージを追加します。 Install-Package Microsoft.VisualStudio.Web.CodeGeneration.Design # 初期マイグレーションを実施します。引数がマイグレーション名になります。 # ソリューションに Migrationフォルダとファイルが追加されます。 Add-Migration Initial # 作成したマイグレーションででデータベースを更新します。 Update-Database
スキャフォールディングを実施し、CRUD アプリのひな型を作成する。
プロジェクトフォルダのあるディレクトリ(.csprojがあるディレクトリ)で以下のコマンド入力します
<# -m:モデルの名前。 -dc:データ コンテキスト。 -udl:既定のレイアウトを使用します。 -outDir:ビューを作成するための相対出力フォルダー パス。 #> dotnet aspnet-codegenerator razorpage -m Movie -dc MovieContext -udl -outDir Pages\Movies --referenceScriptLibraries
/pages/Movieフォルダにビュースクリプトとページモデルが作成されます。
デバッグを開始し、http://localhost:port/movies にアクセスすると一覧ページが表示されます。
新規作成や編集、削除なども使用可能です。