MacでASP.NET5 MVC6（ちょっといじってみる編） #ASP.NET

とりあえずyoでプロジェクトを作ってからの話。
セットアップが未だの人はセットアップ編を見て下さい。

ひとまず、ASP.NET 5 MVC 6のファイル構造を理解して、少しいじってみましょう。

最初に結論

まともな何かを作るには、当然DB連携が必要になるが、2016年7月12日現在、DBを司るEntity Framework 7(beta5)が事実上SQL Serverにしか対応しておらず、まともな何かを開発することはできない。もちろんSQL Serverを利用すればいいのですが、その場合は、迷わずWindows上でVS使ったほうがいいので、ここでは敢えてやりません。

ドキュメント上はSQLiteには対応しているみたいなのですが、接続のための情報が無く（beta4まではあるが、それ以降、仕様が変わったらしい）、ソースまで読んでる暇がないので、ひとまず、正式リリースを待つ。なお、MySQLにもそのうち対応するらしいが、現状未対応のようです。

ひと通り見てみる

yoでテンプレートを選ぶ

とりあえず、yo aspnetでテンプレートを選ぶ。
dnvmおよびyeomenのセットアップが完了していれば、

yo aspnet

とすると、下記のような画面がでる。

という画面になるので、Web Applicationか、Web Application Simpleを選ぶ。ここではSimpleの方を選んでみます。
密かにNancyに対応している。正直MVCは肥大しすぎと思うので、Nancyをちゃんと使えるようになりたい。

そうすると、アプリケーション名（フォルダ名）を聞いてくるので、入力します。ここでは、WebAppとします。
Simpleを選んだ場合は、認証用のControllerやEntityFrameworkあたりが読み込まれないようです。

で、Enterを押すとテンプレート（WebAppというフォルダ）が、実行した階層に生成されます。
できあがったフォルダに移動して、VSCを開いてみます。

cd WebApp
code .

とします。初期状態だと、下記のような構造をしています。

ま、いわゆるMVCを見慣れたひとにはお馴染みの構造です。設定ファイル類はXMLからJSONにシフト！！！
要点といえば、

Controllers : コントローラーが入っている。HomeControllerというNameControllerという命名規則。
Views : ビューが入っている。Viewに対応したフォルダ（Home）があり、メソッドに対応したファイルがある。
project.json : プロジェクトの設定が書かれている
Startup.cs : 実行時プロジェクトの初期処理が行われている
hosting.ini : kestrelでWebを起動した際のホスト名やポート設定が書かれている
config.json : 旧Web.configのかわり？。接続文字列などを定義する。

くらいでしょうか。その他は、bowerやらgulpやらの設定ファイルなど。

一旦起動してみる

一見、必要なファイルは揃ってそうですが、実は、必要なコンポーネントは読み込まれていません。
project.jsonの中で定義されているdependenciesなどは、

cd WebApp
dnu restore

を実行することで初めて取得されます。実行してみましょう。

こんな感じで必要なファイルが取得されます。

では、ちゃんと動くかWebサイトを見てみましょう。VSCでshift + command + pでVSCコンソールを開いて、>kestrelと打ち、Enterを押します。または、

cd WebApp
dnx . kestrel

とします。そうすると、

Started

と表示されるはずです。ここで、http://localhost:5000 をみてみましょう。

こんな感じで表示されたOKです。
なお、ここでの5000というポートは、hosting.iniファイルの中で指定されたものです。必要に応じて変更することもできます。

構造を見てみる

ルーティング

http://localhost:5000 と指定された際の動きを見てみましょう。MVCで何かリクエストが合った再、

Controller → View

と処理が流れるのが、だいたいの流れです。ルートが指定された場合、標準のControllerとそのメソッドが呼び出されているはずですが、それは、Startup.csの中で、

app.UseMvc(routes =>
{
    routes.MapRoute(
        name: "default",
        template: "{controller=Home}/{action=Index}/{id?}");

    // Uncomment the following line to add a route for porting Web API 2 controllers.
    // routes.MapWebApiRoute("DefaultApi", "api/{controller}/{id?}");
});

と指定されているからです。

コントローラ

つまり、Controllersの中の、HomeControllerの中の、Index()メソッドが呼ばれているということです。
Index()メソッドは、何もせず、

public class HomeController : Controller
{
    public IActionResult Index()
    {
        return View();
    }

とViewを呼び出しています。

ビュー

Viewは、

上記のような構造をしており、HomeControllerのIndex()により、Views->Homeフォルダの中のIndex.cshtmlが表示されています。

Index.cshtmlは、<body>以下の内容しか持っていない。。。つまりテンプレートが適用されているのですが、そのテンプレートは、

_Layout.cshtml

です。この_Layout.cshtmlの中の、

@RenderBody()

部分に、Index.cshtmlの内容が出力されます。
そもそも、なぜデフォルトで_Layout.cshtmlが適用されているかというと、

_ViewStart.cshtml

の中で、

@{
    Layout = "_Layout";
}

と指定されているからです。Layout行をコメントアウトすると、何も読み込まれません。

各ページでテンプレートを使わない、あるいは選ぶ場合は、各ページの頭に、

@{
    Layout = "";
}

などとしてやる。

ちょっといじってみる

やっと本題。簡単なコントローラとビューを作って動くか試してみましょう。

やること

ほんとうに基本的なことだけ。

HogeControllerを作り、単にビューを呼び出すIndex()を実装。
Hogeフォルダを作成し、Index.cshtmlを用意。
Hello Hoge!と出力

以上。

コントローラーを作る

手書きでもいいが、yoがやってくれる。Controllersフォルダにおいて、

yo aspnet:MvcController HogeController

を実行。すると、ひな形ができる（が、内容が微妙）。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNet.Mvc;

// For more information on enabling MVC for empty projects, visit http://go.microsoft.com/fwlink/?LinkID=397860

namespace MyNamespace
{
    public class HogeController : Controller
    {
        // GET: /<controller>/
        public IActionResult Index()
        {
            return View();
        }
    }
}

Namespaceの設定はやってくれないようなので、Homeとかを見て適切に書き換えます。今回は、Index()でreturn View();をしたかったのでそのままにします。

ビューを作る

まず、Viewsフォルダに、Hogeフォルダを作ります。その中に、Index.cshtmlを作ります。一応、yoにもコマンドが有るようですが、簡単なので使いません。

Index.cshtml

<h3>Hello Hoge!</h3>

とだけします。

アクセスしてみる

注意！

すでに、kestrelを起動している場合は、一度、コンソールを閉じ、再起動します。そうしないと、Controller等の変更は反映されません。

アクセス

http://localhost:5000/Hoge/Index

としてみます。いかがでしょう？

こんな感じで表示されたでしょうか？標準でBootstrap3.xが読み込まれているようです。

値の受渡し

コントローラーで、ViewBagに代入。

ViewBag.foo = "foo";
return View();

ビューで、表示

@ViewBag.foo

とする。DBのSelect結果などは、下記のようにオブジェクトでそのまま受け渡したりできるが、それはまた別の機会に。

//linq
var query = from t in obj.talble
            select t;

return View(query)

@model IEnumerable<obj.table>
@foreach(var item in Model)
{
    @item.name<br>
}

その他

他にもいろいろ試したいことはありますが、とりあえずここまで。
特にDBアクセス（特にMySQL）は是非とも試して見たいところですが、冒頭の理由で未だ使えません。
使えるようになれば再度編集したいと思います。