반응형

 
이 포스트는 월간 마이크로소프트웨어에 기고한 원고를 재편집한 포스트입니다. 그러므로, 본의 아니게 반말로 진행되고 있습니다. 원래 싸가지가 없어서 그런 것이 아니니 무한 용서를... ^^;;
또한, .NET Framework 3.5 SP1이 적용되기 이전의 소스이므로, 현재의 개발 환경과 다를 수 있습니다. 마소에 제출한 블로그 소스는 블로그 소스 다운로드에서 다운로드하실 수있습니다.

포스트 조회 페이지의 구성

이제, 포스트 조회 페이지를 구성하는 방법에 대해서 알아보도록 하자. 먼저 포스트를 조회하기 위한 “PostView.aspx" 파일을 만들기 위해, 웹 사이트 이름에서 우측 마우스를 클릭하여 “새 항목 추가(Add New Item...)" 메뉴를 선택하여, "PostView.aspx"라는 이름의 페이지를 추가한다.
먼저, 작성한 포스트에 대한 정보를 화면에 출력하기 위한 코드를 "PostView.aspx" 파일에 추가하도록 하며, 이 코드는 이달의 디스켓을 참조하도록 한다.

“PostView.aspx" 파일에 포스트의 정보를 출력하는 코드를 추가한 후, “PostView.aspx.cs"에서 포스트의 정보를 가져오는 코드를 작성한다. 우선, 전역변수로 _strPostID를 선언한 후에, 쿼리스트링으로 전달되는 PostID값을 할당한다. 그 후, Page_Load 이벤트에서 현재 포스트의 정보를 가져오는 GetPostData() 메소드를 호출한다. 현재 포스트의 정보를 가져오는 GetPostData() 메소드의 코드는 <리스트 3>과 같다.

    // 현재 조회하려는 블로그 데이터 가져오기
    private void GetPostData()
    {
        // 해당 블로그 데이터 조회
        BLOG_POSTS blogPost
            = blogDataContext.BLOG_POSTS.Single(q => q.postid == _strPostID);
 
        // 조회수를 1증가시킨다.
        blogPost.viewcount = blogPost.viewcount + 1;
        blogDataContext.SubmitChanges();
 
        // 조회된 데이터를 출력
        lblPostSubject.Text = blogPost.postname;
        lblCreateDate.Text = blogPost.createdate.ToString();
        lblViewCount.Text = blogPost.viewcount.ToString();
        lblCommentCount.Text = blogPost.commentcount.ToString();
        lblPostContent.Text
            = Server.HtmlDecode(blogPost.postcontent.ToString().Replace("\r\n", "<br />"));
        hlnkCategory.Text = blogPost.BLOG_CATEGORIES.categoryname;
        hlnkCategory.NavigateUrl = "/Category/" + blogPost.categoryid.ToString() + ".aspx";
        lblTrackBackUrl.Text
            = Request.ServerVariables["HTTP_HOST"].ToString() + "/TrackBack/" + _strPostID + ".aspx";
        lblTrackBackUrl.Attributes.Add("onclick", "fnCopyUrl('" + lblTrackBackUrl.Text + "')");
 
        _categoryID = blogPost.categoryid.ToString();
        this.Master.Page.Title = lblPostSubject.Text;
    }
<리스트 3> GetPostData() 메소드의 코드

GetPostData() 메소드는 쿼리스트링으로 전달받은 PostID값을 가지고 BLOG_POST 테이블에서 PostID값이 일치하는 “BLOG_POST" 엔티티를 찾은 후, 화면에 필요한 정보만을 표시하도록 코드가 구성되어 있다. 또한 <필자메모>에서 설명한 것과 같이, GetPostData() 메소드에서도, 카테고리를 클릭할 경우 카테고리 목록 화면으로 이동하기 위한 URL인 “/Category/카테고리ID.aspx"와 트랙백 정보를 받기위한 ”/TrackBack/포스트ID.aspx"를 정의하고 있다. GetPostData() 메소드를 통해 구성된 "PostView.aspx" 파일의 화면은 <화면 3>과 같다.


<화면 3> 기본 정보가 표시된 포스트 조회 화면

다음으로는, 현재 조회하고 있는 포스트의 이전/다음 포스트 정보를 구성하는 코드에 대해서 설명하도록 하겠다. 우선 현재 포스트의 이전/다음 포스트 정보를 가져오는 쿼리는 저장 프로시져를 사용하여 구성하며, 사용되는 저장 프로시져명은 “dbo.usp_GetPrevNextPost”이고, 이 저장 프로시져는 <리스트 4>와 같이 구성되어 있다.

CREATE PROCEDURE [dbo].[usp_GetPrevNextPost]
(
    @postid            NVARCHAR(50)
,    @categoryid        INT
,    @prevpostid        NVARCHAR(50)     OUTPUT
,    @nextpostid        NVARCHAR(50)    OUTPUT
,    @prevpostname    NVARCHAR(100)    OUTPUT
,    @nextpostname    NVARCHAR(100)    OUTPUT
)
AS
BEGIN
    DECLARE @nowpostdate        DATETIME
 
    SELECT @nowpostdate 
        = (SELECT CreateDate FROM BLOG_POSTS WHERE PostID = @postid)
    SELECT @prevpostid 
        = (SELECT TOP 1 ISNULL(PostID, '') AS PrevPostID 
            FROM BLOG_POSTS 
            WHERE CategoryID = @categoryid AND CreateDate < @nowpostdate 
            AND DeleteDate IS NULL 
            ORDER BY CreateDate DESC)
    SELECT @nextpostid 
        = (SELECT TOP 1 ISNULL(PostID, '') AS NextPostID 
            FROM BLOG_POSTS 
            WHERE CategoryID = @categoryid AND CreateDate > @nowpostdate 
            AND DeleteDate IS NULL 
            ORDER BY CreateDate ASC)
    SELECT @prevpostname 
        = (SELECT PostName FROM BLOG_POSTS WHERE PostID = @prevpostid)
    SELECT @nextpostname 
        = (SELECT PostName FROM BLOG_POSTS WHERE PostID = @nextpostid)
