C#でのMVCについて紹介｜C#でMVCWebアプリケーションを作成しましょう
- システム
エンジニア - MVCとは何かよく理解できません。教えてください。
- プロジェクト
マネージャー - わかりました。では、詳しくみていきましょう。
C#のMVCについて
今回は、C#でのMVCについて説明します。
MVCとは、Webフレームワークで一般的に取り入れられている概念です。
モデル（Model）、ビュー（View）、コントローラー（Controller）の頭文字でMVCです。
モデルは、ロジックを記述します。
ビューは、画面表示の役割を持ちます。
コントローラーは、画面遷移などを管理します。
C#でのMVCとは、ASP.netを用いたMVC Webアプリケーションのことです。
Visual Studioを使うと、C# MVCプロジェクトのひな形を作ってくれます。
今回は、Visual Studio Community 2019をインストールしている前提で進めます。
C#のMVCに興味のある方はぜひご覧ください。
プロジェクトの作成
Visual Studioでプロジェクトを作成します。
1. ASP.NET Webアプリケーション(.NET Framework)を選択し、[次へ]ボタンをクリックします。
2. プロジェクト名を入力します。
ここでは、デフォルトの[WebApplication1]のままとして、[作成(C)]ボタンをクリックします。
3. プロジェクトテンプレートを選択します。
[空]を選択します。
また、MVC(M)にチェックを付けます。
[作成]ボタンをクリックします。
プロジェクトが作成され、以下のようなファイル構成となります。
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
|
WebApplication1
│ Global.asax
│ Global.asax.cs
│ packages.config
│ Web.config
│ Web.Debug.config
│ Web.Release.config
│ WebApplication1.csproj
│ WebApplication1.csproj.user
│
├─App_Data
├─App_Start
│ RouteConfig.cs
│
├─bin
│ Microsoft.CodeDom.Providers.DotNetCompilerPlatform.dll
│ Microsoft.CodeDom.Providers.DotNetCompilerPlatform.xml
│ Microsoft.Web.Infrastructure.dll
│ System.Web.Helpers.dll
│ System.Web.Mvc.dll
│ System.Web.Razor.dll
│ System.Web.Webpages.Deployment.dll
│ System.Web.Webpages.dll
│ System.Web.Webpages.Razor.dll
│
├─Controllers
├─Models
├─obj
│ └─Debug
│ │ .NETFramework,Version=v4.7.2.AssemblyAttributes.cs
│ │ DesignTimeResolveAssemblyReferencesInput.cache
│ │ WebApplication1.csprojAssemblyReference.cache
│ │
│ └─TempPE
├─Properties
│ AssemblyInfo.cs
│
└─Views
web.config
|
コントローラーの作成
プロジェクトを作成しましたので、次にコントローラーを作成します。
C#でのMVCの”C”の部分です。
1. コントローラを追加します。
ソリューションエクスプローラーで[Controllers]フォルダを右クリックします。
[追加(D)]→[コントローラー(T)]の順に選択します。
2. 新規スキャフォールディングアイテムを追加します。
[MVC 5 コントローラー]を選択して[追加]ボタンをクリックします。
3. コントローラ名を入力します。
ここでは、[DefaultController]のままで[追加]ボタンをクリックします。
コントローラが追加され、DefaultController.csが開きます。
下記のコードが自動生成されます。
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
|
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace WebApplication1.Controllers
{
public class DefaultController : Controller
{
// GET: Default
public ActionResult Index()
{
return View();
}
}
}
|
ビューの作成
次にビューを作成します。
C#でのMVCの”V”の部分です。
1. ビューを追加します。
ソリューションエクスプローラーで[Views\Default]フォルダを右クリックします。
[追加(D)]→[ビュー(V)]の順に選択します。
2. [ビューの追加]ダイアログが表示されます。
ビュー名をViewからIndexに変更します。
[レイアウトページの使用(U)]のチェックを外します。
[追加]ボタンをクリックします。
ビューが追加され、Index.cshtmlが開きます。
下記のコードが自動生成されます。
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
</head>
<body>
<div>
</div>
</body>
</html>
|
プロジェクトを実行してみましょう。
“(Webアプリケーションのルートディレクトリ)/Default/Index” URLにアクセスすると、真っ白なページが表示されます。
エラーが表示されなければ成功しています。
index.cshtmlのbody部に何か記述すると、成功していることが分かりやすいです。
モデルの作成
モデルを作成します。
C#でのMVCの”M”の部分です。
1. モデルを追加します。
ソリューションエクスプローラーで[Models]フォルダを右クリックします。
[追加(D)]→[新しい項目(W)]の順に選択します。
2. [新しい項目の追加]ダイアログボックスが表示されます。
[Web]→[コード]ノードをクリックします。
[クラス]を選択し、[追加]ボタンをクリックします。
モデルが追加され、Class1.csが開きます。
下記のコードが自動生成されます。
|
1
2
3
4
5
6
7
8
9
10
11
12
13
|
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
namespace WebApplication1.Models
{
public class Class1
{
}
}
|
3. モデルクラスを実装します。
クラスのメンバ変数を実装します。
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
namespace WebApplication1.Models
{
public class Class1
{
public string Name;
public int Age;
}
}
|
ここではstring型のName、int型のAgeを実装しました。
4. ビューを追加します。
ソリューションエクスプローラーで[Views\Default]フォルダを右クリックします。
[追加(D)]→[ビュー(V)]の順に選択します。
5. [ビューの追加]ダイアログが表示されます。
[ビュー名(N)]をHumanに変更します。
[テンプレート(T)]をEmptyに変更します。
[モデル クラス(M)]をClass1に変更します。
[追加]ボタンをクリックします。
ビューが追加され、Human.cshtmlが開きます。
下記のコードが自動生成されます。
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
|
@model WebApplication1.Models.Class1
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Human</title>
</head>
<body>
<div>
</div>
</body>
</html>
</code></pre>
ビューを実装します。
下記のコードではdivタグの中にNameとAgeを表示します。
<pre><code>
@model WebApplication1.Models.Class1
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Human</title>
</head>
<body>
<div>
<div>@Html.Encode(Model.Name)</div>
<div>@Html.Encode(Model.Age)</div>
</div>
</body>
</html>
|
6. コントローラーの実装
コントローラーを実装します。
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
|
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace WebApplication1.Controllers
{
public class DefaultController : Controller
{
// GET: Default
public ActionResult Index()
{
return View();
}
public ActionResult Human()
{
Models.Class1 human = new Models.Class1();
human.Name = "Taro";
human.Age = 30;
return View(human);
}
}
}
|
Humanメソッドを新規に作成します。
追加したViewと同じ名前になるようにしてください。
プロジェクトを実行してみましょう。
“(Webアプリケーションのルートディレクトリ)/Default/Human” URLにアクセスすると、
Taro
30
が表示されます。
- システム
エンジニア - MVCとはWebアプリケーションを作成するためのデザインパターンということですね？
- プロジェクト
マネージャー - そうです。プロジェクト作成で雛形を作ってくれるので、大変便利なプログラミングです。
まとめ
いかがでしたでしょうか。
C#でのMVCとは、ASP.netを用いたMVC Webアプリケーションのことです。
MVCとは、Webフレームワークで一般的に取り入れられている概念です。
Visual Studio 2019を使った、C#でのMVCアプリケーションについて説明しました。
ぜひご自身でC#のソースコードを書いて、理解を深めてください。
FEnet.NETナビ・.NETコラムは株式会社オープンアップシステムが運営しています。
株式会社オープンアップシステムはこんな会社です
秋葉原オフィスには株式会社オープンアップシステムをはじめグループのIT企業が集結！
数多くのエンジニアが集まります。
-
スマホアプリから業務系システムまで
スマホアプリから業務系システムまで開発案件多数。システムエンジニア・プログラマーとしての多彩なキャリアパスがあります。
-
充実した研修制度
毎年、IT技術のトレンドや社員の要望に合わせて、カリキュラムを刷新し展開しています。社内講師の丁寧なサポートを受けながら、自分のペースで学ぶことができます。
-
資格取得を応援
スキルアップしたい社員を応援するために資格取得一時金制度を設けています。受験料(実費)と合わせて資格レベルに合わせた最大10万円の一時金も支給しています。
-
東証プライム上場企業グループ
オープンアップシステムは東証プライム上場「株式会社夢真ビーネックスグループ」のグループ企業です。
安定した経営基盤とグループ間のスムーズな連携でコロナ禍でも安定した雇用を実現させています。
株式会社オープンアップシステムに興味を持った方へ
株式会社オープンアップシステムでは、開発系エンジニア・プログラマを募集しています。
年収をアップしたい！スキルアップしたい！大手の上流案件にチャレンジしたい！
まずは話だけでも聞いてみたい場合もOK。お気軽にご登録ください。
C＃新着案件New Job
-
システム開発/東京都新宿区/【WEB面談可/C#経験者/20代前半の方活躍中/経験1年以上の方活躍中】/在宅勤務
月給29万～34万円東京都新宿区(新宿駅) -
システム開発/東京都新宿区/【WEB面談可/C#経験者/20代後半～40代の方活躍中/経験年数不問】/在宅勤務
月給41万～50万円東京都新宿区(新宿駅) -
デバック、テスト項目の作成/神奈川県横浜市/【WEB面談可/C#経験者/20代前半の方活躍中/経験1年以上の方活躍中】/在宅勤務
月給29万～34万円神奈川県横浜市(桜木町駅) -
デバック、テスト項目の作成/神奈川県横浜市/【WEB面談可/C#経験者/20代後半～40代の方活躍中/経験年数不問】/在宅勤務
月給41万～50万円神奈川県横浜市(桜木町駅) -
基幹システム開発導入/東京都新宿区/【WEB面談可/C#経験者/20代前半の方活躍中/経験1年以上の方活躍中】/在宅勤務
月給29万～34万円東京都新宿区(西新宿駅) -
基幹システム開発導入/東京都新宿区/【WEB面談可/C#経験者/20代後半～40代の方活躍中/経験年数不問】/在宅勤務
月給41万～50万円東京都新宿区(西新宿駅)
関連記事Related Posts
-
.NET FrameworkでC++が使えるC++/CLIとは何か
C++/CLIは、.NET Frameworkの共通言語基盤で使用するプログラミング言語です。 ここでは、C++/CLIの概要を要素に分けて紹介するほか、メリットについても解説します。 C++を使って共通言語基盤上でプロ […]
-
C#で「try-catch文」を使った例外処理を行う方法
プログラム上ではどれだけバグを防いだとしても、ユーザー側が原因で予期せぬ例外が起こってしまうことがあります。そんなときに行う例外処理。C#では、例外処理として「try-catch文」を使うことが基本です。この記事では、t […]
-
.NET Frameworkの下位バージョンの互換性について
.NET Frameworkとは、C#やVB.NETで開発したアプリケーションをWindowsで動作させるために必要な実行環境です。現在の最新版は4.8となります。この.NET Frameworkですが、上位バージョンと […]
-
【C#の基礎】List.Sortを使ったリストのソートとラムダ式での記載方法
Listなどのデータを整列させるために、C#ではSortメソッドが用意されています。整列には様々な方法がありますが、どれも一から作成するのは手間がかかるので、元々あるメソッドを利用していくのが良いでしょう。 List.S […]
-
C#のDecimal型を使った計算と型変換の方法
整数の演算であれば「int型」で事足りるかと思いますが、Decimal型では小数点以下の数値も扱うことができ、標準的な数値演算をサポートするメソッドも用意されています。 この記事では、Decimal型を使った計算や型変換 […]
