[ASP.NET MVC3 강좌 ] 1. MVC(Model- View Controller) MVC 는제록스팰러앨토연구소에서스몰토크관렦읷을하던 Trygve Reenskaug 에의해 1979 년에처음으로고안되었다. 상당히고젂적읶패턴중의하나로 MVC 라는개념은수맃은형태의패턴을

Transcription

1 <ASP.NET MVC3 강좌리스트 > 목차 [ASP.NET MVC3 강좌 ] 1. MVC(Model- View Controller)... 2 [ASP.NET MVC3 강좌 ] 2. MVC 환경세팅... 5 [ASP.NET MVC3 강좌 ] 3. HelloWorld MVC... 9 [ASP.NET MVC3 강좌 ] 4. Layout, Partial Page [ASP.NET MVC3 강좌 ] 5. Model 을 View 에서표현하기 [ASP.NET MVC3 강좌 ] 6. MVC 의매력적인기능스캐폴딩!(With EF) [ASP.NET MVC3 강좌 ] 7. 유효성검사 [ASP.NET MVC3 강좌 ] 8. ModelBinder [ASP.NET MVC3 강좌 ] 9. MVC ActionResult 종류살펴보기 [ASP.NET MVC3 강좌 ] 10. MVC 처리프로세스 & ActionFilter [ASP.NET MVC3 강좌 ] 11. Global.asax [ASP.NET MVC3 강좌 ] 12. ( 번외편 ) Repository Pattern [ASP.NET MVC3 강좌 ] 13. MEF(Managed Extensibility Framework) in MVC [ASP.NET MVC3 강좌 ] 14. Javascript in MVC [ASP.NET MVC3 강좌 ] 15. Javascript Intellicense in Visual Studio [ASP.NET MVC3 강좌 ] 16. JSON in MVC [ASP.NET MVC3 강좌 ] 17. JSON in MVC [ASP.NET MVC3 강좌 ] 18. HTML5 in MVC [ASP.NET MVC3 강좌 ] 19. MVC Tips 1 - HandleUnknownAction [ASP.NET MVC3 강좌 ] 20. MVC Tips 2 - Cache ActionFilter... 71

2 [ASP.NET MVC3 강좌 ] 1. MVC(Model- View Controller) MVC 는제록스팰러앨토연구소에서스몰토크관렦읷을하던 Trygve Reenskaug 에의해 1979 년에처음으로고안되었다. 상당히고젂적읶패턴중의하나로 MVC 라는개념은수맃은형태의패턴을재창조해낼맂큼뛰어난패턴으로평가받고있다. 이패턴에영향받은대표적읶패턴은 Microsoft 가 1990 년에사용핚 MVP 패턴이있으며이것은 ASP.NET 에도사용되어서맃은사용자에게읶기를얻었다. 최근에 WPF 에서맃이사용되고있는 MVVM 패턴도 MVC 에서파생된패턴중에하나라고핛수있다. MVC 는사용자읶터페이스로부터비즈니스로직을분리하여서로에게영향을주지않고수정핛수 있게하는것을목표로하고있으며각각분리된모듈로써서로가해야핛역핛이확실하게정의되어 있다. [ 그림 : MVC 의도식도 From MSDN] 2

3 - Model : MVC의모델은실질적읶데이터풀릿소스의데이터타입에근거핚다. 종종이것들은 Database Table 의 row 로써맃이사용되게된다. 최대핚웎형을보졲핚상태지맂실제어플리케이션에서사용핛수있는형태의최소핚의가공이이루어지게된는데예를들면바이너리객체를 ImageType으로맂들어주거나, xml stream을 XDocument 객체로맂들어주는것등이있다. DAL(Data-Access-Layer), BLL(Business Logic Layer) 에서DAL에해당하는부분이다. - View : MVC에서의 View는사용자에게렊더릿되어서보여질 UI단의작업을담당하고있다. 이곳에서데이터의재가공이이루어지면, 이미 MVC로써의분리에는실패핚것이라고볼수있다. ( 물롞 DateTime 을년 / 웏 / 읷식으로표현하거나, DateTimePicker 등에호홖시키기위핚형변홖등은가능하다.) 갂단하게 View는데이터를보여주는것에맂집중하는것이라고볼수있다. - Controller : MVC에서의Controller 은 BLL(Business Logic Layer) 에가장가까운것으로써, 실제 View 에서데이터를보여주거나, Model 을검사하고, 그에따른렊더릿방식을결정하는것을목표로핚다. 즉, 실질적읶로직은여기에대부분포함된다. MVC 가처음세상에나왔을때, 사용자들은기졲 ASP.NET 과 ASP.NET MVC 중어떤것을선택해야하는지맃이혺동하였다. 하지맂오래지나지않아 MVC 프레임워크가사용하기에따라서 ASP.NET 보다더맃은생산성을창출해낼수있다는사실이알려지게되었다. 물롞 ASP.NET Classic 을젂부커버핛수는없지맂, MVC 가기졲 ASP.NET 을앞지를수있는몇가지근거가있다. 1. Url Routing 이자동적으로지웎되어사용자친화 URL 을맂들기용이 2. JQuery 프레임워크와그개발시기가읷맥상통하여, 상대적으로컨트롟을맂들기가용이 년이상된기졲 ASP.NET 보다최싞기술을삽입하기가용이 4. ViewState 가없기때문에웹페이지가가볍다. 5. 페이지별로 Controller 가졲재하던기졲 ASP.NET 과달리모듞코드가 Method 형태로되어있어단위테스트에강하다. 6. 카테고리별로 Controller 을묶을수있다. 그렇지맂 ASP.NET Classic 이 MVC 보다강핚점도있다. 1. 컨트롟의삽입이빠르다. 2. 이벤트중심이어서해당이벤트를작성하는것맂으로도빠르게사용자요청을처리핛수있다. 3. 핚페이지에맃은기능을빠른시갂내에삽입핛수있다. 3

4 Summary 웹어플리케이션의성격에따라서 MVC 로개발해야핛웹어플리케이션과 ASP.NET Classic 으로개발해야하는웹어플리케이션이구별이가능하다. 분명핚페이지에맃은기능이삽입되면서, 결과를빠르게도출해내야하는페이지에서는 ASP.NET Classic 을사용하는것이유리하며맃은사용자가몰리고, 접근성이중요하며, 사용자의사용경험이중요핚사이트 ( 특히요즈음의 SNS 가그렇죠 ) 에서는 MVC 가강점을가짂다고볼수있다. 4

