이번 포스트는 ASP.NET MVC3에 대한 여러 강좌를 모아모아~ 정리한 자료입니다.
주로 DEVLEC의 자료가 많음을 밝힙니다.
자세한 강좌 내용이나 소스를 원하시면 아래의 출처를 방문하여 주시기 바랍니다.
자료 출처
- 기본학습
- 그밖의 링크
- HTML5를 활용하여 빠른 웹 애플리케이션 개발하기 : http://wonsuk73.tistory.com/22
- Linq to MySQL : http://social.msdn.microsoft.com/Forums/en/linqprojectgeneral/thread/e9fc6bc7-fbc6-44c4-b37b-4b4a83beaa3e
ASP.NET MVC3 기본
- http://도메인/컨트롤러명/액션명
- HomeController을 만들면 『http://localhost:○○/』이렇게 치시면 그냥 『/Home/Index』가 나옴
- Action : Control에 public 으로 설정된 메소드, Index는 생략가능 (Global.asax에 정의됨)
Razor(레이저) 구문
- @으로 표현
- ASP.NET 엔진과 별개로 동작
- Razor Template + Data = Output
- 문법 : http://haacked.com/archive/2011/01/06/razor-syntax-quick-reference.aspx
ASP.NET 종류
- ASP.NET WEB FORM
- ASP.NET MVC : ASP.NET WEB FORM 에 MVC 프레임워크가 추가됨
- ASP.NET WEB PAGE (WEB MATRIX 사용)
헬퍼 메서드 : @helper
하나의 View에서 사용시
@helper SayHello(int FontSize, string Text) {
<div style="font-size:@(FontSize)">@Text</div>
}
~~~~~
<div>@SayHello(40, "Hello")</div>
여러개의 View에서 사용시
- ~/App_Code에 구성하면 여러 페이지에서 사용 가능. 예를 들면 Copyright를 여기저기 사용가능
- 프로젝트 우클릭 > 추가 > 새폴더 > App_Code
- App_Code 폴더 우클릭 > 새항목 > MVC3 VIEW PAGE(RAZOR) > 파일이름은 MyHelper.cshtml
- 내용을 다 지우고 ShowCopyright 라는 헬퍼 메서드 생성함
- 필요한 View에서 @MyHelper.ShowCopyright()
데이터 전달
controler
public ActionResult ChildList()
{
// ViewBag으로 넘기기
ViewBag.Data = "안녕하세요.";
ViewBag.Hi = "반갑습니다.";
Child child1 = new Child() { Name="홍길동", Age=7 };
ViewBag.Child = child1;
// ViewData으로 넘기기
ViewData["FromViewData"] = "Hello World";
// Model을 넘기기
//Child child2 = new Child() { Name = "Kimstar", Age = 12 };
//return View(child2);
List<Child> lst = new List<Child>()
{
new Child { Name="홍길동", Age=7 },
new Child { Name="백두산", Age=17 }
};
return View(lst);
}
View
@model List<MvcThree.Models.Child>
@{
ViewBag.Title = "ChildList";
}
<h2>ViewBag</h2>
<p>@ViewBag.Data</p>
<p>@ViewBag.Hi</p>
<p>@ViewBag.child.Name</p>
<h2>ViewData</h2>
<p>@ViewData["FromViewData"]</p>
<h2>Model</h2>
@*<p>@Model.Name, @Model.Age</p>*@
<p>
@foreach (var child in Model)
{
<text>@child.Name, @child.Age</text><br />
}
</p>
Model
namespace MvcThree.Models
{
public class Child
{
public string Name { get; set; }
public int Age { get; set; }
}
}
결과
ViewBag 안녕하세요. 반갑습니다. 홍길동 ViewData Hello World Model 홍길동, 7 백두산, 17
ViewBag & Html.Raw()
ViewBag
- dynamic타입(런타임에 타입 결정), ViewData[]의 업그레이드
- 주의사항 : ViewData["Title"] 는 ViewData.Title과 같은 값을 참조한다.
Html.Raw()
- encoding하지 않고 그대로 출력하고 싶을때.
- "<i>"를 인코딩하면 "<i>" 로 변경되지만, Html.Raw()라는 헬퍼메소드를 사용하여 "<i>"로 출력가능
- html이나 script등을 변환없이 출력시 사용
Controller
public ActionResult Index()
{
ViewBag.Message = "ASP.NET MVC 시작";
ViewBag.원하는모든단어 = "Kimstar";
ViewBag.Now = DateTime.Now;
ViewBag.설명 = "이것은 <u>설명</u>입니다.";
return View();
}
View
<h2>@ViewBag.Message</h2> <h2>@ViewBag.원하는모든단어</h2> <h2>@ViewData["원하는모든단어"]</h2> <h2>@ViewBag.Now.ToShortTimeString()</h2> <h2>@Html.Raw(ViewBag.설명)</h2>
결과
ASP.NET MVC 시작 Kimstar Kimstar 오후 4:02 이것은 설명입니다.
Partial View, Layout, ViewStart
Partial View
- 부분 페이지 : ascx와 같은 역할
- @Html.Partial("_Details", Model)
- Views > Home > 우클릭 > 추가 > 새항목 > MVC 3 부분 페이지 (Razor) > 생성된 부분 페이지에 코드 넣고 > 부분 페이지 포함할 곳에 @Html.Partial("_Favoriate", Model)
- 일반적으로 _를 접두어로 넣어서 만든다. (Favorite.cshtml 에서 부분페이지를 생성시 _Favorite.cshtml)
Layout
- 마스터 페이지에 레이아웃 생성하고, View에서는 본문만 작성
- @Url.Content("~/Content/Site.css") : ~는 Context Root로 변경됨
- @RenderBody() : 레이아웃에서 본문이 들어갈 곳
- @RenderSection("kimstar", required:false)
- 각 View에서 section을 만들면 레이아웃에서 해당하는 Section이 보여짐
- @section kimstar { <h3>Kimstar 입니다.</h3> }
- required:false를 추가하면 kimstar section이 없어도 오류가 안난다.
- IsSectionDefined() :
- section이 없으면 기본으로 보여주도록 layout을 수정하자.
- @if(IsSectionDefined("kimstar")) { @RenderSection("kimstar") } else { <h3>기본입니다.</h3> }
- Layout 지정
- _ViewStart.cshtml 에 _Layout.cshtml이 레이아웃으로 지정되어 있다.
- 레이아웃 안쓰는 View에서는 : @{ Layout = null; }
- 다른 레이아웃 지정하려는 View에서는 : @{ Layout = "~/Views/Shared/_MyLayout.cshtml"; }
ViewStart
- _VewStart.cshtml : 모든 View가 렌더링되기 전에 제일 먼저 호출되어 상속됨
- 예제
@{
Layout = "~/Views/Shared/_Layout.cshtml"; // 모든 View에 적용될 레이아웃
PageData["Message"] = "공통 메시지"; // View에서는 @PageData["Message"] 로 사용가능
//ViewBag.Message = "공통 메시지"; // 이건 사용 못함. 오류남.
// 그럼에도 불구하고 ViewBag에 넣고 싶다면...
var c = this.ChildPage;
if(c != null) {
var vp = c as WebViewPage;
if(vp != null) {
vp.ViewBag.Message = "공통 메시지";
}
}
}
라우팅
개요
- Routing : 물리적파일과 논리적 URL을 연결
- ASP.NET 4.0 엔진에 포함됨 : System.Web.Routing
- SEO (Search Engine Optimization) : 쿼리 파라미터 없어짐, 읽기 쉬움
- URL을 controller와 action method로 연결해줌
Global.asax.cs
- Application_Start()는 제일먼저 실행되는 메서드임.
- Application_Start()의 RegisterRoutes()는 라우팅 규칙을 등록시킴.
public static void RegisterRoutes(RouteCollection routes)
{
routes.IgnoreRoute("{resource}.axd/{*pathInfo}");
// 경로와 Default 값을 등록시킴
routes.MapRoute(
"Default", // 경로 이름
"{controller}/{action}/{id}", // 매개 변수가 있는 URL
new { controller = "Home", action = "Index", id = UrlParameter.Optional } // 매개 변수 기본값
);
}
- Controller 에서 아래와 같이 라우팅을 처리한다.
// /Home/About
public ActionResult About()
{
return View(); // *.aspx, *.cshtml 이 있어야 표시가된다.
}
// /Home/Test
public ActionResult Test()
{
return Content("안녕하세요");
}
// /Home/Test2/kimstar
// 라우팅 등록할때 "{controller}/{action}/{id}" 였으니까 파라메터는 id여야한다.
public ActionResult Test2(string id)
{
return Content(string.Format("안녕하세요. {0}", id));
}
// /Home/Test3/?name=kimstar
public ActionResult Test3(string name)
{
return Content(string.Format("안녕하세요. {0}", name));
}
Output 캐싱
개요
- Action 또는 Contrller에 Duration과 VaryByParam 등을 설정
- [ChildActionOnly] : 파샬뷰처럼 자식에만 캐싱을 설정
- output cache 액션 필터 설정
- VaryByParam :
- Location
- VaryByHeader
- VaryByCustom
- SqlDependency
예제
- Controller
[OutputCache(Duration=20)]
public ActionResult Index()
{
ViewBag.Message = "ASP.NET MVC 시작";
var model = DateTime.Now;
return View(model);
}
- View
@model DateTime <p> 컨트롤러에서 전송된 시간 : @Model.ToLongTimeString() </p>
- 결과 (20초 동안 안바뀐다)
@model DateTime <p> 컨트롤러에서 전송된 시간 : @Model.ToLongTimeString() </p>
새로운 Action Result
- 상태코드 확인을 위해 Fiddler 사용하면 좋다. http://www.fiddler2.com/
public ActionResult Test()
{
// 원래 리턴값
//return View();
// 404 Not Found 메시지 출력
//return HttpNotFound("찾을 수 없습니다.");
// 302 임시 이동
//return Redirect("http://kimstar.pe.kr/blog");
// 301 영구적 이동, 권장
//return RedirectPermanent("http://kimstar.pe.kr/blog");
// 특정 상태코드 출력
return new HttpStatusCodeResult(404);
}
Web Forms과 MVC3 함께 사용
- ASP".NET 웹 응용 프로그램"으로 프로젝트 생성
- nuget package 설치
- PM> Install-Package AddMvc3ToWebForms
- 웹사이트 실행 후 확인
- Web Form 테스트 : ~/Default.aspx
- MVC 테스트 : ~/Home/About





