AJAX Frameworks and Toolkits

Added by conkmj, last edited by conkmj on 10월 06, 2006  (view change)
Toggle Space Navigation Tree
Space Map

마끼 드실래요? jMaki(Java + 김밥)을 소개합니다.

AJAX Frameworks and Toolkits

Table of Contents

몇마디!!

  • 현재 사용되는 AJAX 툴킷과 프레임워크에 대한 전반적인 소개를 한다.
  • 어떤 상황에서 어떤 기술을 사용하는 것이 좋을지에 대한 대략의 가이드를 한다.

본론

  1. 클라이언트 측 아키텍처 레이어
    • Remoting abstraction layer: XMLHttpRequest과 IFrame에 대한 핸들링을 은닉
    • Proxy: 클라이언트 측 RPC-like 통신을 핸들링
    • Widgets and components: 미리 사용가능하게 만들어진 UI 위젯(calendar, button 등) 제공
    • JavaScript event handlers: 클라이언트 측 로직 제공
  2. 클라이언트 측 자바스크립트 라이브러리
    • 서버측 기술(Java EE, .Net, PHP, Ruby on Rails 등)은 어떤거라도 상관없다.
    • 런타임 동안 로컬 혹은 URL을 통해 접근, 동적 자바스크립트 코드 생성은 없다.

      원문
      Should be accessible during runtime either locally or through URL
      There is no dynamic JavaScript code generation

    • 하나의 애플리케이션에서 라이브러리 요소들을 조합해서 사용 가능하다. 여러 자원에서 위젯과 자바스크립트 유틸리티를 같이 사용하고 싶어질 때가 생길지 모른다.
    • 클라이언트 측 자바스크립트 라이브러리를 사용하는 기술적인 이유
      • 원격 비동기 통신은 핸들링 가능하다.
      • 브라우저간 비호환성을 핸들링한다. if/else로 코드를 혼란스럽게 하지 않아도 된다.
      • 우아하게 등급을 낮출수 있다(graceful degradation). 예를 들어 XMLHttpRequest를 지원하지 않는 브라우저에서는 IFrame을 사용하면 된다.
      • AJAX 상에서 페이지 탐색 고리(page navigation hooks)를 제공한다.
        > Back and forward buttons
        > Bookmarking
      • 미리 사용가능하게 만들어진 UI 위젯 제공
        > Tree, Calendar, Textfield, Button, Split panes, Fisheye 등
      • 사용하기 쉬운 DOM 유틸리티 제공, 오리지널 DOM APIs보다 사용이 쉽다.
      • 쓸모 있는 자바스크립트 유틸리티를 제공
        > Table management, Timer 등
      • 에러 핸들링을 추가하기 쉽다.
      • 보다 유연한 이벤트 핸들링 작업이 가능하다.
        > DOM node based, Function call based, AOP style
      • Advanced UI features 제공
        > Animation
        > Drag and drop
        > Fade out and Fade in
      • 일반적으로 객체 지향 프로그래밍 스타일을 권장한다.
    • 클라이언트 측 자바스크립트 라이브러리를 사용하는 비즈니스적인 이유
      • 시장에서 검증되었다. 일반적으로 자체 개발하는 것보다 품질이 좋다.
      • 잘 구축된 개발자/사용자 커뮤니티
        > 커뮤니티는 계속해서 기능을 향상시키거나 추가하고 있다.
        > 커뮤니티 포럼에서 도움을 쉽게 받을 수 있다.
      • 사용하기 쉽다.
        > 사용하고자 하는 것을 웹 애플리케이션 루트 디렉토리 또는 URL 위치에 설치하기만 하면 된다.
      • 툴 지원
        > IDE에서 조만간 지원 가능하리라 본다.
    • 클라이언트 측 자바스크립트 라이브러리
    • 장단점
      • 장점
        > 어떤 서버측 기술과도 같이 사용 가능하다.
        > 다양한 자원으로부터 많은 위젯들이 있다.
      • 단점
        > 개발자들은 여전히 자바스크립트를 배워야 한다.
        > 서로 다른 라이브러리들은 서로 다른 문법을 사용하고 있다.
      • 언제 사용하면 좋은가?
        > 다수의 서버측 기술을 사용해야 할 필요가 있을 때
        > 다수의 자원으로부터의 위젯들을 사용하기 원할 때(Java EE를 사용한다는 가정하에 jMaki가 이때 유용하다.)
  3. 프락시를 통한 RMI-like 리모팅
    • 특징
      • 일반적인 RPC 통신방식(stub, skeleton 기반 아키텍처)과 유사하다.
      • 클라이언트측 자바스크립트 코드상에 RMI-like 한 문법을 사용할 수 있다.
      • 프레임워크가 자바스크립트 코드인 클라이언트 측 stub(proxy)를 생성한다.
      • 프레임워크는 또한 서버측 런타임도 제공한다.
      • 클라이언트측 stub(proxy)는 파라메타와 리턴 값에 대해 마샬링을 핸들링한다.
    • 구현예
    • 장단점
      • 장점
        > 기존에 있던 백엔드 비즈니스 로직을 최소한의 노력으로 AJAX 클라이언트에 노출 가능하다.
        > 클라이언트 측 자바스크립트 코드 안에서 친숙한 RMI-like한 문법을 사용할 수 있다.
      • 단점
        > 해커들이 벡엔드에서 어떤 메소드들이 가용한지 알 수 있다.
        > 특별한 컨버터(mashaller and unmarshaller)가 특별한 형태의 자바 오브젝트를 위해 생성되어야 한다.
      • 언제 사용하면 좋은가?
        > 기존에 있던 백엔드 비즈니스 로직을 최소한의 노력으로 AJAX 클라이언트에 노출하고 싶을 때
  4. AJAX-enabled JSF 컴포넌트
    • 특징
      • AJAX-enabled JSF 컴포넌트는 AJAX 프로그래밍의 복잡함을 감춘다.
        > 페이지를 만드는 사람은 자바스크립트를 몰라도 된다.
        > 부담은 컴포넌트 개발자들의 몫이다.
      • IDE를 통해 드래그앤드롭을 하면서 웹 애플리케이션을 개발하는 JSF 모델을 촉진한다.
        > AJAX 애플리케이션을 개발하기 위해 Sun Java Studio Creator 2 및 다른 JSF-aware한 IDE에 AJAX-enabled JSF components를 드래그앤드롭만 하면 된다.
    • JSF 컴포넌트는 재사용 가능하다.
      > 커뮤니티에 의해 보다 많은 AJAX-enabled JSF 컴포넌트가 만들어지고 있다.
      > More AJAX-enabled JSF components are being built by the community
    • 구현예
    • 장단점
      • 장점
        > 드래그앤드롭으로 AJAX 애플리케이션을 만들 수 있다.
        > 3rd-party AJAX-enabled JSF 컴포넌트 제작을 꾀함
      • 단점
        > 만만한 작업이 아니다.
      • 언제 사용하면 좋은가?
        > 드래그앤드롭으로 구축하기 원할때
        > JSF-aware IDE를 사용하는 JSF 프로그래밍 모델에 이미 익숙해져 있을때
        > 자바스크립트 코딩을 하지 않기 원할때
  5. Wrapper(jMaki)
    • jMaki 등장 배경
      • 여러 AJAX 툴킷이나 프레임워크는 위젯을 포함하고 있는데, 각기 다른 문법을 가지고 있다.
        따라서 이런 다양한 위젯을 사용함에 있어 공통적인 프로그래밍 모델이 필요하게 되었다.
      • 자바스크립트 코딩은 자바 EE 프로그래머에겐 너무나도 이질적이다. 따라서 자바 EE 문법과 프로그래밍 모델을 사용하여 자바스크립트 위젯을 활용하는 필요성이 대두되었다.
    • jMaki가 무엇인가?
      • 자바 플랫폼을 위한 자바스크립트 랩퍼 프레임워크
        > j는 자바를 뜻하고, Maki는 싸다라는 뜻의 일본말
      • 웨젯을 JSP 혹은 JSF 태그로 쌈으로써 프로그래머가 다양한 AJAX 툴킷 및 프레임워크의 위젯을 사용 가능하게 한다.
    • 구현예
  6. 자바 to 자바스크립트/HTML 변환기(GWT)
    > AJAX 애플리케이션을 일반적인 자바 개발 환경에서 구현 및 디버깅을 한 후에 배포 시점에만 GWT를 사용하여 자바 애플리케이션을 자바스크립트 및 HTML로 변환한다.
  7. AJAX 확장기능을 포함한 웹 애플리케이션 프레임워크
    > 기존 웹 애플리케이션 프레임워크에 AJAX 기능을 추가함. 필요 없거나, 최소한의 자바스크립트 코딩이 필요
    > 내부적으로 자바스크립트 클라이언트 라이브러리 사용
  8. 이 중에 무엇을 사용해야 하는가?
    • UI 쪽
      > Sun Java Studio Creator 2와 같은 JSF-enabled IDE 사용이 가능하다면 AJAX-enabled JSF 컴포넌트를 사용해라.
      > JSF 컴포넌트 솔루션을 사용할 상황이 아니면 jMaki를 사용해라.
      > 자바스크립트 코딩에 대해 전적인 통제를 원한다면 Dojo 툴킷을 사용해라.
      > 이미 스윙 애플리케이션을 가지고 있는 상태에서 AJAX 기능 추가를 원하고 자바스크립트 코딩은 피하고 싶다면 GWT를 사용해라.
    • 비즈니스 로직 쪽
      > 이미 자바 EE로 구현된 비즈니스 로직을 가지고 있는데, 클라이언트로부터 AJAX적인 행위의 RMI 콜을 핸들링하고 싶다면 DWR을 사용해라.
      > 이미 특정 웹 애플리케이션 프레임워크를 사용하고 있는데, 그것이 AJAX 확장 가능하다면 그것을 계속 사용해라.