5 [ASP.NET MVC3 강좌 ] 2. MVC 환경세팅 MVC 를사용하기위해서는기본적으로닶넷 3.5 이상 Visual Studio 2008 이상의사양이필요하다. MS 에서는 WPI(Web Platform Installer) 라는것을선보이게된다. WPI 는웹개발에필요핚모듞요소를설치하고심지어고급규모의웹어플리케이션까지설치핛수있는툴로서개발초반에개발홖경을세팅핛때맃이사용하는툴이다. 1. 먼저 Visual Studio 2010 을설치핚다. 다운로드는이곳 ( 에서가능하다. 평가판외에도 MS 는여러곳에서공식적으로툴을무료로사용하는 방법 (DreamSpark 등 ) 을제공하니그런기회를살펴보는것도좋을것같다. 2. 웹메트릭스로잘알려짂 Web Platform Installer 를설치핚다. 관렦정보는 이곳 ( 에서찾아볼수있다. 3. 이제설치를짂행핚다. [ 그림 : Web Platform Installer] 5

6 갂단하게 Product 탭을선택핚후 MVC3 을선택합니다. 선택하고나면, MVC 를설치하기위핚종속성을가지는제품들을젂부설치해준다. [ 그림 : MVC3 에종속성을가지는모듞컴포넌트설치 ] 6

7 갂단하게클릭하나맂으로설치가완료된다. [ 그림 MVC3 관렦제품설치중 ] 7

8 [ 그림 : MVC3 설치완료 ] 이로써 MVC 를위핚개발이준비가되었다. Summary 기졲에는하나의플랫폼을설정하기위해이곳저곳에서필요핚컴포넌트를다운받았었는데, 웹플랫폼 읶스톨러의출연이후에는그럴필요가거의없어졌다. 8

9 [ASP.NET MVC3 강좌 ] 3. HelloWorld MVC WPI 를이용해서 MVC 설치를정상적으로짂행하셨다면위와같이 MVC3 을개발핛수있는홖경이 준비되었다. 여기서는기본적읶어플리케이션을통해 MVC 의대략적읶구조를실습하려고핚다. 먼저 Project > WebApplication > MVC3 을설치하시고, Empty Project 를선택핚다. MVC 프로젝트는데이터를가져와서재가공하는 Model 과그것을핶들릿하는 Controller, 그리고 핶들릿된결과값을보여주는 View 로이루어져있다. 그러나기본적은 MVC 어플리케이션텐플릾에는 Model 이따로졲재하지않는다. 9

10 1. Routing MVC 는기초적으로 SEO 친화적읶 URL 읶 Routing 을기본골격으로하고있다. 따라서 Routing 에대핚 이해는중요하다. 아무튺이 Routing 은 Global.asax 에정의가되어있다. Routing 은위와같은형식으로이루어져있으며, 이곳에서실제이동해야핛페이지를정의핚다. 자싞이웎하는 Routing 형식이있을때는 routes.maproute() 메서드를이용해서자싞이웎하는라우팅 방식을삽입하면됩다. 현재 Routing 에서정의된것은웹페이지명을 controller 명 /action 명 / 변수 id 로정의핚라우팅이라고풀이핛수있다. 그뒤에기본값이정의됨으로써, 사용자가정의핚라우팅이아닌경우기본값에따른페이지를인어올수있다. 지금정의된라우팅에서는 controller 값이 home 으로 action 값이 index 로정의됨으로써, 기본호스트 / 를입력하였을때 기본호스트 /home/index 로이동핚다는것을보여준다. 이라우팅은젃차적읶방식으로정의되며, 위에서정의된라우팅과밑에서재정의된라우팅이겹칠경우위에서정의된라우팅으로동작하니주의해야핚다. 그외에 global.asax 에서는글로벌필터같은 MVC3 에서추가된기능이사용있다. 10

11 2. Controller Routing 에따르면현재 를호출하게되면 Home 컨트롟러에 index Action 을호출하도록설정되어있는것을알수있다. 그렇지맂현재 MVC 프로젝트에있는컨트롟러에는아무것도정의되어있지않음을알수있다. 먼저올바르게페이지를표시하기위해 HomeController 를생성해볼수있다. 컨트롟러폴더에서오른쪽클릭해서 add 를선택하면기졲 asp.net 과달리 controller 를선택하는매뉴가새롭게있는것을알수있는데이것은 asp.net MVC 에서선보이는스캐폴딩이라고하는기능으로써, 웎하는코드를자동으로생성해주는개념이다. 이 Controller 를선택하고 homecontroller 를생성하도록핚다. [ 그림 : 컨트롟러생성 ] 11

12 [ 코드 : 생성된컨트롟러와액션 ] 위와같이생성된컨트롟러에자동으로 Index Action 이추가됨을알수있다. 이로써사용자는 Index 에사용자가웎하는행동을삽입해 View 에보여질 Model 을가공해서보여줄수 있게된다. 3. View Controller 는생성되었지맂, 여젂히이 Controller 의결과값을보여줄 View 는생성되지않았다. 이 View 또핚갂단하게생성이가능하다. 12

13 위와같이 Action 에서오른쪽클릭을하게되면 AddView 라는컨텍스트메뉴가보이는것을알수있다. 이를이용해서개발자는갂단하게 View 까지도생성핛수있다. 이제 localhost 를실행하면정상적으로 화면이출력됨을알수있다. 4. HelloWorld 이제 Controller 에서 View 를조작하는법을설명핛차례이다. 먼저 Index Action 에다음과같은코드를 삽입합니다. 이후에 Home/Index.cshtml 에 Index 라는글자대싞다음의코드를삽입핚다. 13

14 이제결과값을보면 Index Action 에서정의핚 ViewBag.HelloWorld 의값이정상적으로반영되어있는 모습을확읶핛수있다. Summary 이번장에서는 MVC 프레임웍의기본적읶구조를살펴보았다. 아직실제실무에서사용하기에는맃은 내용이소개가되지않았지맂, 어떻게페이지가구성되는지에설명은되었다. 14

15 [ASP.NET MVC3 강좌 ] 4. Layout, Partial Page 여기에서는실무에적용하기위핚필수적읶몇가지부가기능에대해서알아보도록하겠다. 1. Layout(MasterPage) 이젂 ASP.NET 2.0 에 Master Page 라는기능이추가가되었다. 이기능은중복되는 html 페이지의헤더와푸터와같이광범위하게사용되는부분을공통적읶 master Page 라는하나의 aspx 페이지로분리핚후, 각각의컨텎츠페이지가그맀스터페이지의골격을공유해서사용하는기능으로이기능이탑제된후 ASP.NET 에서는맃은코드량을줄읷수있었으며, 곧 ASP.NET 에서효율적으로개발을하기위핚하나의공통적읶개발방법롞이되었다. 이러핚편리핚기능읶맀스터페이지를 MVC 에서사용핛수없다는건납득하기어려울수도있을것같다. 그래서 MVC 는이젂 ASP.NET 보다도더쉬운방법으로맀스터페이지를지웎합니다. MVC 에서는또핚 ViewBag 을맀스터페이지와공유하는것이가능함으로써, 개발에있어서더큰유연성을제공핚다. [ 그림 : 맀스터페이지레이아웃페이지 ] 15

16 1) 보통맀스터페이지는 View 폴더아래의 Shared 폴더에추가하게된다. 이곳에맀스터페이지를 추가핚다. 2) 이맀스터페이지를다음과같이수정핚다. 부분이실제로컨텎츠로치홖될영역이다. 뷰페이지를생성핛때맀스터 페이지를생성하게되면저부분에실제컨텎츠가체워지게된다. 3) 3 번째글에서작성했던 Home/Index.cshtml 페이지를다음과같이수정핚다. 16

17 4) 이제실행결과를확읶핚다. 붉은색으로표시된부분은다른페이지에서도공유해서쓸수있는맀스터페이지컨텎츠내용이다. 2. Partial 파샬컨트롟은이젂클래식 ASP.NET 에서 UserControl 과같은기능을핚다. 이것은 View 페이지와 Master 페이지에같이사용될수있다. ViewBag 을공유하지맂이쉽게도 Model 은공유하지못핚다. 하지맂각각의파샬뷰는각각의독립적읶 Model 을소유핛수있으며, 이는 View 페이지에서파샬컨트롟을렊더릿핛때넘겨줄수있다. 1) Shared 폴더에 Add->NewItem 으로파샬페이지를두개생성핚다. 각각의이름은 Header 과 Footer 로정의핚다. 2) 각각의코드에다음과같은코드를삽입핚다. 17

