VS 2008을 이용한 블로그 프로그래밍 - Part6

 

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

관리자 페이지(Admin.aspx)의 구성

포스트 및 공지사항의 작성과 수정, 그리고 삭제의 기능과 작성된 포스트의 목록 및 공지사항의 목록을 볼 수 있는 화면은 모두 지난 호에서 만든 "Admin.aspx" 페이지를 이용할 것이다. 우선 완성된 "Admin.aspx"의 페이지 디자인을 보면 <화면 9>와 같다.

<화면 9> "Admin.aspx" 페이지의 화면
<화면 9>에서 보는 것과 같이 "Admin.aspx" 페이지는 총 4개의 탭으로 구성되어 있으며, 화면에 표시되는 3개의 탭(포스트 쓰기, 포스트 목록, 공지사항 목록)과, 화면에 표시되지 않는 1개의 숨겨진 탭(포스트 수정)이 있다. 각각의 탭에서 사용하게 되는 기능은 다음과 같다.

● 포스트 쓰기 탭 : 블로그에 등록하는 포스트를 작성할 수 있는 기능을 제공하는 탭으로, 공지사항이라는 체크박스에 체크를 하게 되면 공지사항으로 등록이 되며, 체크박스에 체크를 하지 않게 되면 포스트로써 등록이 된다.
● 포스트 목록 탭 : 작성된 포스트에 대한 목록이 보여지는 탭으로, 작성된 포스트의 제목을 클릭하게 되면, 클릭한 포스트를 수정 및 삭제할 수 있는 포스트 수정 탭 화면으로 이동하게 된다.
● 공지사항 목록 탭 : 작성된 공지사항에 대한 목록이 보여지는 탭으로, 작성된 공지사항의 제목을 클릭하게 되면, 클릭한 공지사항을 수정 및 삭제할 수 있는 포스트 수정 탭 화면으로 이동하게 된다.
● 포스트 수정 탭 : 포스트 목록 탭 또는 공지사항 목록 탭에 있는 목록에서 제목을 클릭하게 되면 활성화되는 탭으로, 클릭한 포스트 또는 공지사항의 정보를 수정할 수 있는 기능과 삭제를 할 수 있는 기능을 제공한다.

"Admin.aspx" 페이지에서 사용되는 탭 컨트롤은 AJAX Control ToolKit에서 제공하는 TabContainer 컨트롤을 사용하고 있다. TabContainer 컨트롤의 스타일은 기본적으로 AJAX Control Toolkit에서 제공되는 스타일이 아닌 사용자 정의 스타일로 정의했으며 TabContainer 컨트롤의 스타일에 관련된 내용은 참고 자료에 나오는 URL을 참고하기 바란다. TabContainer 컨트롤은 4개의 TabPanel 컨트롤을 포함하고 있으며, 이들 TabPanel 컨트롤들은 각기 UpdatePanel 컨트롤을 포함하고 있다. 물론, AJAX 기능을 사용하기 위해서 "Admin.aspx" 페이지의 상단에는 ScriptManager 컨트롤을 추가하였다. 또한, 포스트 또는 공지사항의 수정에 관련된 내용을 가져오기 위해서 페이지 메소드(Page Method)를 사용하였고, "Admin.aspx" 페이지에서 페이지 메소드를 사용가능하게 하기 위해서 ScriptManager 컨트롤의 EnablePageMethods 속성을 true로 설정하였다. "Admin.aspx" 페이지의 소스 코드는 이달의 디스켓을 참고하기 바란다.

블로그의 포스트 작성 기능 구현

