- 웹 어플리케이션 진화에 따른 Ajax 탄생 배경
- Ajax 개요
- Ajax 도구
- 참고 문헌
AJAX는 웹에서 비동기 방식의 대화형 프로그램을 가능하게 하는 강력한 도구로 Client에 적용되는 기술이다. AJAX는 새로운 기술이 아니라 XHR 객체 + DHTML 기술의 결합이다.
웹 어플리케이션 진화에 따른 Ajax 탄생 배경
월드와이드웹(WWW)이 탄생한 후 정적인 웹 페이지에 동적인 기능을 구현하기 위한 많은 시도가 있었습니다. Ajax는 그 정점에 서 있으며 Ajax를 통하여 웹 어플리케이션의 한계를 극복할 수 있게 되었습니다.
CGI (Common Gateway Interface)
사용자의 요청에 따라 서버 프로그램이 실행되어 동적인 페이지를 제공함
Applets (애플릿, 1995년) -> MS의 ActiveX
브라우져에서 실행되는 간단한 Java 기반의 프로그램으로 동적인 웹 페이지를 만드는 새로운 길을 창출
JavaScript -> ECMAScript 표준으로 발전 -> MS의 VBScript, MS의 JScript
Applets을 좀 더 쉽게 사용하도록 하기 위해 고안된 스크립트 언어로 웹 페이지 태그를 동적으로 수정할 수 있도록 기능이 발전하였다.
DOM (Document Object Model) -> DOM Level 3 표준화 진행 중, 웹 페이지를 하나의 객체로 처리하기 위해서 고안됨
DOM : HTML/XML 문서에 대해 구조적인 표현 방법을 제공하며 스크립트를 사용하여 이러한 구조에 접근할 수 있는 방법을 정의하는 API
DOM Level 1 : ~ 1998.10, HTML 4.01, XML 1.0 표준 포함
DOM Level 2 : ~ 2000.11, CSS2 표준 포함
DOM Level 3 : XML 1.1, XML 스키마 1.0, SOAP 1.2 표준 포함
JavaScirpt : DOM에 접근하여 이를 처리하는데 사용되는 스크립트 언어의 일종
Servlet 2.4 (1996년)
서버에서 실행되는 어플리케이션으로 동적인 웹 페이지를 손쉽게 구축할 수 있도록 도와 준다.
JSP 2.0 (Java Server Page) -> MS의 ASP, PHP, ColdFusion, …
웹 어플리케이션에서 웹 디자이너와 개발자가 역할을 분리하여 화면을 개발할 수 있도록 하였다.
Flash
웹 페이지에 동적인 기능을 제공하기 위해 고안된 웹에서 사용 가능한 애니메이션 플레이어
DHTML (Dynamic HTML)
HTML 4.01 + CSS2 + JavaScript + DOM3의 합성어
위 기술을 결합함으로서 실행중에 웹 페이지의 내용과 구조를 변경하는 것이 가능해졌다.
XHTML 1.0
웹 브라우져 외에 모바일 등에서도 실행가능한 Markup 언어 표준
비표준 : XUL, XAMJ, MXML, XAHJ, XForm
Ajax
웹에서 비동기 방식의 대화형 프로그램을 가능하게 하는 강력한 도구, Client에 적용되는 기술
새로운 기술이 아니라 XHR 객체 + DHTML 기술의 결합임
XHR 객체 : 1999년 Explorer 5.0에서 제공한 ActiveX(XMLHttpRequest) 객체, 다른 브라우져에서도 지원하기 시작함에 따라 비공식 표준으로 자리 잡음
DOM Level 3 Load and Save 1.0 (2004.4 표준으로 제정)
DOM 문서의 내용을 XML 컨텐츠를 사용하여 수정하는 기능 제공
현재 지원하는 브라우져는 없으나 향후 Ajax를 대체할 것으로 보임
Ajax 개요
현재까지 웹 어플리케이션은 요청/응답에 따라 웹 페이지 전부가 갱신되는 구조였는데
서버와의 비동기 통신을 통한 페이지 일부가 갱신되는 새로운 패러다임을 창출하였습니다.
Ajax의 기원
Jess James Garrett가 2005년 “Ajax : A New Approach to Web Application”라는 책에서 처음이 용어를 사용하였습니다. 원래는 Asynchronous JavaScript + XML의 줄임말로 생각되었으나, 이제는 단순히 현재 페이지를 다시 불러오지 않으면서 브라우져가 서버와 통신하는데 사용되는 모든 기술을 통칭하는 것으로 사용되고 있습니다.
Ajax 요소 기술
브라우져에서 프로그램 제어가 가능해짐에 따라 Client 기반의 MVC 모델이 개발되었습니다.
Client 기반의 MVC 모델에 따라 요소기술을 정리하였습니다.
Model : XHR (XMLHttpRequest) 객체, 서버와 비동기 통신을 위해 사용되는 객체로� 데이터 모델링을 위하여 XML 또는 JSON(JavaScript Object Notation)을 사용하고 있습니다.
View : HTML, CSS2, DOM3
Control : JavaScript
참고 : JSON (JavaScript Object Notaion)
JavaScript 기반으로 수 많은 프로그래밍 언어에서 지원하는 데이터 구조를 표현하기 때문에 이종 시스템간의 데이터 교환에 사용됨, 현재 최소 14가지 언어와의 바인딩 리스트가 나와 있음 XML과 같은 특성을 가지고 있으면서도 훨씬 적은 용량을 사용하기 때문에 사용이 확대되고 있음
Ajax 도구
Ajax를 사용함으로써 Client 기반의 MVC 모델 구축이 가능해짐에 따라 다양한 framework가 개발되고 있으며 또한 Ajax가 JavaScript 상에서 동작이 되므로 JavaScript 개발을 위한 다양한 도구가 작성되고 있습니다.
브라우져 framework
Dojo, Rico, 구글 AJAXSLT, libXMLRequest, RSLite, SACK, Taconite, …
Server framework
CPAINT, Sajax, JSON, 자바 블루프린트, MS의 Atlas 프로젝트, …
JavaScript 개발 도구
코드 문서화 : JSDoc
문법 검사기 : JSLint
압축/암호화 : HTML/JavaScript Cruncher-Compressor
테스트 도구 : JsUnit
검증 도구 : HTML 검증기, 체키(checky), DOM 검사기
디버깅 도구 : 그리즈 멍키, JavaScript 콘솔, MS 스크립트 디버거, 벤크만
패턴 : FAT 패턴, 자동갱신 패턴, 부분 페인팅 패턴, DOM 드래깅 패턴, …
-> 향후 JavaScript 통합 개발 환경이 나올 것으로 예상됨참고 문헌
분류: 기술_자료실