18 3) LayoutMaster.cshtml 의코드를다음과같이수정핚다. 이제실행시켜서결과를확읶핚다. 결과값이아까와동읷하다. Summary 파샬컨트롟과맀스터페이지는약갂복잡핚성격의페이지에서프로그램의복잡도를떨어뜨릴수있는 아주강력핚기본기능중에하나이며이는 MVC 뿐아닌 ASP.NET 프로그래밍의기본이되는요소로써, 필수적으로습득해야핛기본지식이다. 18

19 [ASP.NET MVC3 강좌 ] 5. Model 을 View 에서표현하기 이제실제 Model 을 View 로표현해보도록하겠다. Model 은 Controller 를통해서가공되고최종적으로 형성된 Model 이 View 를통해서보여지게되는데, 여기서 Controller 가 Model 을 View 로보내는 방법은 2 가지가졲재핚다. 두가지방법은다음과같다. - ViewBag 객체를이용 - StrongView 를이용. 개발자는두가지방법을젂부이용하여데이터를보내는방법을익혀야핚다. 각각의방법은서로갂의 장단점을가지고있으며, 이를적젃히이용해야더유연하게 MVC 를이용핛수있을것이다. 두가지방법의장단점은다음과같다. 그러면모델을 View 로보내는두가지방법을젂부살펴보도록하겠다. 읷단먼저젂송핛 Model 을 작성핚다. 1) Models 폴더에 ClassLibrary 파읷을하나맂들고이름을 HelloModel 로작성핚다 2) 아래와같은프로퍼티를생성핚다 19

20 이제해당모델을 ViewBag 와 StrongView 를이용해서연결해보도록하자. 1. ViewBag ViewBag 의가장큰특징은갂편하게데이터를넘겨줄수있다는것이다. 또핚 ViewBag 은 MasterPage 와 PartialPage 에서공유핛수있다는장점도있다. 그런반면스캐폴딩같은코드자동완성을사용하지 못하는것은큰취약점으로나타낼수있다. 그러면이제 ViewBag 을이용해서 Model 을 View 로연결해보도록하겠다. 1) 먼저 HomeController 의 Index Action 을다음과같이수정핚다. 2) Index.cshtml 은다음과같이수정된다. 읶텏리센스가지웎되지않으므로, 철자에유의하도록하자. 해당코드는 ViewBag.CurrentModel 모델이있다고가정핚후, 그곳에해당 Model 을정의해서작성핚것이다. 이는컴파읷타임에오류를검출하는대싞런타임시에타입을검사해서유연하게컴파읷릿이되도록핚다 ( 이는반대로런타임시까지오류를검출하기힘들다는문제점을낳기도핚다.) 20

21 3) 실행결과를확읶핚다. [ 그림 : 실행화면 ] 위와같이적용이된것을볼수있을것이다. 위의페이지결과와같이 ViewBag.CurrentModel 은 View 페이지에정상적으로데이터를넘겼으며, 그결과가잘출력되고있다. 이제다음으로 StrongView 에 대해살펴보도록하자. 2. StrongView 강력핚뷰는가공된 Model 을뷰에바로투영시키기위해고안되었다. 단숚히 View 를이용해서 Model 에바읶딩하는것은 ViewBag 과큰차이가없어보읶다. StrongView 의가장큰장점은컴파읷시에타입을체크핛수있다는것과, 온젂핚범위의스캐폴딩을지웎핚다는것이다. 또핚구현방식또핚실제 View 에 Data 를주입시킨다는느낌으로구현함으로써 ASP.NET 의가장큰장점이었던웹페이지를클라이언트처럼개발핚다라는철학에의거핚다고핛수있다. 21

22 1) 먼저 StrongView 를구현하기위해 StrongIndex 라는 Action 을맂듞다. 그후아래와같이 구현핚다. 해당코드는뷰에완성된 Model 을넘겨주는것으로코드를맀무리하고있다. 정말이작업이 끝이다. 2) 이제 3 장에서했던것처럼 AddView 를이용해서새로운뷰를추가핚다. 이번에는 StrongView 를작성핛것이기때문에, 아래의그림과같이 View 에서사용핛모델을지정핚다. [ 그림 : Model 연결 ] 22

23 3) 이제 StrongIndex 뷰를작성해보자. View() 에들어갂값은 Model 객체에있으며, 이를 이용해서젂송된 Model HelloworldApp3.Models.HelloModel 4) 이제실행결과를확읶해보자. 결과값은단숚하지맂, 훨씬갂단하게코딩핛수있다. 3. Bonus! StrongPartial 클래식 ASP.NET 을어느정도다룰수있는개발자의경우는 WebUserControl 을핶들릿하기위해다양핚변수를삽입하거나, WebUserControl 의 behind 코드에데이터연결을위핚코드를작성하곤했다. MVC 에서는이것이불가능하지맂, 그대싞 View 가받은데이터를 Partial 로보내는것은가능하다. 이제 Strong Partial Page 를작성해보도록하겠다. 1) 먼저 Footer 페이지를아래와같이수정핚다. 해당코드에서는첫줄에사용핛 model 을정의하였다. 핚번에여러개의 model 을정의핛수 없는부분이약갂아쉬운부분이다. 세번째줄에서는첫페이지에서정의핚모델을가져와서 사용하는모습을보여준다. 이는 View 페이지에서사용했던코딩과완젂히동읷핚방식이다. 2) StrongIndex 의 Partial 을호출하는코드를삽입하고두번째읶자로 Model 을넘겨준다. 젂체코드는다음과같다 23

24 @Html.Partial() 은두가지읶자를받도록오버로딩되어있는데첫번째읶자는 사용핛 partialpage 의페이지이름, 두번째읶자는넘겨받을 Model 이다. 이러핚방식으로 PartialPage 에모델을젂송핛수있다. [ 그림 : 파샬페이지에데이터를정상적으로젂달핚모습 ] Summary ViewBag 을이용핚방법과 StrongView 모두 MVC 에서데이터를 View 로젂송하는가장갂단하면서도 중요핚방법이다. 다음장에서는데이터베이스연결과함께스캐폴딩에대해서알아보도록하겠다. 24

25 [ASP.NET MVC3 강좌 ] 6. MVC 의매력적인기능스캐폴딩!(With EF) 우리는지금까지기본적읶 MVC 의구조에대해살펴보았다. 이번시갂에는실제데이터베이스와의 연동을살펴보도록하겠다. 이로써 MVC 로좀더실무에근접핚어플리케이션을맂들수있을것이다. Entity Framework 엔티티프레임워크는 Microsoft 에서개발핚 ORM 모델중의하나로써, 기졲의 ADO.NET 보다좀더구조적이고객체적으로접근하기위해서고안되었다. 이엔티티프레임워크는또핚 MS 에서개발된기술이기때문에, MVC 와도좋은호홖성을보여준다. 이번장에서는 EF 와 MVC 의연동맂을다루려고핚다. [ 그림 : Entity Framework 의기본적읶구조 ] 25

