特集：.NET開発の新標準「NuGet」入門（前編）

.NETで開発モジュール導入が楽々に！ NuGet入門

芝村 達郎
2011/09/15
Page1 Page2 Page3 Page4

■公開されている代表的なパッケージ

　最後に、NuGetで公開されているパッケージの中でも、特に人気があるパッケージの簡単な説明／インストール方法／使い方を紹介する。実際の開発時に役立てていただければ幸いだ。

●jQuery／jQuery UI

PM> Install-Package jQuery
PM> Install-Package jQuery.UI.Combined
jQuery／jQuery UIパッケージをインストールするコマンド

　jQueryとjQuery UIは「Web開発に携わっていて、知らない人は居ない」といっても過言ではないほどに有名なライブラリだ。ASP.NET MVC 3 Tools Updateを適用した環境ではバージョン「1.5.1」が同梱されているが、現時点での最新版は「1.6.3」なので同梱されているのはかなり古いバージョンとなっている。

　上記のコマンドを実行すると、「Scripts」ディレクトリ内にバージョン「1.6.3」であれば「jquery-1.6.3.min.js」といったファイルが追加されるので、後はASP.NET MVC 3であれば、_Layout.cshtml／_Layout.vbhtmlファイルに記述されている<head>タグ内に下記の3行を追加するだけで利用可能になる。

<link type="text/css" href="@Url.Content("~/Content/themes/base/jquery.ui.all.css")" rel="stylesheet" />
<script type="text/javascript" src="@Url.Content("~/Scripts/jquery-1.6.3.min.js")"></script>
<script type="text/javascript" src="@Url.Content("~/Scripts/jquery-ui-1.8.16.min.js")"></script>
jQuery／jQuery UIを使うための<script>タグの記述例【ASP.NET MVC 3の場合】（_Layout.cshtml／_Layout.vbhtml）

　WebMatrixでも同様に「Scripts」ディレクトリ内にファイルが追加されるが、（WebMatrixで開発できる）ASP.NET WebページではUrlヘルパーが利用できないため、Hrefメソッドを利用している点が異なる。

<link type="text/css" href="@Href("~/Content/themes/base/jquery.ui.all.css")" rel="stylesheet" />
<script type="text/javascript" src="@Href("~/Scripts/jquery-1.6.3.min.js")"></script>
<script type="text/javascript" src="@Href("~/Scripts/jquery-ui-1.8.16.min.js")"></script>
jQuery／jQuery UIを使うための<script>タグの記述例【WebMatrixで開発できるASP.NET Webページの場合】（_Layout.cshtml／_Layout.vbhtml）

　jQueryに限らず、CSSファイルやJavaScriptファイルなどを含むパッケージ全般を使うときの注意点として、NuGetは自動的に上記のようなスクリプトの参照を追記・更新してくれるという機能を持たないことが挙げられる。なので、jQueryのようにファイル名にバージョンが含まれる場合には更新した後に、手動でファイル名を変更する必要があるので注意してほしい。

●Modernizr

PM> Install-Package Modernizr
Modernizrパッケージをインストールするコマンド

　Modernizrは、使用中のブラウザがHTML5にどこまで対応しているかを判別するためのライブラリだ。HTML5対応をうたっているブラウザでも、実際には一部の機能のみ対応だったり、再生可能なフォーマットに制限があったりするが、Modernizrを利用するとCSSとJavaScriptの両方で対応状況の判別が行える。

　ASP.NET MVC 3で同梱されているバージョンは「1.6」とかなり古いバージョンとなっているが、「Update-Package Modernizr」コマンドを実行するとバージョン「2」が入手可能だ。しかし、Modernizrはバージョン「2」から必要な機能だけ選択してダウンロードする形になっており（次の画面を参照）、NuGetに登録されているのは「開発用」という名目になっているので注意してもらいたい。

Modernizrの公式ページからは必要な機能だけをダウンロードできる

　利用方法はjQueryと同様に<head>タグ内にスクリプト参照の記述を追加するだけだ。

<script type="text/javascript" src="@Url.Content("~/Scripts/modernizr-2.0.6-development-only.js")"></script>
Modernizrを使うための<script>タグの記述例（_Layout.cshtml／_Layout.vbhtml）

　WebMatrixで利用する場合には、上記の「Url.Content」ヘルパーを「Href」メソッドに変更するだけでいい。これもjQueryのときと何ら変わらない。

●ASP.NET Web Helpers

PM> Install-Package microsoft-web-helpers
ASP.NET Web Helpersパッケージをインストールするコマンド

　以前は「Microsoft Web Helpers」と呼ばれていた機能が、「ASP.NET Web Helpers」と名前を変えてリリースされている。しかし、実装されているヘルパーは以前と変わっていないので、古いバージョンを利用している場合でも問題なく最新版にアップデート可能だ。

