ASP.NET Core MVCサンプルの構成
おもむろに始まるお勉強ブログです。
.NET Core周辺、主にASP.NET Core MVCをお勉強する試み。
知識は無く、意識も低く、内容も保障できません。
とりあえずASP.NET Core MVCのサンプルを眺める1回目です。
Webアプリケーションプロジェクトの新規作成
新しいプロジェクト >.NET Core >ASP.NET Core Webアプリケーション(.NET Core)を選択。
Coreなのにターゲットフレームワーク4.5.2が選択されているのが違和感ですが無視。
ASP.NET Core 1.1を選択し、Webアプリケーションを選択してOKボタン。
サンプルを眺めるのが目的なので「空」ではなく、Webアプリケーションを選択します。
勝手に色々含まれたサンプルサイトが作成されます。
実行すると普通にWebサイトが表示されます。
習うより慣れろということでファイルを上から順に見てみます。
Connected Services
接続済みサービスが表示されるようです。
デフォではApplication Insightsが表示されています。
とりあえずスルー。
Properties\launchSettings.json
開発サーバ環境情報が記載されたjson設定ファイル。
Webアプリケーションプロジェクトのプロパティページで、
プロパティや起動、SSLや認証等を変更すると反映されます。
wwwroot
css, image, js, lib, faviconと静的コンテンツ置き場。
アクセスパスとしてはwwwrootフォルダ配下ではなく、
root階層で参照されます。
例えば、
\samplesite\wwwroot\css\site.css
ならば、
http://localhost:777/css/site.css
となります。
Startup.csのConfigureメソッド内で、
app.UseStaticFiles();
っと呼び出してるところでその辺設定されているようです。
wwwrootが未指定時既定値となります。
物理階層とリクエストパスが一致しない場合のアサインや、
静的コンテンツのキャッシュ保持期間等ヘッダ情報の追加が必要な場合に
思い出せればいいようです。
Working with static files in ASP.NET Core | Microsoft Docs
続いてwwwroot配下の各フォルダを見てみます。
wwwroot\css\site.css
CSSです。後述するbundleconfig.jsonでBundle(圧縮みたいなの)指定されています。
ビルド時はBundleによってsite.min.cssと小さく読みにくい形になります。
元から圧縮されてる場合もあるし必要なのかな?って気がしますが、
wwwroot\images\banner1.svg~4.svg
.svg??何?って感じですが、
開いてみるとよくわからないXMLで何か指定されています。
Wikipedia先生によれば、画像のVectorデータのようです。
Scalable Vector Graphics - Wikipedia
画面のサイズに関わらずキレーに画像を表示したりするみたいです。
とりあえずそういうものだと理解しておきます。
wwwroot\js\site.js
javascriptです。サンプルでは何も記述はありません。
cssと同様にBundleによって圧縮されます。
wwwroot\lib
bootstrap、jquery3つが入ってます。
bootstrapはレスポンシブデザインのCSSフレームワークです。
他bootstrapが必要とするものが色々格納されています。
これも後述\Views\Shared\_Layout.cshtmlで参照されてますね。
Controllers
MVCのCです。
サンプルではHomeControllerしかありません。
またMVCのM、Modelも特にCRUDが無いためか作られていません。
(認証設定した場合は作られるかもしれません)
Views
MVCのVです。
HomeControllerに対応するHomeは以下のView達と、
共通部分のShared配下のView達があります。
Shared配下のViewだけ何となく名前で意味がわかりますが、
一応中身をみてみます。
Views\Shared\_Layout.cshtml
共通レイアウトとなるViewです。Webフォームで言うMaster。
Views\_ViewStart.cshtmlでLayout指定されています。
Views\Shared\_ValidationScriptsPartial.cshtml
開発環境、ステージング/リリース環境で検証用jQueryを分けてる部分Viewですが、
どこから指定されてるんだろう?
ってサンプルには指定が無いみたいですね。入力するページが無いし。
検証が必要な時は読み込めばよろしいのでしょう。
Views\Shared\Error.cshtml
Startup.csで指定されてるステージング/リリース環境用エラーViewです。
View\_ViewImports.cshtml
そういう名前で決まってるView用インポート的な共通Viewです。
サンプルでは自身の名前空間と、
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
でTag Helperを指定しています。
Tag Helperってのはタグに指定されている謎の属性たちです。
_Layout.cshtmlのタグ内にasp-なんとかっていうHTMLっぽくない
謎の属性がたくさん指定されていますがそいつらの事です。
<li><a asp-area="" asp-controller="Home" asp-action="Index">Home</a></li>
のasp-controller,asp-action等のことです。
HomeControllerのIndexアクションへの遷移って
何となくわかりますね。
View\_ViewStart.cshtml
View開始時によみこまれる約束なViewです。
サンプルでは上述の共通レイアウトView、_Layout.cshtmlを指定しています。
bower.json
弓とは関係なく東屋、木陰、休息所という和訳です。
ググってみるとフロントエンド用のパッケージマネージャとのこと。
クライアントサイド向けNuGet的なものみたい。
ソリューションエクスプローラーの依存関係配下に指定があります。
Bower配下でbootstrap、jQueryが管理されていて、
NuGet配下でAspNetCoreやMVCに必要な参照が管理されているみたい。
Program.cs
メソッドチェーンで色々呼ばれてますが一旦は気にしません。
Startup.cs
開始時に実行されるお約束クラスです。
さようならGlobal.asaxなのでしょう。
設定とかサービスとかエラーハンドリングとか。
MVCで大切なroutingもここですね。
これで一通り目を通したつもりになっておきます。
深く考えずにスルーしてる部分も多く、勘違いもあると思うのですが、
細かいことはこれから勉強できたらいいなって感じです。つづく。