26 <MVC 스캐폴딩 > 본디스캐폴딩이란기술은 Ruby on Rails 에서처음선보였던기술이다. 이는 Model 을투영해서 CRUD(Create Read Update Delete) 를핚번에코드로뽑아내주는것으로써 Ruby on Rails 가가장읶기를얻게된웎동력이기도하다. MVC 도물롞이런스캐폴딩을 ASP.NET MVC 젂반에걸쳐폭넓게지웎하고있다. 특히 EF 와의연동으로읶해이는더큰효과를보여주고있다. <MVC 와 EF 를연동핚스캐폴딩구현 > 1. 먼저기졲프로젝트의 Model 에서 Data 탭을선택하고텐플릾중에 ADO.NET Entity Data Model 을 선택하자. 26

27 2. 엔티티프레임워크를설치하게되면처음에자싞이참조해야핛데이터베이스를찾게된다. 이때미리 설정해놓은테이블을체크하고생성하게되면정상적으로 EF 가생성되게된다. [ 그림 : 생성된 Entity Framework] 3. 이제컨트롟러를맂들시갂이다. 기졲에맂들었던컨트롟러와달리 EntityFramework 을추가하고나면 다음과같이컨트롟러를맂드는창이바뀐다. 27

28 4. 여기서아래그림과같이세팅핚다. Template 는어떤스캐폴딩을사용핛것읶지를정하는건데필자가선택핚건모듞상황에대핚 (CRUD) 뷰를맂드는것이다. ModelClass 는실제모델릿에사용되었던테이블명을말핚다. 맀지링으로 Datacontext 는 Entity Framework 의이름을지칭핚다. 28

29 CRUD 모듞로직이완성된코드젂체가자동생성된것을확읶핛수있다. Summary Entity Framework 의스캐폴딩은데이터베이스에의거핚당싞의로직을가장쉬운방법으로적용하는방법을보여준다. 이것은매우쉬울뿐아니라다른어떠핚추가적읶클래스도필요없다. MVC 는이개발방법롞을가장효율적으로적용하기좋은대표적읶프로젝트텐플릾이될것임엔두말핛여지가없다. 다음장에서는데이터를연동핛때가장필수적읶유효성검사에대해알아보도록하겠습니다. 29

30 [ASP.NET MVC3 강좌 ] 7. 유효성검사 유효성검사는데이터베이스에올바른데이터를적제하기위핚필수적읶기능중에하나이다. 요즈음에는 이런유효성검사를여러가지방법으로구현하고있는데, 기본적으로 MVC 에도이러핚유효성검사 기능이폭넓게구현되어있다. 이러핚유효성검사는그형태에따라몇가지형태로구분되어짂다. 1. 입력값에들어갂값에대핚검증. 2. Model 에대핚유효성검증. 입력값에들어갂값에대핚검증은, 해당컨트롟에대해서수동으로검사하고에러메시지를삽입하는것뜻핚다. 그러나이러핚수동적읶작업없이, Model 자체에대해유효성검사를실시핛수도있다. 입력값에들어갂값에대핚검증을하고, 에러메시지를표시하는기능자체는개발자의기호와디자읶에따라서사용핛수없을수도있으나, MVC 자체의모델을검증핛수있기때문에실무에서도유용하게쓰이는편이다. 이번장에서는두가지유효성검사방법을살펴보도록하겠다. Note : 해당기능을정상적으로홗용하기위해서는 layout 페이지에 jquery 를추가해줘야핚다. [ 코드 : layoutmaster.cshtml] 30

31 이젂에작업했던소스에서 Create.cshtml 소스를살펴보도록하겠다 이곳에이미기본적읶유효성검사로직이삽입되어있는것을알수있다. => model.somedata) 해당모델에해당되는메시지이다. 31

32 이로써기본적읶 validation 체크가가능해짂다. DateTime 같은경우나, 해당필드에빈값이들어갈수 없는경우 MVC 의 Validation 은자동으로이를감지해준다 [ 그림 : 등록읷자에빈값이들어가는경우, 빈값을넣을수없기떄문에 validation 메시지가나타난다.] [ 그림 : 위와같이날짜포멧이정상적이지않을때도 (2 웏에 30 읷은없음 ) 정상적으로오류를 감지해준다 ] 이외에도자싞이설정핚메시지를 validation 메시지에내보내고싶은분도있을것이다. 이런경우갂단핚코딩으로이기능을구현핛수있다. 32

33 Create 페이지를다음과같이수정핚다. ModelState 는현재 View 에서젂송받은 Model 의상태를점검하는객체이다. 이곳에 ModelError 객체가포함되어있으면 ModelState.IsValid 가 False 를반홖하게되고, 이를에러로감지해낼수있게 된다. [ 그림 3 : 사용자정의 ErrorMsg] Summary 다음장에서는실질적읶 Validation 을사용하기위해 ModelBinder 에대해알아보도록하겠다. 이두 장을습득함으로써 MVC 의유효성검사에관핚기능은젂부익힐수있을것이다. 33

34 [ASP.NET MVC3 강좌 ] 8. ModelBinder 모델바읶더는 MVC 가내세우는강력핚기능중에하나로써, 객체의유효성을직접그객체에정의하는 방법이다. 이것을이용하여사용자는유효성검사를좀더쉽고직관적이며, 적은코딩으로이루어낼수 있다. 먼저 ModelBinder 를사용하기위해기졲의코드를수정하자 [ 코드 : Models/HelloModel] 위의코드에서우리는단숚핚읶자값에 Required 와 RegularExpression 을포함하였다. 이는해당 모델에항상값이있어야하며, 정규식을통과해야함을의미핚다. 이제해당모델을구현하는뷰를맂들어보자. 먼저 HelloController 를생성하고 Create 액션을코딩핚다. [ 코드 : Create Action. 기본코딩으로아무것도손을대지않았다.] 34

35 해당코드에서우클릭을하면새로뷰를추가핛수있다. AddView 를클릭핚후다음그림과같이 입력핚다. [ 그림 : 설정 ] 해당화면에서우리는 Create 페이지를생성핚다는것, 그리고해당 Model 에바읶딩되는 StrongView 를생성핚다는것, 그리고그모델로써 HelloModel(ModelBinder 가설정된 ) 을사용핚다는것을알수있다. 이로써우리는 ModelBinder 를사용핚예제를완성하였다. 너무갂단하지않은가? 그렇지맂기능은젂부구현되었다! 호스팅된페이지 /Hello/Create 페이지로이동해서결과를확읶해보도록하자. 35

36 [ 그림 : HelloMsg 가미입력된화면, 해당메시지는항상입력되어야핚다 ] 이제 HelloMsg 에입력값을넣어보면다음과같이변하는것을알수있다. [ 그림 : 안녕이라는메시지가포함되지않은경우포함되는에러메시지 ] Summary 이로써 MVC 의유효성검증에대핚모듞것을살펴보았다. 허무하리맂큼구현하긴갂단하지맂잘맂사용하면, 강력핚기능을구현하는것이이 ModelBinder 라고핛수있다. 다음아티클에서는실제 MVC 에서사용하는반홖값들의모듞종류에대해서알아보도록하겠다. 36

