テンプレート関連のビューヘルパー
ASP.NET MVC5 の学習メモ。
EditForメソッドのためのテンプレート
~/Views/{コントローラ名}/EditorTemplates/{テンプレート名}.cshtml
- コントローラ名
特定コントローラのみで有効にする場合、コントローラ名を指定する。
アプリケーション全体で有効にする場合、コントローラ名にShared
を指定する。
- テンプレート名 型名もしくはUIHint属性で指定するビュー名を指定する。
EditorForメソッドの対応するテンプレート検索時の優先順。
UIHint属性 -> DataType属性 -> データ型
例
アプリケーション共通でDateTime型のプロパティに対応するテンプレートを定義する時
~/Views/Shared/EditorTemplates/DateTime.cshtml
リンク/エンコード関連のビューヘルパー
ASP.NET MVC5 の学習メモ。
ハイパーリンクを生成する
ActionLink
メソッド | 説明 | タグ |
---|---|---|
ActionLink | ハイパーリンクを生成 | <a> |
例
@Html.ActionLink( "詳細画面へ戻る", // リンクテキスト "Details", // アクション名 "Result", // コントローラー名 new { id = "abc123" }, // ルートパラメータ : )
↓ ↓ ↓
<a href="/Result/Details/abc123"> 詳細画面へ戻る </a>
RouteLink
ルート定義からハイパーリンクを生成する。
メソッド | 説明 | タグ |
---|---|---|
RouteLink | ハイパーリンクを生成 | <a> |
例
@Html.RouteLink( "詳細画面へ戻る", // リンクテキスト new { controller = "Result", Action = "Details", id = "abc123" }, // ルートパラメータ : )
↓ ↓ ↓
<a href="/Result/Details/abc123"> 詳細画面へ戻る </a>
アプリケーションルートからの絶対パスを生成する
メソッド | 説明 |
---|---|
Url.Content | 「~/」(ルート演算子)で始まる仮想パスをアプリケーションルートからの絶対パスに変換 |
Url.Action | Html.ActionLinkと同じく指定されたコントローラー/アクション名、その他パラメータ情報から絶対パスを生成 |
Url.RouteUrl | Html.RouteLinkと同じく指定されたルート名から絶対パスを生成 |
メモ
<a>
タグは「アンカータグ」と言うらしい。
フォーム関連のビューヘルパー
ASP.NET MVC5 の学習メモ。
フォームを生成する
メソッド | 説明 | タグ |
---|---|---|
BeginForm | フォームを生成 | <form> |
BeginRouteForm | ルート定義からフォームを生成 | <form> |
引数
引数省略時、ポスト先は現在のアクションになる。 引数でポスト先、HTTPメソッド(GET, POST等)、その他属性(enctype,idなど)を指定することが出来る。
使い分け
ルート関連のパラメータがオブジェクトとして用意されている、ルートを明示的に宣言したい場合は BeginForm
ではなく BeginRouteForm
を使う。
モデルに関連づいた<input>
、<textarea>
要素を生成する
メソッド | 説明 | タグ |
---|---|---|
LabelFor | ラベルを生成 | <input> |
TextBoxFor | テキストボックスを生成 | <input type="text"> |
PasswordFor | パスワード入力ボックスを生成 | <input type="password"> |
HiddenFor | 隠しフィールドを生成 | <input type="hidden"> |
RadioButtonFor | ラジオボタンを生成 | <input type="radio"> |
CheckBoxFor | チェックボックスを生成 | <input type="checbox"> |
TextAreaFor | テキストエリア(複数行テキストボックス)を生成 | <textarea> |
第一引数のexpression
「m => m.プロパティ」のようなラムダ式を指定する。
モデルと関連づかない<input>
、<textarea>
要素を生成する
XxxxForと違い、モデルに関連づかない。
Label
、TextBox
など。
<select>
要素を生成するビューヘルパー
メソッド | 説明 | タグ |
---|---|---|
DropDownListFor | 選択ボックスを生成(単一選択) | <select> |
ListBoxFor | リストボックスを生成(複数選択) | <select multiple="multiple"> |
EnumDropDownFor | Enum型をもとに選択ボックスを生成 | <select> |
モヤっとメモ
BeginForm
とBeginRouteForm
の使い分けが理解できてない- XxxxForより、EditForで型に応じて適切に要素を出力するほうがいいらしい?
Razor構文
ASP.NET MVC5 の学習メモ。
コードナゲット
cshtmlファイル内で「@」を付けるとC#のコードが書ける。 式の値を出力する。
<div class="form-group"> @Html.LabelFor(m => m.ConfirmPassword, new { @class = "col-md-2 control-label" }) <div class="col-md-10"> @Html.PasswordFor(m => m.ConfirmPassword, new { @class = "form-control" }) </div> </div>
- 終了デミリター不要
- 終了を明示的に指定したい場合「@(...)」のように括弧で囲う
- @をエスケープしたい場合「@@」と書けばいい
コードブロック
「@{...}」で出力を伴わない文やif,forなどの制御構文がかける。
<table class="table"> <tbody> @foreach (var account in Model) { <tr> <td> @if (ViewBag.ShowRemoveButton) { // 略 } </td> </tr> } </tbody> </table>
- コードブロック内ではタグを検出すると自動的に静的コンテンツとみなす
コメント
「@...@」でコメントが書ける。エンドユーザからは見えない。
@*コメント*@
コードブロック内ではC#と同じ「//」「/.../」が使える。エンドユーザからは見えない。
@{ // コメント }
HTMLのコメントを書くこともできるが、これはエンドユーザから見ることが出来る。
<!-- コメント -->
2019/5の成果
1カ月ごとに学習したことについてYWT形式で振り返ります。
5月の学習内容(YWT)
やったこと
読書
書籍名 | 詳細 | 進捗 |
---|---|---|
進化的アーキテクチャ | Amazon | 8.1章~読み終わり |
SQL実践入門 | Amazon | 5章~8章まで |
ASP.NET MVC5実践プログラミング | Amazon | 4章途中 |
イラスト図解式 この一冊で全部わかるWeb技術の基本 | Amazon | 3章まで |
エッセンシャル スクラム | Amazon | 4章まで |
ASP.NET MVC
成果なし
HTML/CSS/JavaScript
学習対象 | 種別 | 詳細 | 進捗 |
---|---|---|---|
[HTML/CSS/JavaScript] フロントエンドエンジニアになりたい人の Webプログラミング入門] | 動画学習 | URL | 進捗なし(57%受講) |
他
業務に直接関係ないですが、必須取得の資格勉強をしています。
わかったこと
- MVCモデルについて少しづつ
- Gitの使い方:変な使い方してました。Commitの都度Pushしないことを覚えたり。
- 進化的アーキテクチャ:難しい本も他人と一緒に読めば読了できる(理解できるわけではないが)
- SQL実践入門:SQLの勉強は楽しいけど、数学的な概念が多く出てくるとちょっと辛い。Window関数大事。
次にやること
- 次月は資格試験勉強が終わるので、自作アプリをなんとかしたい!
5月末までの目標
5月末までに行う目標に対しての進捗をまとめます。(完了したタスクは取り消し線)
Webの基礎
読書:Webを支える技術動画学習:はじめてのHTML動画学習:はじめてのCSS- 動画学習:[HTML/CSS/JavaScript] フロントエンドエンジニアになりたい人の Webプログラミング入門
所感
今月は資格試験も控えているため、ちょっと停滞気味でした。
焦りすぎずにコツコツと続けられたら良いかなと思っています。
ユーザーストーリー
はじめに
スクラムについて勉強する中で、ユーザーストーリーにフォーカスを当てて勉強してみました。
勉強のため読ませていただいた記事
メモ
残念ながら、あまりまとまっていませんが、備忘録として気になったキーワードをメモしています。
ユーザーストーリーの書き方
<ユーザ/顧客>として<XXXを達成したい>なぜなら<理由>だからだ
どうやって実現するのかはここには書かれないのね。
ユーザーストーリーは機能ではなく価値をあらわすもの
あくまで"価値"のための要件定義なんですね。
機能をかくことで目的を見失う・・・なるほど。
無駄な詳細化から解放される
どこまでの詳細化が有用で、どこからが無駄なのか。
議論の題材として必要な要素のみを定義して その後は議論で肉付け・・・かな?
Negotiable(交渉可能)
一度決めたことが絶対なわけではない。ユーザーストーリは議論の道具。というあたりで今までの受託開発の要件定義とは決定的に違うところだと感じ始めました。
ユーザーストーリーは議論の道具
議論の活性化に価値を置くこと自体がなかったので、目からうろこでした。
今までは自分達の想像する要件をいかに覆されないか、覆されたとしても工数が増える方向にいかないように…ということばかりをかんがえてました。
それじゃあなかなか良いものは作れませんよね。
優先順位決定の原則
- 高い価値のものから
- 市場投入への時間を短く
- リスクを最小化
- 将来の無駄を避ける
このあたりは受託脳ではなかなかスッと入ってこないので、まずは暗記をしてみる。
"価値"というキーワードにまだなじまない。
ユーザーストーリの上限数
バックログに乗せる項目は100以内(成熟度が低いチームは50程度まで)
超えそうな場合はたな卸し・・・かな?
ドキュメントによる要件定義の課題
「憶測や誤解が生じやすい」そこがたしかに課題でしたね・・・。 しかしなぜユーザーストーリーでは誤解が起きにくいのか・・・議論をすることでどうやってその溝を埋めているのかが気になる。
終わりに
まだまだ知らない単語が多いですね。
あと、受託脳すぎて色々と頭が固くなってるなーということを自覚しました。 頭を柔らかくして新しい定義を受け止めていきたいですねー。
2019/4の成果
もう5月も終わりますが、4月末を思い出して、1カ月ごとに学習したことについてYWT形式で振り返ります。
4月の学習内容(YWT)
やったこと
読書
書籍名 | 詳細 | 進捗 |
---|---|---|
Webを支える技術 | Amazon | 15章~読み終わり |
進化的アーキテクチャ | Amazon | 6章~8.1章まで |
入門 監視 | Amazon | 2章~読み終わり |
SQL実践入門 | Amazon | 2章~5章まで |
ASP.NET MVC5実践プログラミング | Amazon | 1章途中 |
イラスト図解式 この一冊で全部わかるWeb技術の基本 | Amazon | 3章まで |
モブプログラミング・ベストプラクティス | Amazon | 読み終わり |
エッセンシャル スクラム | Amazon | 4章まで |
組織も人も変わることができる! なぜ部下とうまくいかないのか | Amazon | 読み終わり |
イシューからはじめよ―知的生産の「シンプルな本質」 | Amazon | 読み終わり |
ASP.NET MVC
進捗なし
HTML/CSS/JavaScript
学習対象 | 種別 | 詳細 | 進捗 |
---|---|---|---|
[HTML/CSS/JavaScript] フロントエンドエンジニアになりたい人の Webプログラミング入門] | 動画学習 | URL | 57%受講 |
他
学習対象 | 詳細 | 結果 |
---|---|---|
GASでSlackBot作成 | - | スプレッドシートの内容を一定周期でSlackに送信するBotの作成 |
わかったこと
(省略)
次にやること
(省略)
5月末までの目標
5月末までに行う目標に対しての進捗をまとめます。(完了したタスクは取り消し線)
Webの基礎
読書:Webを支える技術動画学習:はじめてのHTML動画学習:はじめてのCSS- 動画学習:[HTML/CSS/JavaScript] フロントエンドエンジニアになりたい人の Webプログラミング入門
所感
(省略)