END
<리스트 4> usp_GetPrevNextPost 저장 프로시져의 코드

<리스트 4>과 같이 저장 프로시져를 생성한 후, “App_Code" 폴더 안에 이미 생성되어 있는 ”BlogDataClasses.dbml“ 파일의 디자이너 화면의 우측 영역에 이 저장 프로시져를 추가하기 위해, 기존에 연결시켜 놓은 "서버 탐색기(Server Explorer)"의 연결 정보를 새로고침하여, 추가된 ”dbo.usp_GetPrevNextPost“ 저장 프로시져를 검색한 후, ”BlogDataClasses.dbml“ 파일의 디자이너 화면의 우측 영역으로 저장 프로시져를 드래그 앤 드랍하여, 저장 프로시져를 추가한다.

그 후에, Page_Load 이벤트에서 이 저장 프로시져를 사용하기 위한 메소드인 GetPrevNextPostInfo() 메소드를 호출한다. GetPrevNextPostInfo() 메소드의 코드는 <리스트 5>와 같다.

    private void GetPrevNextPostInfo()
    {
        string strPrevPostID = string.Empty;
        string strNextPostID = string.Empty;
        string strPrevPostName = string.Empty;
        string strNextPostName = string.Empty;
 
        int iReturn 
            = blogDataContext.usp_GetPrevNextPost(_strPostID, int.Parse(_categoryID)
            , ref strPrevPostID, ref strNextPostID, ref strPrevPostName, ref strNextPostName);
 
        // 이전 포스트가 있을 경우
        if (! string.IsNullOrEmpty(strPrevPostID))
        {
            hlnkPrevPost.Text = strPrevPostName;
            hlnkPrevPost.NavigateUrl = "/Post/" + strPrevPostID + ".aspx";
        }
        else
        {
            hlnkPrevPost.Text = "이전 포스트가 없습니다.";
        }
 
        // 다음 포스트가 있을 경우
        if (!string.IsNullOrEmpty(strNextPostID))
        {
            hlnkNextPost.Text = strNextPostName;
            hlnkNextPost.NavigateUrl = "/Post/" + strNextPostID + ".aspx";
        }
        else
        {
            hlnkNextPost.Text = "다음 포스트가 없습니다.";
        }
    }
<리스트 5> GetPrevNextPostInfo() 메소드의 코드

<리스트 5>와 같이 현재 포스트의 이전/다음 포스트 정보를 가져오는 메소드를 호출하게 되면, <화면 4>와 같은 화면을 볼 수 있게 된다.


<화면 4> 포스트의 이전/다음 정보가 표시된 화면

다음으로는 포스트에 작성된 덧글 정보를 표시하는 코드에 대해서 설명하도록 하겠다. Page_Load 이벤트에, 덧글 정보를 가져오는 GetPostCommentInfo() 메소드를 추가한 후, 포스트에 관련된 덧글 정보를 가져오는 코드를 작성한다. GetPostCommentInfo() 메소드에 관련된 코드는 이달의 디스켓을 참고하도록 하며, 조회된 덧글 정보는 “PostView.aspx" 파일에 이미 정의되어 있는 ListView 컨트롤에 의해서 화면에 보여지게 된다. 등록되어 있는 덧글 정보가 있다면, <화면 5>와 같이 화면에 표시되게 된다.


<화면 5> 포스트 조회 화면에서 보이는 덧글 목록 화면

<화면 5>에서 보이는 것처럼, 포스트를 조회하는 방문자가 포스트에 대한 덧글 정보를 입력한 후, “덧글 입력” 버튼을 클릭하게 되면, 방문자가 입력한 덧글 정보가 "BLOG_COMMENTS" 테이블에 입력되게 된다. 이러한 로직은 “PostView.aspx.cs" 파일의 ”btnWriteComment_Click" 이벤트에 정의되어 있다. “덧글 입력” 버튼을 클릭하면, 방문자가 입력한 덧글 정보를 테이블에 저장한 후, “BLOG_POSTS" 테이블에서 현재 포스트의 Comment 개수를 1 증가시키게 되며, 다시 덧글 정보 목록을 조회하여 화면에 보여주게 된다. 덧글 정보를 입력하는 부분과 덧글 정보를 보여주는 부분은 ASP.NET AJAX를 이용하기 위해서 UpdatePanel 컨트롤의 ContentTemplate 템플릿 안에 구현되어 있으며, UpdatePanel 컨트롤을 사용하기 위해서, ScriptManager 컨트롤의 선언 구문에 페이지 상단에 추가되어 있다.


Creative Commons License
저작물크리에이티브 커먼즈 코리아 저작자표시-비영리-동일조건변경허락 2.0 대한민국 라이센스에 따라 이용하실 수 있습니다.
반응형

+ Recent posts