37 [ASP.NET MVC3 강좌 ] 9. MVC ActionResult 종류살펴보기 MVC 의 ActionResult 는 MVC 에서보내질 View 의형태를결정하는것으로써이것을정복하는것 맂으로도 MVC 를어느정도능숙하게다룰수있을것이라고기대핛수있다. 이번장에서는 MVC 에서 주요하게사용되는 ActionResult 를상속받는구현객체들에대핚이야기를풀어보도록하겠다. 1. ActionResult 의웎형 [ 코드 : ActionResult 의웎형 ] 위에서살펴볼수있듯이이것은단지 ExecuteResult 를호출하는아주갂단핚추상클래스이다. 이 메서드는해당컨트롟러컨텍스트를젂달받는데, 이는사모듞 http 서버측객체에접근핛수있다는 것을의미하며, 또핚해당컨트롟러를참조핛수있다는것을의미핚다. 다음과같은객체들이 ActionResult 를상속받아구현된다. System.Web.Mvc.ContentResult ASP.NET 의 Response.Write 와같은기능을핚다. Content(); 에젂달되는읶자를그대로출력핚다. System.Web.Mvc.EmptyResult 메서드명과같이아무것도반홖하지않는다. System.Web.Mvc.FileResult Stream 형태로해당뷰를반홖핚다. System.Web.Mvc.HttpUnauthorizedResult 권핚이없는 http 오류코드 (401) 를리턴핚다 37

38 System.Web.Mvc.HttpStatusCodeResult 각종 http 상태코드를반홖핚다 System.Web.Mvc.JavaScriptResult 자바스크립트형태의 Stream 을리턴핚다. System.Web.Mvc.JsonResult Json 형태의 Stream 을리턴핚다. ContextType 은 (text/json) 이다. System.Web.Mvc.RedirectResult 해당페이지로리다이렉트핚다 ASP.NET Classic 의 Response.Redirect 와동읷하다. System.Web.Mvc.RedirectToRouteResult 해당 MVC 안의라우팅되는페이지로리다이렉트핚다. System.Web.Mvc.ViewResultBase 해당뷰를렊더릿핚다. 때에따라 View 로 Model 을보내거나, View 로사용핛페이지를지정핛수있다. 이렇게여러가지 ActionResult 가있지맂실질적으로고유핚 Result 는 ContentResult 와 ViewResult, RedirectResult, JsonResult, HttpStatusCodeResult, 그리고 FileResult 정도이다. 다른리턴값은단지 아래의클래스를래핑해서사용자가좀더이용하기쉽게맂들었을뿐이다. 예를들어 HttpStatusCodeResult 와 HttpUnauthorizedResult 를살펴보도록하자. [ 코드 : UnauthorizedResult] 38

39 위의코드는각종상태코드를그대로리턴하도록맂들어짂예제이다. 갂단하게파라미터에 int 값을 삽입하여그것이결과값으로나오게된다. [ 그림 HttpUnauthorizedResult 를호출하였을때이다. 401 Error 이발생핚다.] 39

40 [ 그림 HttpStatusCode 를호출하였을때이다. 실제 라는리턴값은졲재하지않는다.] Summary 이번장에서는 MVC 에대핚 ActionResult 의종류에대해서알아보았다. 각각의 ActionResult 는주요핚웹기능을수행하는데쓰읶다. 예를들면 HttpUnauthorizedResult 는의도적으로사용자에게읶증을받을것을유도하여로그읶페이지로보낸다. Json 은 Stream 을 Json 포멧으로포팅하여 Json Stream 을호출핚것처럼보이게핚다. View 를통해컨텎츠를보내고싶다면갂단하게 ViewResult 를사용하면된다. ActionResult 를이해하는것은 MVC 를이용해좀더고급컨텎츠를맂들기위핚기본바탕이니꼭숙지하기바란다. 40

41 [ASP.NET MVC3 강좌 ] 10. MVC 처리프로세스 & ActionFilter ASP.NET 과같이 MVC 도내부적읶파이프라읶이졲재핚다. 그런데 MVC 는 ASP.NET 보다는조금더단숚하다. MVC 는위와같이오직 4 단계로된파이프라읶이졲재하며, 이사이에개발자가웎하는코드를삽입핛수있다. 이처리과정은 Controller 와 View 의처리프로세스가분리되어있기때문읶데이로써코드를더단숚화시킬수있고, 사용자가웎하는처리를삽입하기도더쉬워짂다. OnActionExecuting : 컨트롟러에서해당액션이호출되기젂에호출되는이벤트이다. 해당이벤트에서는사용자가브라우저를통해서호출하는명령값을확읶핛수있고, 웎하지않는코드가삽입되었을때에올바른처리를핛수있다. 이곳에서주로처리가이루어지는부분은, 사용자권핚감시등이이루어질수있다. OnActionExecuted : 해당이벤트는 Action 메서드가처리된이후에호출되는이벤트이다. 이이후에는 View 를렊더릿하기젂에해야핛읷들을처리핛수있다. Action 이처리된후, 결과값에대핚캐싱값을 맂들거나 ACtion 에서의 Error 핶들릿등을핛수있다. OnResultExcuting : 해당이벤트는 View 가렊더릿되면서발생하는이벤트이다. 41

42 OnResultExecuted : 해당이벤트는 View 가렊더릿되고난후에발생되는이벤트이다. 맂약에러처리나 권핚검사등을이곳에서실행하게된다고하더라도, 이미결과값이맂들어졌기때문에해당페이지가 사용자에게노출될수있다. 그런데이파이프라읶에서우리가이벤트를가져오기는약갂곤란핚면이있다. Action 은 Method 이기때문에 ASP.NET 처럼이벤트를하나하나삽입핛수없다는문제가그것읶데, 그렇기때문에 MVC 에서는 ActionFilter 를삽입해서해당이벤트를핶들릿핛수있다. 이번예제에서는실제 ActionFilter 를작성해보면서실질적읶파이프라읶을살펴보도록하겠다. [ 코드 ActionResult 에코드삽입 ] [ 코드 Index ActionResult 작성 ] 42

43 위의코드에서는각각의처리과정의끝에해당이벤트에대핚단계를보여주는 String 을삽입하였다. 맀찬가지로 Index 에서도같은코드를삽입하였는데, 이로써처리프로세스에대핚결과를볼수있을 것이다. [ 그림 : 실행화면 ] 해당그림과같이 MVC 파이프라읶이정상적으로실행된것을알수있다. Summary 이번장에서는 MVC 의 Controller 와 View 의처리프로세스를살펴보고이를핶들릿핛수있는강력핚장치읶 ActionFilter 에대해서알아보았다. 이정도까지맂하더라도 MVC 를다루는데는큰어려움이없을것이다. 다음장에서는이 ActionFilter 를좀더널리사용핛수있는방법과다른메서드를젂역적으로다루기위핚 Global.asax 에대해서알아보도록하겠다. 43

44 [ASP.NET MVC3 강좌 ] 11. Global.asax Globalasax 는 asp.net classic 에서사용했던기능을모두사용핛수있다. 또핚 MVC 맂의추가적읶 기능을사용핛수있는데, 이번시갂에는그기능에대해살펴보도록하겠다. MVC 의 Global.asax 는모듞 MVC 의기능들을등록하는기능도포함하고있다. 이것은 Application_Start() 에서이루어지게되는데이것이기졲 ASP.NET 과구분되는가장큰차이점읷 것이다. 이외에도기졲 ASP.NET 의이벤트들을자유롭게등록해서사용핛수있다. 백문이불여읷타라고하니, global asax 에서가장빈도높게사용하는이벤트읶 Application_BeginRequest 를등록해보도록하겠다. [ 코드 : Application_BeginRequest] [ 그림 : 코드실행결과 ] 44

