Shoeisha Technology Media

CodeZine(コードジン)

特集ページ一覧

ASP.NET MVC 3:Razorのレイアウトとセクション

連載:ScottGu's Blog翻訳

  • LINEで送る
  • このエントリーをはてなブックマークに追加
2011/01/19 14:00

 本稿は、Scott Guthrie氏のブログを、氏の許可を得て、翻訳、転載したものです。米Microsoft社の副社長で、ASP.NETやSilverlightの開発チームを統率する氏のブログでは、次期製品を含む最新の技術をいち早く紹介しています。原典:ASP.NET MVC 3: Layouts and Sections with Razor。

目次

 本稿は、Scott Guthrie氏のブログを、氏の許可を得て、翻訳、転載したものです。米Microsoft社の副社長で、ASP.NETやSilverlightの開発チームを統率する氏のブログでは、次期製品を含む最新の技術をいち早く紹介しています。

 原典:ASP.NET MVC 3: Layouts and Sections with Razor

ASP.NET MVC 3:Razorのレイアウトとセクション

 この投稿は、ASP.NET MVC 3ベータ版/RCの新機能を、いくつか詳細に紹介していく『ミニ投稿』シリーズの1つです。

 本日の投稿では、Razorでのレイアウトページの動きについて、より詳細にご紹介します。具体的には、レイアウトファイルの中に、複数ある、隣接していない置換可能な『セクション』を持つ方法、そして実行時にレイアウトに基づいたビューに対して、オプションでそれらの『セクション』を『埋め込む』方法に関する解説です。これを行うRazorの文法はクリーンで簡潔です。

 また、特定のレイアウトセクションが定義されているかどうかを実行時にチェックする方法や、ビューテンプレート内でセクションが指定されていない場合に、代替えのコンテンツ(または代替えのレイアウトも)を提供する方法も紹介します。これにより、強力かつ簡単な方法でサイトのUIのカスタマイズが可能になり、実装の観点からクリーンでDRYなものにできます。

レイアウトとは?

 通常、Webサイト/アプリケーション内では、全てのページに統一感のある見た目と操作性を心がけていると思います。ASP.NET 2.0では『マスターページ』の概念を導入し、.aspxベースのページまたはテンプレートを使用することで、これを可能にしました。Razorもこの概念を『レイアウト』と呼ばれる機能でサポートしており、そのため共通のサイトテンプレートが定義でき、サイト上のすべてのビュー/ページに渡って、その見た目と操作性が継承されます。

 以前、ASP.NET MVC 3:Razorでのレイアウトというブログ投稿で、Razorでのレイアウトファイルについて、基礎的な動作を説明しました。本日の投稿では、複数の隣接していない置換可能な領域をレイアウトファイルの中で定義して、それを実行時にオプションで『埋め込む』方法について、さらに深く話したいと思います。

サイトのレイアウトシナリオ

 では、ASP.NET MVC 3とRazorを使った共通のサイトレイアウトのシナリオを実装してみましょう。具体的には、すべてのページで共通するヘッダーとフッターを持つサイトのUIを実装します。また、共通のサイトレイアウトの右側に『SideBar』セクションも追加します。

 いくつかのページ上で、サイドバーをカスタマイズして、それが含まれるページには特有のコンテンツを表示するようにします。

caption

 他の(カスタマイズされたサイドバーコンテンツが無い)ページ上では、『デフォルトのコンテンツ』をサイドバーへ提供します。

caption

 ASP.NET MVC 3とRazorを使って、クリーンで上手な方法によりこのカスタマイズを行います。


  • LINEで送る
  • このエントリーをはてなブックマークに追加

著者プロフィール

  • WINGSプロジェクト Chica(チカ)

    <WINGSプロジェクトについて> 有限会社 WINGSプロジェクトが運営する、テクニカル執筆コミュニティ(代表 山田祥寛)。主にWeb開発分野の書籍/記事執筆、翻訳、講演等を幅広く手がける。2018年11月時点での登録メンバは55名で、現在も執筆メンバを募集中。興味のある方は、どしどし応募頂...

バックナンバー

連載:Scott Guthrie氏 Blog翻訳

もっと読む

All contents copyright © 2005-2018 Shoeisha Co., Ltd. All rights reserved. ver.1.5