ABOUT ME

-

Today
-
Yesterday
-
Total
-

  • ASP.NET 2.0을 이용한 웹페이지 구현
    프로그래밍 2009.07.15 12:48

    사용자 삽입 이미지
    간단한 웹사이트 생성하는 방법을 알아본다.

    Visual Studio 2005를 실행한다.

    [파일]-[새로만들기]-[웹사이트]를 클릭한다. [새 웹 사이트] 창에서

    • 템플릿 : ASP.NET
    • 위치 : 파일시스템, 드라이브 지정
    • 언어 : Visual C#

    를 선택한뒤 확인버튼을 클릭한다.

     

    newWebSite.jpg

     

    생성된 웹페이지를 작성한다. 솔루션 탐색기 살펴본다. 나머지 내용은 C#, Advanced C#에서 다루웠던 내용들과 동일하다. Default.aspx 페이지 생성해서 Page_Load이벤트에 아래와 같이 작성한다.

     

     

    using System;
    using System.Data;
    using System.Configuration;
    using System.Web;
    using System.Web.Security;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using System.Web.UI.WebControls.WebParts;
    using System.Web.UI.HtmlControls;

    public partial class _Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            Response.Write("ASP.NET 2.0 으로 구현한 첫번째 웹페이지");
        }
    }


    실행은 [디버그]-[디버깅하지 않고 시작]  또는 Ctrl+F5이다. 실행화면은 아래와 같다.

     

    K-1.png .

     

     

    ASP.NET  2.0 페이지 및 응용 프로그램 구조

    웹폼은 웹 응용프로그램에서 동작되는 Form으로 ASP.NET 페이지와 같은 개념이다.개발자는 폼위에서 디자인과 소스를 개발한다.

    웹폼의 구조는 표현부분과 코드부분으로 나뉘어진다.

    K-2.png

     

    표현부분은 일반적인 HTML 부분이고 코드부분은 서버에서 실행되는 로직들이 적히는 부분이다.

    위의 예는 단일 모델일 때의 경우이고, ASP.NET 2.0에서는 두가지 코드 모델이 존재한다.

    • 단일 파일 페이지 모델(Single File Page Model) 코드부분과 표현부분을 한 페이지에서 작성하는 것으로 간편하다.

    • 코드 숨김 페이지 모델(Code-Behind page Mdoel) 디자이너와 개발자의 분업이 편리코드의 재상용이 용이하다.

    둘 사이에는 장단점이 존재하나, 현재의 프로젝트 진행방식에서는 코드 숨김 페이지 모델이 가장 적절하다고 할 수 있겠다. 앞으로도 모든 예제는 코드 숨김 페이지 모델로 한다.

    K-3.png

    우선 예는 보기로 하자.

    단일 파일 페이지 모델 예제, 프로젝트에서 새 항목추가

    • 템플릿  : Web Form

    • 이름 : EX01.aspx

    • 다른페이지 코드입력 : 해제

     

    이렇게해서 웹페이지를 추가하면 솔루션 탐색기에서 추가한 웹페이지를 확인할 수 있다.

    이때 코드 숨김 페이지 모델과의 차이를 확인해보면 EX01.aspx는 하위에 아무것도 없기 때문에 탐색기에서 아이콘하위 목록을 볼 수 있는 + 버튼이 없다.

     

     

     K-5.png

     

    EX02.aspx는 코드 숨김 페이지 모델로 하위에 EX02.aspx.cs로 되어 있는 C# 파일이 같이 존재하고 있다. 이를 확인해보면서 단일 파일 페이지 모델과 코드 숨김 페이지 모델의 차이를 볼 수 있다.

    단일 페이지 모델의 경우 장점은 aspx 파일에서 상단의 드롭다운리스트를 눌러서 각 객체를 찾아서 선택한 뒤 이벤트를 선택해서 바로 만들어 넣을 수 있다.

     

    K-6.png

     

    Page개체를 선택하고 오른쪽의 이벤트에서 Load를 클릭하면 코드 부분에 Page_Load 메서드가 생성된다.

     

     

     <%@ Page Language="C#" %>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <script runat="server">

        protected void Page_Load(object sender, EventArgs e)
        {
            Response.Write("Load 이벤트가 발생하였습니다.");
        }
    </script>

    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
        <title>제목 없음</title>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
       
        </div>
        </form>
    </body>
    </html>

     

    실행결과는 앞서와 같다.

     

    K-7.png

     

    표현부분(EX02.aspx)은 다음과 같다.

     

     

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="EX02.aspx.cs" Inherits="EX02" %>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
        <title>제목 없음</title>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
       
        </div>
        </form>
    </body>
    </html>

     

    코드부분(EX02.aspx.cs)는 아래와 같다.

     

    using System;
    using System.Data;
    using System.Configuration;
    using System.Collections;
    using System.Web;
    using System.Web.Security;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using System.Web.UI.WebControls.WebParts;
    using System.Web.UI.HtmlControls;

    public partial class EX02 : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            Response.Write("Load 이벤트가 발생하였습니다.");
        }
    }

     

    ASP.NET 2.0의 이전보다 향상된 코드 숨김 페이지 모델이 가능한 것은 코드부분의 12줄의 partial 때문이다.

     

    웹 폼 이벤트에 대하여 알아봐야 하는데 이벤트라는 것은 마우스 버튼의 클릭과 같이 사건, 일 등을 의미하며, 쉬운 예가 동네에 새로운 가게가 오픈(발생)할 때나, 개업 5주년(발생) 기념으로 이때 이벤트 행사를 한다고 할 때의 이벤트도 같은 의미이다.

     

    출처 >> http://personar95.springnote.com

    댓글 0

Designed by Tistory.