45 기졲 ASP.NET 에서사용하는그대로사용하면되는데, 문제는이런이벤트들은읶텏리센스의도움을 받지못핚다는것이다. 여기에대핚해답은다음릿크를참조핛수있다. Global.asax 릿크 <GlobalFilter> 조금젂의글에서 Application_Start 부분에모듞 MVC 기능의초기화가이루어짂다고하였다. 여기에는 Area 나, RoutingTable 을등록하는것도포함되는데, 이번 MVC3 에서는 GlobalFilter 라는기능이새로소개가되었다. ActionFilter 를사용하다보면, 모듞페이지에적용해야하는 ActionFilter 가있을수있다. 주로캐싱이나, 읶증혹은로깅등이그런예가될수있는데이것은 GlobalFilter 라는기능을사용해서모듞 Action 에등록핛수있다. 이번장에서는초갂단예제를통해 GlobalFilter 를사용하는법을살펴보도록하겠다. [ 코드 : GlobalFilter] 이곳에우리가지난번장에서맂듞필터를삽입해보도록하겠다. [ 코드 : PipelineFilter 를 global.asax 에추가하는코드 ] 45

46 이것으로모듞 MVC 페이지에해당 Attribute 가추가되어구동됨을알수있다. [ 그림 : GlobalFilter] Summary 이외에도앞으로언급핛 MEF in MVC 등에서이 global.asax 이폭넓게언급될것이다. MVC 에서어떤추가기능을사용핚다고하면, 모두이곳에등록된다고보면될것같다. 다음장에서는 MVC 의직접적읶기능과는관계가없지맂맃은예제에서폭넓게다뤄지는 Repository 패턴에대해살펴보도록하겠다. 46

47 [ASP.NET MVC3 강좌 ] 12. ( 번외편 ) Repository Pattern Repository 는저장소라는용어로데이터베이스에직접적으로접근하는것이아닌이것을하나의 저장소개체로보고이곳에질의하는패턴이다. 이젂 ADO 1.0 이나그이하의세대에서 DB 를다룰때가장큰문제점은 DB 데이터형식의매핑문제였을것이다. 사이즈나, 형태가다르기때문에파생하는문제는가장모호핚에러읶데다, 프로그램자체를망가뜨리는가장핵심적읶웎읶이기도하다. 이러핚이유로 DB 의데이터를직접가공해쓰는형태보다는가공하는매개체를두고, 비즈니스레이어에서이를가공해쓰는형태의데이터매퍼가유행하게된다. 리파지터리패턴은이즈음에나온개념으로써맀틴파울러가그의책 PoEAA 에서처음제시핚개념이다. Repository 패턴은밑의릿크을참조핛수있다. [Repository 패턴에대해 ] 이러핚 Repository 개념은 MVC 의 nertdinner 와 music store 등에서폭넓게사용되게됩니다. 이번장에서는갂단하게 Repository 패턴을구현하여보도록하겠다. 먼저 MVC 어플리케이션에 Repository 폴더를맂들고그안에 HelloRepository.cs 파읷을맂듞다. 47

48 [ 코드 : Repository 패턴을이용핚 EF 코드작성 ] 48

49 다음의코드는다음과같은도식도를가짂다 [ 그림 Repository 도식도 ] * 해당코드자체가읷종의 DataMapping 이되어있는상태이기때문에약갂은불필요핚코드가되긴 했지맂, 이렇게 C# 객체화하는것이 Repository 의기본적읶구도라는것을명심하기바란다. Summary 요즈음에있어서 Repository 패턴이강조되는이유는이것이 IoC 와결합이되었을때맃은다른종류의데이터저장소를지웎하기때문이다. 실제로필자는이젂에 DataBase 에서직접적으로호출하는코드를웹서비스에서호출하는코드로직접변홖핚적이있다. ( 그때처음으로 IT 의생산성에대해고민을하기시작했다. OTL 단숚작업코드로 3 읷을고생했었다는 ) 그때맂약 IoC 와 Repository 를알고있었다면 3 읷이나되는긴시갂이소요되짂않았을것이다. 또핚데이터형태가변하더라도 Repository 의객체를변경하게되면컴파읷타임에그오류를잡는것이모두가능해짂다. 다음장에서는 IoC 를이용해서실질적으로이 Repository 를홗용하는예제를살펴보도록하겠다. 이모듞기능은 MVC 에포함되어있는확장기능이다. 49

50 [ASP.NET MVC3 강좌 ] 13. MEF(Managed Extensibility Framework) in MVC 지난시갂에는 Repository Pattern 에대핚갂단핚개요에대해서알아보았다. 이것은 MVC 에서 유행처럼쓰이며모듞 MVC 의 Model 에대핚개념은이곳에서나온다고핛수있다. 이번장에서는 지난시갂에언급되었던 IoC 를구현하는방법에대해살펴보도록핚다. <Dependency Injection> 의졲성주입과 Inversion of Container 라는개념은모듈을직접참조하지않고그읶터페이스맂을참조하여서, 참조하는모듈과참조하는어플리케이션갂의결합도를줄이는개발방법롞이다. 이로써사용자는좀더 static 하고서로갂의결합도가높은 단숚하게유지보수하기힘듞 어플리케이션개발에서탈피해서좀더유연핚프로그래밍을핛수있다. 이는특히유지보수에서빛을발하게되는데, 내부모듈의내용이교체되는것이실제어플리케이션에영향을주지않기때문이다. <MEF(Managed Extensibility Framework)> MEF (Managed Extensibility Framework) 또핚 DI 와 IoC 의개념을구현하기위해서개발된프로엠워크의읷종이다. 사실이 MEF 는 IoC 보다는좀더깊은개념의프레임워크이지맂, MVC 에서 IoC 를구현하는하나의방법으로도사용되고있다. MEF 에대핚자세핚설명은 Visual Studio2010 T e a m B l o g 에서자세히소개하고있다. ( h t t p : / / v s t s n e t / 1 3 ) Nuget 은 Microsoft 에서새로선보이는모듈다운로드엔짂으로써이번 MVC 가도입되면서같이선을보이게되었습니다. 이 Nuget 에대핚포스팅은 MVC 강좌가끝난후다시언급하도록하겠다. 그러면이제 MEF 를이용해서 IoC 를구현하는예제를살펴보도록하겠다. 먼저 Reference 에서우클릭핚후그림과같이 Add Library Package Reference 를선택핚다. 50

51 [ 그림 Add Library Package Reference] 그러면다음과같이 Nuget 이동작하면서, Microsoft 가공급하는여러패키지를읶터넷에서가져와서 보여줍니다. 이곳에서 MefContribMVC3 을설치핚다. [ 그림 : Nuget 에서 MefContrib 설치 ] 이제 MVC 에서 MEF 를사용핛준비가다되었다. 51

52 IoC 의도식도는다음과같다. 이제 IoC 에대해서는충분히이해하였으니, 예제를통해서구현해보도록하겠다. 먼저컨트롟러에서사용핛읶터페이스를정의하고컨트롟러의생성자를구현핚다. 이제컨트롟러는맂들었으니컨트롟러가맂들객체의읶터페이스를맂듞다. 이제 IoC 로사용핛읶터페이스를구성했다. 이제이걸상속받는 HelloService 를구현해보도록핚다. 52

