作成者: Rick Anderson
このチュートリアルでは、Microsoft Visual Web Developer 2010 Express Service Pack 1 (Microsoft Visual Studio の無料バージョン) を使用した ASP.NET MVC Web アプリケーション構築の基本事項を説明します。 開始する前に、以下に示す前提条件がインストールされていることを確認してください。 次のリンクをクリックすると、これらをすべてインストールできます: Web Platform Installer。 また、次のリンクを使用して前提条件となるソフトウェアを個別にインストールすることもできます。
- Visual Studio Web Developer Express SP1 の前提条件
- ASP.NET MVC 3 Tools Update
- SQL Server Compact 4.0 (ランタイム + ツールのサポート)
Visual Web Developer 2010 ではなく Visual Studio 2010 を使用する場合は、Visual Studio 2010 の前提条件のリンクをクリックして、前提条件をインストールします。
このトピックを学習する際に、VB.NET ソース コードを含む Visual Web Developer プロジェクトを使用できます。 VB.NET バージョンをダウンロードします。 C# を使用する場合は、このチュートリアルの C# バージョンに切り替えてください。
このチュートリアルでは、Microsoft Visual Web Developer 2010 Express Service Pack 1 (Microsoft Visual Studio の無料バージョン) を使用した ASP.NET MVC Web アプリケーション構築の基本事項を説明します。 開始する前に、以下に示す前提条件がインストールされていることを確認してください。 次のリンクをクリックすると、これらをすべてインストールできます: Web Platform Installer。 また、次のリンクを使用して前提条件となるソフトウェアを個別にインストールすることもできます。
- Visual Studio Web Developer Express SP1 の前提条件
- ASP.NET MVC 3 Tools Update
- SQL Server Compact 4.0 (ランタイム + ツールのサポート)
Visual Web Developer 2010 ではなく Visual Studio 2010 を使用する場合は、Visual Studio 2010 の前提条件のリンクをクリックして、前提条件をインストールします。
このトピックに関連する、Visual Web Developer プロジェクトと VB ソース コードを使用できます。 ここで VB バージョンをダウンロードします。 CSharp を使用する場合は、このチュートリアルの CSharp バージョンに切り替えます。
作成するアプリケーション:
データベースを使用したムービーの作成、編集、一覧表示をサポートする、シンプルなムービー一覧アプリケーションを実装します。 次に、これからビルドするアプリケーションの 2 つのスクリーンショットを示します。 これには、データベースからのムービーの一覧を表示するページが含まれています。
このアプリケーションでは、ムービーを追加、編集、削除したり、個々のムービーに関する詳細を表示したりすることもできます。 データを入力する際には必ず検証が行われ、正しいデータがデータベースに格納されるようにします。
学習内容
ここでは次の内容について学習します。
- 新しい ASP.NET MVC プロジェクトを作成する方法
- Entity Framework のコードファースト パラダイムを使用して新しいデータベースを作成する方法
- ASP.NET MVC コントローラーとビューを作成する方法
- データを取得して表示する方法
- データを編集してデータ検証を有効にする方法
はじめに
まず、Visual Web Developer 2010 Express (略して "VWD") を実行し、[スタート] ページから [新しいプロジェクト] を選択します。
Visual Web Developer は IDE、つまり統合開発環境です。 Microsoft Word を使用してドキュメントを作成するのと同様に、IDE を使用してアプリケーションを作成します。 Visual Web Developer の上部には、使用可能なさまざまなオプションを含むツール バーがあります。 また、メニューを使用して IDE のタスクを実行することもできます。 (たとえば、[スタート] ページから [新しいプロジェクト] を選択する代わりに、メニューから [ファイル]>[新しいプロジェクト] を選択することができます。)
初めてのアプリケーションの作成
プログラミング言語として Visual Basic または Visual C# のいずれかを使用してアプリケーションを作成できます。 このチュートリアルでは、左側の Visual Basic を選択し、[ASP.NET MVC 3 Web アプリケーション] を選択します。 プロジェクトに "MvcMovie" という名前を付け、[OK] をクリックします。
[新しい ASP.NET MVC 3 プロジェクト] ダイアログ ボックスで、[インターネット アプリケーション] を選択します。 [Razor] は既定のビュー エンジンとして変更しません。
OK をクリックします。 Visual Web Developer では、先ほど作成した ASP.NET MVC プロジェクトに既定のテンプレートを使用しているため、何もしなくてもすぐにアプリケーションが動作します。 これはシンプルな "Hello World!" プロジェクトなので、アプリケーションを開始するのに適しています。
[デバッグ] メニューの [デバッグの開始] をクリックします。
デバッグを開始するためのキーボード ショートカットは F5 です。
F5 を押すと、Visual Web Developer で開発用 Web サーバーが起動し、Web アプリケーションを実行します。 その後、VWD はブラウザーを起動して、アプリケーションのホーム ページを開きます。 アドレス バーには、example.com
などではなく、localhost
と表示されます。 これは、localhost
が常に自分のローカル コンピューターを指すためです (ここでは、今ビルドしたアプリケーションが実行されています)。 VWD が Web プロジェクトを実行すると、プロジェクトにランダムなポートが使用されます。 次の画像では、ランダムなポート番号として 43246 が使用されています。 プロジェクトでは、おそらく別のポート番号が使用されます。
すぐに使えるこの既定のテンプレートでは、アクセスする 2 つのページと基本的なログイン ページが提供されます。 このアプリケーションの動作を変更し、そのプロセスの中で ASP.NET MVC について少し学習しましょう。 ブラウザーを閉じて、コードを変更してみましょう。