실습과 숙제

의문점

참고문헌

문서에 대하여

최초작성자 : [김민재]
최초작성일 : 2006년 8월 22일
버전 : 0.9
문서이력 :

  • 2006년 8월 22일 김민재 문서 최초 생성
  • 2006년 10월 6일 김민재 문서 초안 완성
Enter labels to add to this page:
Please wait 
Looking for a label? Just start typing.

Comments (3)

 

  1. 8월 22, 2006

    자바지기 says:

    두번째 강의가 시작되었군요. 참 형의 열정에 감탄하고 있습니다. 요즘 저는 무기력증에 빠져서 살고 있사옵니다. 내일 오랜만에 얼굴 뵙겠네요.. ...

    두번째 강의가 시작되었군요. 참 형의 열정에 감탄하고 있습니다. 요즘 저는 무기력증에 빠져서 살고 있사옵니다. 내일 오랜만에 얼굴 뵙겠네요..

    앞으로도 좋은 문서들 많이 부탁드리겠습니다.

    1. 8월 22, 2006

      conkmj says:

      같은 증세인지는 모르지만, 한동안 정말 열심히 했던 때가 있었는데,,, 한 일주일,, 그 다음 일주일이 정말 무기력하던데.. 너무 급하게 하면 ...

      같은 증세인지는 모르지만, 한동안 정말 열심히 했던 때가 있었는데,,, 한 일주일,, 그 다음 일주일이 정말 무기력하던데.. 너무 급하게 하면 안되겠다는 반성을 했지.. 이 컨텐츠의 경우도 거북이 걸음으로 끝까지 한다는 생각만 하고 있어. 암튼 힘내!!

  2. 4월 06, 2007

    icreater says:

    간단할줄로만 알았던 Ajax.. 보면 볼 수록 공부할게 정말 많네요...^^; 언제 이해를 다 할 수 있을지..ㅋ

    간단할줄로만 알았던 Ajax..
    보면 볼 수록 공부할게 정말 많네요...^^;
    언제 이해를 다 할 수 있을지..ㅋ