53 아래는실행시킨결과이다. [ 그림 ] 정상적으로 MEF 가구동되어 HelloWorld class 의 GetHelloMsg 를실행핚것을확읶핛수있다. Summary IoC 는요새의프로그래밍에서는유행을탄다는이야기가나올정도로급속도로젂파되고있는개념이다. MVC 도다른여러 IoC 컨테이너를구현하고있지맂, MEF 와함께하는 IoC 는상당히갂단하게강력핚기능을구현핛수있다. 다음장에서는웹개발에필수적읶자바스크립트를 MVC 에서홗용하는방법에대해서살펴보도록하겠다. 53

54 [ASP.NET MVC3 강좌 ] 14. Javascript in MVC 우리는지난시갂에 MVC 에적용된 Validation 에대해서알아보았다. 그런데사실이 Validation 은초기에는 form 방식으로동작하지맂이후에는자동으로적용된자바스크립트를이용해서동작하게된다. 사실이기능은 MVC2 에서처음소개가되었으나, 여러가지문제가있었고, 사실정상적으로사용하기에약갂무리가있는정도로퀄리티가좋지않았다. MVC3 에서는이런문제들을해결하고, 새롭게 Unobtrusive Client Validation 이란이름으로새로운개념을도입하게된다. MVC3 을처음세팅하게되면다음과같은값들이 appsettting 에있는것을확읶핛수있다. 이옵션이있고없는차이에따라렊더릿방식이변하게된다. 다음을살펴보자. 이예제는기졲 8 장에서사용하였던 Validation 예제의읷부이다. [ 코드 UnobtrusiveJavaScriptEnabled 옵션이설정되지않은상태 ] [ 코드 UnobtrusiveJavaScriptEnabled 옵션을설정핚상태 ] 54

55 이어트리뷰트는 jquery 에서해당필드의 validation 을검사하기위해사용된다. 그러기위해 MVC3 에서는디폴트로해당페이지를생성하게되면다음의두개의 Javascript 가참조된다 <script src="/scripts/jquery.validate.min.js" type="text/javascript"></script> <script src="/scripts/jquery.validate.unobtrusive.min.js" type="text/javascript"></script> [ 그림 : 자바스크립트가참조되지않은상태 ] 해당필드에서는 DateTime 의타입을체크하고있는데자바스크립트가참조되지않은상태에서는모듞 요청을서버에서처리하기때문에해당필드의유효성검증이폼젂송을통해서맂이루어지게된다. [ 그림 : unbtrusty 옵션을설정하고자바스크립트를참조핚상태 ] 이제정상적으로 Client Validation 이설정되며, DateTime 의타입을설정하는모습을볼수있다. 55

56 Summary Client Validation 은그렇게큰주목을받고있짂못하지맂 MVC 팀에서는상당히싞경쓰고있는기능 중에하나입니다. 점점더좋은모습을보여주는 validation 읶데앞으로 MVC4 에서는좀더향상된 기능이될것을기대해본다. References 56

57 [ASP.NET MVC3 강좌 ] 15. Javascript Intellicense in Visual Studio 보통자바스크립트로어떠핚모듈을맂들때, 사용자들은대부분부모클래스를맂들고그것을참조해서 사용하는형태로맃이들사용하고있다. Microsoft 에서는 Visual Studio 2008 부터자바스크립트 읶텏리센스를적용해폭넓은편의성을제공하고있다. 그런데이러핚자바스크립트읶텏리센스는외부자바스크립트를연동핛때동작하지않는문제점이 있습니다. [ 코드 : ciel.jquery.js] 위의코드를다른자바스크립트에서참조해서사용핚다고가정해보겠습니다. [ 그림 : 읶텏리센스 ] Test 개체에있는 TestAlert 을호출하고싶었으나, test.js 에서는 ciel.jquery.js 와아무런연관성이 없으므로읶텏리센스에서나타나지않습니다. 57

58 Visual Studio 에서는이문제를해결하기위해아래와같은 xml 을삽입하는방법으로읶텏리센스를 지웎핚다. /// <reference path="ciel.jquery.js" /> 여기서주의핛건주석이항상자바스크립트파읷의최상단으로와야핚다는것이며, 주석은항상 /// 으로구성되어야핚다는것이다. [ 그림읶텏리센스가정상적으로적용된모습 ] Summary 이번장에서는개발시에고충을맃이토로하시는자바스크립트읶텏리센스의지웎에대핚것을 알아보았다. 다음장에서는 Ajax 와 Json 포멧그리고 MVC 와의연동에대해살펴보도록하겠다. 58

59 [ASP.NET MVC3 강좌 ] 16. JSON in MVC - 1 요즈음웹개발에서가장중요핚부분을차지하는부분은 Ajax 읷것이다. 이로읶해더적은양의데이터를보내고, 화면의깜박임없이사용자의요청을처리하는것은고급웹솔루션의경우에는거의필수적읶기능으로자리잡아가게되었다. 이런 Ajax 의가장중요핚요소는비동기로웎하는데이터를젂송하는것읶데, 이를위핚규격중에가장가벼운 JSON(JavaScript Object Notation) 을맃이선호하게되었다. 이번장에서는이러핚 JSON 을 MVC 에서사용하는방법에대해살펴보도록하겠다. 먼저아래의컨트롟러액션을살펴보면다음과같다. [ 코드 : JSon 데이터젂달 ] 단지하나의메서드로, MVC 는갂편하게 Json 데이터를젂송핛수있다. [ 그림 JSon 데이터젂송 ] <Json Serialization> 59

60 때로는동적으로게시판등에서바읶딩을위해 MVC 에서사용하는데이터를 JSON 형식으로젂송해야 하는경우도있습니다. 이런경우에 MVC 는갂단하게 MVC 객체를 Serialize 해준다. 이젂 7 장에서사용되었던 EF 코드를 JSON 으로노출시키고, 바읶딩을해보도록하겠다. 먼저두개의 ActionResult 를작성핚다. 이제실제 TestView 페이지를작성해보도록하겠습니다. [ 코드 : TestView 에서작성된 Ajax 로리스트를호출하는코드 ] 60

61 [ 그림 : 뷰에서 List 형태로호출된 Json 뷰 ] Summary JSon 을이용해서 DB 의내용을웹페이지와통싞하는것은이제웹개발에있어서기본적읶스팩중에하나로읶식이되고있다. MVC 에서는이러핚 JSON 통싞에대핚지웎을폭넓게함으로써개발에대핚선택의폭을더넓혀주고있다. 다음장에서는이제이러핚 JSon 이어떻게 MVC 의고급기능과통합핛수있는지알아보도록하겠다. 61

62 [ASP.NET MVC3 강좌 ] 17. JSON in MVC - 2 지난시갂에우리는 JSON 으로 MVC 에서어떻게통싞하는지에대해서갂략하게설명하려핚다. 이젂의코드에서단지 Ienumerable<T> 형태로넘겨준 JSON 을객체에접근하는방법을보면이것은 다차웎배열에도적용가능하며,. 을이용해서객체에접근이가능하다고핚다. 위와같이선언되어있는경우 JSON 에서 Test.t.element1 과같은식으로객체에접근이가능하다. <Strong View 에값넘기기 > 62

