최고보다,최선을...

AJAX 방명록 만들기[2]

이제 Ajax 방명록이 어떻게 만들어 졌는지 하나하나 보도록 하겠습니다!! 항상 말하지만 저또한 .NET 초보자니깐요!! 잘못된 부분이나 부족한부분 알려 주세요~! 근데 사람들이 보기는 할까 의문입니다ㅋ 제일 먼저 Visual Studio를 실행해야 겠죠!^^ 아~! 그리고 AJAX 방명록을 만드시려면 몇가지 갖추어야 할 사항이 있습니다.

 ㅁ ASP.NET Extensions 를 설치를 해야 합니다.

 ㅁ ASP.NET Ajax controlToolkit 참조해야 합니다.

(다운로드 받을수 있는 곳입니다. http://www.asp.net/ajax/downloads/ 가시면 ControlToolkit과 ASP.NET Extensions v1.0버전을 다운로드 할수 있습니다! 설치 방법도 간단 합니다.실행후 다음다음...아시죠!^^)
ASP.NET Extensions는 .NET Framework 2.0 이상에서 지원이 된다고 합니다. 고로 Visual Studio2005로 AJAX방명록을 만들어야 겠죠!^^
VS2005를 실행하시면 상단 메뉴에 파일  >> 새로만들기 >> 웹사이트 클릭하시면 아래와 같은 그림이 나타 납니다.

그리고 ASP.NET Extensions 설치했다면 AJAXEnabledWebSite 템플릿이 보일 것입니다. 그걸 선택을 하고 프로잭트 이름을 주면 되는 거죠! 저는 "guest_board"라고 해봤습니다! 자 이제 프로젝트가 실행이 되었겠죠!! 그럼 이제 Ajax controlToolkit dll를 참조해야합니다.

프로제트에서 오른쪽 마우스를 클릭하면 위 그림과 같이 메뉴가 나타나는데요!! 참조추가는 클릭하면 아래와 같은화면이 나타나는데요!!거기서 찾아보기 텝을 선택하신다음에 다운로드 하신 Ajax controlToolkit dll 파일을 찾아서참조해주세요!!

자 참조 추가도 했습니다!!  이제 저와 같이 파일을 추가해볼까요!!

아마 기본적으로 Default.aspx 페이지가 있을 텐데요!! 저는 그냥 MasterPage를 만들어 보았습니다. 혹시 나중을 위해서요!!저 같이 마스터페이지를 만드실거면 처음에 생성된 Default페이지는 그냥 지워 버리세요!! 지우지 않으셔도 되긴 하지만...안에 코드를 조금 바꿔야 하거든요! 그냥 지우고 만드는 좋을것 같아서요!! 그럼 아까 처럼 프로젝트에 마우스 오른쪽클릭하면 "새 항목 추가"가 있습니다. 그걸 클릭하면 여러가지 템플릿들이 나오는데요!! 거기서 마스터 페이지를 선택하세요!! 그럼 마스터 페이지만 생길거예요!! 그 다음에 MasterPage.master 파일이 생기죠 거기에서 다시 마우스 오른쪽 클릭하면 또 여러가지 메뉴가 나타나는데요!! 거기서 콘텐트 페이지 추가를 선택하세요. 그럼 .aspx페이지가 생성됩니다. 그럼 이름을 바꾸시면 됩니다. 저는 "Guest_Board.aspx" 라고 했습니다. 지금까지 이해 안되시는 부분 없으셨죠~^^ 그 다음에 위 그림과 같이 .js파일, .css파일, images폴더, boardClass.cs, dbClass.cs 를 생성합니다. 이 파일역활을 갈약하게 설명하자면 아래 같습니다.

   - boardClass.cs : 글쓴 내용을 받아서 프로시져의 Parameter를 생성하는 역활을 합니다.

      (왜 이렇게 코드를 짯을까...그냥 이렇게 해보고 싶었어요!!)

   - dbClass.cs : 데이터 베이스에 연결하고 쿼리를 실행하는 역활을 합니다.

   - js파일 : 유효성 체크하기 위함

   - css파일 : style를 적용하려고요!!(근데...짜다보니깐 별로 안쓰더라고요!제가 아직 미흡해서 그런 것 같아요!!)

아무튼 저는 이렇게 파일을 생성했습니다~^^ 이제 여기끼지 준비가 되었다면 이제 다음 강좌에서 글쓰는 부분을 만들어 보도록 하겠습니다!! 빨리빨리 만들어야하는데...짜꾸 이렇게 말만 많았네요!! 저같은 초보자들을 위해서 하나하나 차근차근 집고 넘어가기 위해서 입니다. 그러니 양해해주세요!^^

AJAX 방명록 만들기[1]

저는 닷넷을 시작한지 얼마되지 않은 초보자 입니다. 제가 알고 있는 내용을 바탕으로 Ajax 방명록을 만들어 보았습니다!! 혹시 이글을 읽는 분이 있다면 혹시 잘못된 부분이나 부족한 부분들 딱끔하게 지적해주세요!! 그리고 저같은 초보자들에게 조금이나마 공부하는데 도움이 되었으면 좋겠습니다^^

자~ 그럼 한번 제가 만든 Ajax방명록을 소개 하도록 하겠습니다.  소개후 차근차근 하나하나 어떻게 만들었는지알려 드리도록 하겠습니다~^^자 그럼 시작해 볼까요!^^
방명록이라고 하면 우리가 예상할 수 있듯이 글쓰는 곳과 리스트부분이 같은 페이지에 있는 것을 예상할수 있을것입니다!!맞습니다. 제가 만들 방명록도 그러한 페이지 입니다. 하지만 조금 다른 점이있다면 ASP.NET AJAX를이용해서 페이지 깜빡이지 않고 데이터를 처리한다는 것이 조금 다르다고 할 수있겠네요!!^^

그럼 제가 만든 AJAX 방명록 스토리 보드를 보시겠습니다~^^

1. 방명록 전체 페이지 입니다!!

별거 없죠!^^ 제가 나름데로 디자인도 해보았는데...쉽지 않더라고요!! 아직 DB에 글이 없기 때문에 List에 나타나지 않았습니다.여기서 사용자가 글쓰는 부분을 닫고 싶다고 하면..."Dong wook 방명록 남겨주세요~^^" 옆에 화살표 를 클릭하면 글쓰는 부분이 닫히게 됩니다.

2. 글쓰는 부분 닫힌 모습.

말로 설명하는 것 보다 눈으로 보는게 더 좋겠죠!!^^

3.이미지 삽입

저는 방명록에 사용자가 이미지를 선택해서 입력할수 있도록 했습니다!!위 그림과 같이 글 쓰는 부분왼쪽에 보시면 "이미지 삽입 클릭!^^"이라는 내용이 있습니다! 그 부분을 클릭하면 위 그림과 같이 이미지를 선택할 수 있도록메뉴가 나타나게 됩니다!

4.글쓰기

위 그림은 첫번째 글쓰고 리스트에 보여지게 하고 두번째 글을 쓰고 있는 그림입니다!!당연히 글을 쓰면 DB에 들어가고 리스트에 보여줘야 하겠죠!!하지만 페이지는 저녀 깜빡이지 안고 리스트에 보여진다는거....나중에 코드부분에서 설명하겠습니다~!!

5. 글 삭제하기

리스트 부분에 휴지통 이미지를 클릭하면 비밀번호를 입력 할수 있는 부분이 나타납니다. TextBox에 비밀번호를입력하면 글이 삭제가 됩니다. 정상적인 비밀번호를 입력하시면 삭제가 이루어지고 "정상적으로 삭제 했습니다!"라는 메세지가 나오겠고...잘못 입력하셨다면...메세지는 "비밀번호가 잘못되었습니다"이런 식으로 메세지가 나오겠죠!^^ 자 지금까지 제가 만든 Ajax 방명록 스토리 보드는 간단하게 보았습니다!!
그럼 다음 강좌부터는 어떻게 만들어 졌는지 하나하나 보도록 하겠습니다.
제가 쓰는 글은 거의 초보자 수준이니 많이 이해해 주세요~