　インストールが完了すると、以下のようなヘルパーをすぐに使い始められる。

  • Analytics： Google AnalyticsやYahoo!アクセス解析のトラッキング・コードの埋め込み
  • Bing： Bing検索ボックスの表示
  • GamerCard： Xboxゲーマー・カードの表示
  • Gravatar： アバター画像の表示
  • LinkShare： Twitter／Facebookなどへ投稿するボタンを表示
  • Video.Flash： Flashコンテンツを埋め込むコードを生成
  • Video.Silverlight： Silverlightコンテンツを埋め込むコードを生成
  • ReCaptcha： reCAPTCHAを使ったテスト用画像の表示

●Facebook Helper／Twitter Helper

PM> Install-Package Facebook.Helper
PM> Install-Package Twitter.Helper
Facebook Helper／Twitter Helperパッケージをインストールするコマンド

　今、はやりのFacebookの［いいね！］ボタンや、Twitterの［ツイートする］ボタンを表示するためのヘルパーも用意されている。この2つはセミナーなどでもよく利用されているので、目にしたことのある方も多いと思う。

　本来ならFacebookやTwitterの開発者向けページから埋め込み用のコードを作成する必要があるが、このヘルパーを利用すると1つのメソッドを呼び出すだけで実現できる。埋め込み用コード自体はブラウザ上で簡単に生成できるが、その方法ではJavaScriptコードを直接いじる必要があるので、パラメータを変更するのに手間がかかったりする。しかしヘルパーであれば引数の形でJavaScriptコード側のパラメータを指定できるので、後からの見た目や挙動の変更が非常に容易となっている。

●Entity Framework 4.1

PM> Install-Package EntityFramework
Entity Framework 4.1パッケージをインストールするコマンド

　ASP.NET MVC 3向けとなるが、最新のデータ・アクセス・テクノロジであるEntity Framework 4.1もNuGetからインストールできる。すでに次期バージョンのCTP版が公開されているほど開発は活発だが、ASP.NET MVC 3 Tools Updateをインストールしている場合は最初からプロジェクトに追加されているので、更新された場合にはNuGetを使ってすぐにアップデートを行える。

●NuGet galleryから探す

　NuGet galleryではNuGetで公開されているパッケージをタグや作者名で検索を行ったり、人気順や評価の高い順などでソートして探したりできるようになっている。さらにNuGetへサインインすると評価を付けたり、レビューを書いたりすることもできる。

　余談になるが、NuGet gallery自体もASP.NET MVC 3ベースの「Orchard」と呼ばれるCMSで開発されており、Orchard自体はWebMatrixからインストールできる。もともとは日本語に対応していないアプリケーションではあるが、有志による翻訳が行われているので今後に注目したい。

　評価やレビューを書くことがなくとも、次回で解説を行うパッケージの公開に当たってはNuGetのアカウントが必須となるので、興味がある方は登録しておくことをお勧めする。

■

　次回は、今回紹介しきれなかったNuGetの新機能とパッケージを作成して、NuGet galleryで公開までの手順を解説する予定だ。end of article


　INDEX
　 特集：.NET開発の新標準「NuGet」入門（前編）
　 .NETで開発モジュール導入が楽々に！ NuGet入門
　   1．NuGetの概要／利用場面／インストール
　   2．ASP.NET MVCで利用する
　   3．WebMatrixで利用する
  4．公開されている代表的なパッケージ
　
　 特集：.NET開発の新標準「NuGet」入門（後編）
　 NuGetをさらに便利に使う方法とパッケージの公開
　   1．さらにNuGetを便利に使う
　   2．NuGetパッケージの作成
　   3．NuGet galleryで公開


Insider.NET フォーラム 新着記事
  • 第2回　簡潔なコーディングのために （2017/7/26）
    　ラムダ式で記述できるメンバの増加、throw式、out変数、タプルなど、C# 7には以前よりもコードを簡潔に記述できるような機能が導入されている
  • 第1回　Visual Studio Codeデバッグの基礎知識 （2017/7/21）
    　Node.jsプログラムをデバッグしながら、Visual Studio Codeに統合されているデバッグ機能の基本の「キ」をマスターしよう
  • 第1回　明瞭なコーディングのために （2017/7/19）
    　C# 7で追加された新機能の中から、「数値リテラル構文の改善」と「ローカル関数」を紹介する。これらは分かりやすいコードを記述するのに使える
  • Presentation Translator （2017/7/18）
    　Presentation TranslatorはPowerPoint用のアドイン。プレゼンテーション時の字幕の付加や、多言語での質疑応答、スライドの翻訳を行える
＠ITメールマガジン　新着情報やスタッフのコラムがメールで届きます（無料）
- PR -

注目のテーマ

業務アプリInsider 記事ランキング

本日 月間
＠IT
ソリューションFLASH