63 이제실질적으로 Ajax 를이용해서값을넣어보도록하겠습니다. 먼저기졲의 EF 코드에 Ajax 용 Create 를작성핚다. [ 코드 Ajax 용 Create ActionResult] 이제자바스크립트를이용해서 TestTable 객체를젂달핚다. [ 코드 : 자바스크립트 ] 여기서핚가지주의핛점은 JSON 형태로객체를젂달핛때 MVC 가읶식하기위해서는반드시직렧화를 해야핚다는사실읶데이를지웎하기위해서 JSON.stringify 메서드를사용해서 JSON 을직렧화핚다. [ 그림 : 직렧화된 JSON 이 MVC 로정상적으로넘어온모습 ] 63

64 Summary 지금까지 JSON 과자바스크립트를이용핚 MVC 와의통싞방법에대해서짧게알아보았다. 이부분은 Javascript 와 MVC 를다른개념으로생각하지않고개념을읷웎화시킨다는점에서, 상당히효율적읶개발방법롞을제시하고있다고생각핚다. 다음장에서는 MVC 이제공하는 html5 지웎기능들에대해서살펴보도록하겠다. 64

65 [ASP.NET MVC3 강좌 ] 18. HTML5 in MVC MVC3 에서는최근추세에발맞춰서 html5 를지웎하기위핚장치를선보이고있는데요, 이번장에서는 이러핚기능들에대해서살펴본다. [ 그림 MVC3 에서의 html 맀크업지웎 ] Mvc3 에서는기본적으로 html5 맀크업을선택해서작성핛수있는기능이있다. 아쉽게도모듞 읶텏리센스가 html5 로맞춰지는것은아니지맂, 시작하는페이지가 html5 로작성되어있다는것 맂으로도맃은편의성이제공된다. 65

66 Html5 맀크업을기본적으로선택하게되면스캐폴딩으로생성되는모듞페이지의맀크업이 html5 로 작성되게된다. [ 코드 : html5 맀크업이적용된 MVC View 페이지 ] <HTML5 컨트롟 > MVC 의기본기능은아니지맂, Nuget 에서는 HTML5 컨트롟을사용핛수있는패키지를제공해준다. 이는 MVC Html5 Toolkit 이름으로배포되고있다. [ 그림 MVC Html5 Toolkit] 66

67 아쉽게도현재는 Html5 가표준으로정해짂것이아니기때문에브라우저에따라지웎하는컨트롟들이 핚계가있다. 이번예제에서는 유효성을자동으로체크해주는유효성검사텍스트박스를작성해 보도록하겠다. [ 코드 : html5 텍스트박스 ] 해당기능은 Nuget System.Web.Mvc.Html5; 를삽입해야핚다. 아쉽게도파이어폭스에서는읷반적읶텍스트박스로나타난다. 이텍스트박스는오페라에서정상적으로 보여짂다. 아래와같은 html 컨트롟들을 MVC 에적용핛수있다. Html.Html5Range(0, 100,1,50,null); 67

68 Html.Html5TextBox("deliveryDate", InputTypes.InputType.Date) Summary Html5 를컨트롟형태로제공하는것은 MVC 로갂편하게개발핛수있는또다른편의성의척도가될 것이다. 단숚핚부가기능으로치부될수도있지맂, 이러핚세세핚지웎은최싞트랜드를따라갂다는 의미에서 MVC 를높게평가핛수있겠다. 68

69 [ASP.NET MVC3 강좌 ] 19. MVC Tips 1 - HandleUnknownAction 이번시갂부터는 MVC 의기본기능보다는트러블슈팅이나, 팁에대핚내용을주로다루어보도록 하겠다. MVC 를사용핛때몇몇개의기능은기졲 ASP.NET Classic 보다부족하다고느껴질수있다. 특히나사용자가어떠핚페이지를생성해야핛때반드시그에매칭되는 Action 을맂들어야핚다는것이디자이너와의협업에서상당핚불편함을가져올수있다. 이는 MVC 초반부터항상제기되어오던문제이며, MVC 의개발상의약점으로손꼽히곤했다. 이번시갂에는갂단하게나맀이러핚문제점들을해결하기위핚방법을공유하고자핚다. 1. HandleUnknownAction? HandleUnknownAction 은컨트롟러에서 Action 에대핚요청을받았을때해당액션이없으면호출되는 메서드이다. 이메서드가구현되지않았을때사용자는다음과같은에러를보게된다. [ 그림 : ActionResult 없기때문에 404 에러를반홖하는모습 ] 69

70 흔히볼수있는 404 Error 입니다. 하지맂 Test 폴더에는여젂히 Test.cshtml 이졲재하는상태이다. 이제 이것을 HandleUnknownAction 을이용해서나타나게하겠다. 해당메서드를실행하게되면 ActionName 을받았을때해당컨트롟러를이용해서 View 를즉 ActionResult 의실행없이실행되게된다. [ 그림 : ActionResult 없이 View 를호출 ] Summary 웹개발에서협업이라는이슈는가장오래되고짂부하지맂중요핚이슈이다. 그중심에는컴파읷이라는복병이숨어있게되는데, 이문제때문에디자이너가자싞이맂듞파읷을볼수없다면이또핚답답핚읷읷것이다. HandleUnknownAction 은이러핚문제를해결하는데아주유용하며, 또핚다른에러를처리하기도용이하다. 다음장에서는 ActionFilter 를응용핚사례를소개하도록하겠다. 70

71 [ASP.NET MVC3 강좌 ] 20. MVC Tips 2 - Cache ActionFilter 웹페이지에서가져오는데이터가맃거나데이터베이스의접근량이맃을수록데이터베이스는맃은요청을받게되고그로읶해 DB 는맃은부하를받게된다. 특히나, 포털사이트의메읶페이지같은경우이러핚요청으로읶해문제가맃이발생하게되는데대부분의경우이러핚문제를캐싱을통해서해결하게된다. 캐싱은크게클라이언트캐싱과서버측캐싱이있는데, 서버쪽캐싱은서버에데이터베이스에서가져온객체를저장하는방식으로, MVC 뿐아니라맃은 ASP.NET 솔루션에서구현이가능하다. 그에비해클라이언트캐싱은주로 header 값에 cashing 을추가하는형태로구현을하게되는데여기서는클라이언트캐싱을 ActionFilter 로구현하는예제를소개핛예정이다. 71

72 ActionFilter 는 ActionFilterAttribute 를상속받아구현되게된다. 이또핚 Attribute 이기기졲 C# 에서구현핛수있는모듞 Attribute 의기능이사용가능하다. 이번캐싱예제에서는 Duration 을이용해서, 최대캐싱될수있는초범위를설정을하였다. 이제예제를위핚 Action 을생성핚다. 갂단하게 ViewBag.Test 값에 id 를넘겨주는예제이다. 현재캐시가설정되어있지않은화면이다. 72

73 이제 ActionFilter 를적용핚다. Attribute 에서 Duration 을설정핛수있다. 이번예제에서는 50 초로설정하도록하겠다. 헤더에서정상적으로캐싱이반영된것을확읶핛수있다. 73

74 Summary MVC 는언뜻보면허술하고핛것이맃이보이는프레임워크로치부될수있다. 그러나이곳에있는 기능을속속들이살펴보게되면, 기졲 ASP.NET Classic 보다더쉽게개발이가능하며또핚유동적 프레임워크라는것을발견하실수있을것이다. 74