이제 블로그 프로그래밍에 있어 핵심적인 기능이라 할 수 있는 포스트를 작성하는 기능에 대해서 설명하도록 하겠다. <화면 9>에서 보는 것처럼, 포스트 쓰기 탭에서는 작성할 포스트의 제목과 본문, 그리고 태그(공지사항을 작성할 경우에는 입력을 하지 않아도 된다.)를 입력하는 TextBox 컨트롤과 공지사항으로 등록할 것인지 일반 포스트로 등록할 것인지를 결정하게 되는 CheckBox 컨트롤, 그리고 포스트로 등록할 경우에 어떤 카테고리로 등록할 것인지를 선택할 수 있는 DropDownList 컨트롤로 구성되어 있다. 카테고리 정보를 가져와서 카테고리 정보를 보여주는 DropDownList 컨트롤로 바인딩하는 코드는 <리스트 4>와 같다.

    // Category 정보를 가져온다.

    private void GetCategoryInfo()

    {

        var categoryInfo = from c in blogDataContext.BLOG_CATEGORIES select c;

        foreach (BLOG_CATEGORIES blogCategory in categoryInfo)

        {

            // 포스트 작성 탭의 카테고리 정보에 바인딩

            ddlCategory.Items.Add(new ListItem(

                blogCategory.categoryname.ToString(), blogCategory.categoryid.ToString()));

            // 포스트 수정 탭의 카테고리 정보에 바인딩

            ddlModifyCategory.Items.Add(new ListItem(

                blogCategory.categoryname.ToString(), blogCategory.categoryid.ToString()));

        }

    }

<리스트 4> 카테고리 정보를 가져오는 메소드

제목과 본문 그리고 태그 정보를 입력한 후, 화면 하단에 있는 미리보기 버튼을 클릭하면 작성한 포스트가 화면에 어떻게 보여질 것인가를 확인할 수 있는 미리보기 창이 <화면 10>과 같이 뜨게 된다.

<화면 10> 작성한 포스트에 대한 미리보기 창

화면 하단에 있는 등록 버튼을 클릭하면, <리스트 5>에 보여지는 것과 같이 등록 버튼 클릭에 관련된 코드가 실행되며 정상적으로 등록이 되면 공지사항 체크박스의 체크 유무에 따라 포스트 목록 탭 또는 공지사항 목록 탭에 <화면 11>과 같이 작성한 포스트 또는 공지사항의 정보가 목록으로 보여지게 된다.

// 포스트 쓰기 탭에서 작성 버튼 클릭 시

    protected void btnPostWrite_Click(object sender, EventArgs e)

    {

        try

        {

            // 공지사항 CheckBox가 체크되어 있으면 공지사항으로 저장

            if (chkNotice.Checked)

            {

                BLOG_NOTICES blogNotice = new BLOG_NOTICES();

                blogNotice.noticename = txtPostSubject.Text;

                blogNotice.noticecontent = Server.HtmlEncode(txtPostContent.Text);

                blogNotice.createdate = DateTime.Now;

                blogDataContext.BLOG_NOTICES.InsertOnSubmit(blogNotice);

                blogDataContext.SubmitChanges();

                SetNoticeListDataBound();

                ScriptManager.RegisterClientScriptBlock(

                    this, this.GetType(), "setindex", "fnSetTablIndex('3')", true);

            }

            else

            {

                BLOG_POSTS blogPost = new BLOG_POSTS();

                blogPost.postid = Guid.NewGuid().ToString().ToUpper();

                blogPost.postname = txtPostSubject.Text;

                blogPost.postcontent = Server.HtmlEncode(txtPostContent.Text);

                blogPost.categoryid = int.Parse(ddlCategory.SelectedItem.Value.ToString());

                blogPost.tag = txtPostTag.Text;

                blogPost.createdate = DateTime.Now;

                blogPost.viewcount = 0;

                blogPost.commentcount = 0;

                blogDataContext.BLOG_POSTS.InsertOnSubmit(blogPost);

                blogDataContext.SubmitChanges();

                SetPostListDataBound();

                ScriptManager.RegisterClientScriptBlock(

                    this, this.GetType(), "setindex", "fnSetTablIndex('2')", true);

            }

            SetInitForm();

        }

        catch (Exception ee)

        {

            ScriptManager.RegisterClientScriptBlock(this, this.GetType(), "error"

                , "alert('" + ee.Message + "::" +  ee.Source + "::" + ee.InnerException + "')", true);

        }

    }

<리스트 5> 등록 버튼 클릭 시의 코드

<화면 11> 작성한 포스트의 목록 정보

---

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