ASP.NET AJAX / AJAX Control Toolkit 응용 2008 컴퓨터공학실험( I ) 7주 실습강의 ASP.NET AJAX / AJAX Control Toolkit 응용 2008 컴퓨터공학실험( I )
AJAX Asynchronous Javascript And Xml 정의: 웹 기반의 비동기 통신 기법 동기 통신: 새로운 정보를 서버로부터 받아오기 위해 페이지 전체를 서버로부터 새로 읽어와야 한다. 예) naver 검색 버튼을 누르면 페이지 전체가 변경 비동기 통신: 새로운 정보를 서버로부터 받아오기 위해 전체 페이지를 새로 고침 하지 않는다. 예) 구글 맵스(http://maps.google.com): 맵을 이동하여 새로운 정보를 서버로부터 읽어 오지만 페이지 새로 고침을 하지는 않는다. 구현 방법: 여러 가지 기술을 사용 통신: SOAP, HTTP 표현: Javascript, DOM, HTML, CSS
ASP.NET AJAX ASP.NET 2.0을 기반으로 하여 AJAX을 구현하기 위한 프레임워크 주소: http://ajax.asp.net
ASP.NET AJAX 설정 개발환경 : Visual Studio 2005 / 2005 Express : ASP.NET AJAX Extensions 1.0 개발환경에 ASP.NET AJAX extension 설치: http://asp.net/ajax/downloads/ 에서 ASP.NET AJAX 설치 파일 다운로드 하여 실행
ASP.NET AJAX Control Toolkit AJAX Extension 기반에서, 웹 클라이언트를 위한 컴포넌트 모음 http://www.codeplex.com/AtlasControlToolkit 에서 Releases 페이지를 클릭해서 다운로드 적절한 위치에 압축을 해제하도록 한다.
ASP.NET AJAX Control Toolkit 개발 환경의 도구상자에서 오른쪽 버튼 클릭 → 탭 추가 클릭 새로운 탭의 이름을 AJAX Control Toolkit으로 한다. 압축을 해제한 폴더에서 SampleWebSite/Bin 폴더의 AjaxControlTookit.dll 파일을 새로 만든 탭으로 끌어 놓는다. 오른쪽과 같이 ASP.NET AJAX용 컴포넌트가 추가된 것을 확인할 수 있다.
주요 AJAX 컴포넌트 Script Manager: AJAX와 관련한 내부적인 처리를 담당하는 컴포넌트, AJAX를 사용하는 페이지에 반드시 1개가 존재하여야 한다. UpdatePanel: 기본적으로 ASP.NET의 Panel과 동일하나 내부에 있는 모든 컴포넌트는 비동기적으로 작동하게 된다.
참고 자료 ASP.NET AJAX 공식 홈페이지: http://ajax.asp.net 메인 페이지에 tutorial video 참조 ASP.NET AJAX Control Toolkit 샘플 및 안내서 http://www.asp.net/AJAX/AjaxControlToolkit/Samples/Default.aspx
7주차 실습 과제 - 목표 AJAX 기반의 비동기 Micro-blogging 페이지 작성 이번 실습에서는, 예전과 동일하게 MS Access 파일 DB를 사용하여 간단하게 페이지를 작성하도록 합니다. AJAX 컴포넌트를 사용하는데 실험의 중점을 둡니다.
비동기 페이지 작성 페이지에 ScriptManager와 UpdatePanel 추가 그 밖에도, AJAX Control Toolkit에 포함된 각종 컴포넌트를, 샘플을 보면서 적용해 나가 보도록 합니다.