qooxdoo

qooxdoo

qooxdoo 애플리케이션을 실행 중인 웹 브라우저
안정화 버전	7.8.0 / 2025년 1월 28일(2025-01-28)
저장소	github.com/qooxdoo/qooxdoo
종류	자바스크립트 애플리케이션 프레임워크
라이선스	LGPL, EPL
웹사이트	qooxdoo.org

qooxdoo(/ˈkuːksduː/)는 오픈 소스 소프트웨어 Ajax 웹 프레임워크이다. 이 프레임워크는 LGPL 및 EPL 라이선스를 따르는 클라이언트 사이드 및 서버 독립적인 솔루션이며, 전문적인 자바스크립트 개발 지원, 그래픽 사용자 인터페이스 (GUI) 위젯 툴킷, 그리고 고급 클라이언트-서버 통신 기능을 포함한다.

프레임워크

qooxdoo는 완전히 클래스 기반으로 이루어져 있으며, 객체 지향 프로그래밍 자바스크립트의 기능을 활용하고 네임스페이스를 기반으로 한다. 게코 (파이어폭스, 모질라, 시몽키), 프레스토 (오페라), 트라이던트 (인터넷 익스플로러, 리얼플레이어, 윈앰프), 웹킷 (크롬, 사파리)을 포함한 대부분의 현대적인 브라우저를 지원한다. 또한 Javadoc 스타일의 주석으로부터 자동 생성되는 API 참조를 포함한다. 함께 제공되는 도구 모음에는 자동 빌드 과정의 필수 요소인 포괄적인 자바스크립트 구문 분석기가 포함되어 있으며, 이는 애플리케이션 최적화, 데이터 압축, 링크, 배포 및 문서 생성에 사용된다. 애플리케이션의 국제화와 지역화도 지원한다. qooxdoo는 포괄적인 SDK로 다운로드할 수 있다.

GUI 툴킷

순수 자바스크립트 프레임워크임에도 불구하고, qooxdoo는 사용자 인터페이스 구현 측면에서 Qt, 표준 위젯 툴킷 (SWT) 등과 같은 GUI 툴킷과 대등한 수준이다. 네이티브 데스크톱 애플리케이션의 요소를 닮은 일련의 위젯을 제공한다. 키보드 탐색, 포커스 및 탭 처리, 드래그 앤 드롭에 대한 내장 지원이 제공된다. 크기는 정적(static), 자동 크기 조정(auto-sizing), 늘리기(stretching), 백분율, 가중치 플렉스(weighted flex) 또는 최소/최대 크기, 혹은 이들의 조합으로 지정할 수 있다. 모든 위젯은 유연한 레이아웃 관리자를 기반으로 하며, 이는 많은 고급 레이아웃 기능을 구현하는 데 중요한 역할을 한다. 인터페이스 설명은 성능 향상을 위해 자바스크립트로 프로그래밍 방식으로 수행된다.

사용자 인터페이스를 정의할 때 HTML이 필요하지 않으며, 인터페이스 스타일을 지정할 때 CSS가 필요하지 않다. 색상, 아이콘 및 기타 시각적 속성의 스타일을 지정하기 위해 간단한 모양 테마(appearance theme)가 사용되며, 이는 런타임 전환도 지원한다.

객체 지향 프로그래밍

qooxdoo는 새로운 클래스를 정의하기 위해 닫힌 형태(closed form)를 사용한다. 전역 클래스 생성자는 두 개의 인자를 받는데, 하나는 새 클래스의 이름이고 다른 하나는 'construct'(생성자 메서드 훅), 'statics'(정적 클래스 속성 및 메서드용), 'members'(인스턴스 속성 및 메서드용), 'destruct'(소멸자용)와 같이 미리 정의된 키 집합의 값을 제공하는 맵이다. 이 (때로는 큰) 맵이 클래스 정의를 나타낸다. 클래스는 'extend' 키워드를 사용하여 다른 클래스로부터 상속받을 수 있다.

다음 애플리케이션 골격은 이 기능이 어떻게 작동하는지 보여준다. 이 코드는 툴팁이 있고 눌렀을 때 경고 상자를 여는 버튼이 포함된 작은 애플리케이션을 생성한다. 온라인 플레이그라운드에서 이 코드를 직접 실행하고 편집할 수도 있다:

qx.Class.define("custom.Application",
{
  extend : qx.application.Standalone,

  members :
  {
    main : function()
    {
      this.base(arguments);

      // 버튼 생성
      var button1 = new qx.ui.form.Button("첫 번째 버튼",
                                          "icon/22/apps/internet-web-browser.png");

      // Document는 애플리케이션 루트임
      var doc = this.getRoot();

      // 고정 좌표로 문서에 버튼 추가
      doc.add(button1, {left: 100, top: 50});

      // 툴팁 부착
      button1.setToolTip(new qx.ui.tooltip.ToolTip("멋진 툴팁",
                                                   "icon/32/status/dialog-information.png"));

      // 이벤트 리스너 추가
      button1.addListener("execute", function(e) {
        alert("Hello World!");
      });
    }
  }
});

인터페이스와 믹스인도 비슷한 방식으로 정의하고 사용한다.

Ajax

qooxdoo 프로젝트는 클라이언트 사이드 및 서버 독립적인 솔루션이지만, 클라이언트-서버 통신을 시연하기 위해 선택적인 RPC 서버 구현(현재 자바, PHP, 펄, 파이썬)을 포함하고 있다. 추상 전송 계층은 XMLHttpRequest, Iframe 및 스크립트를 통한 큐, 타임아웃 및 구현을 지원한다. qooxdoo의 나머지 부분과 마찬가지로 이 계층은 비동기 통신을 단순화하기 위해 이벤트 기반 프로그래밍에 의존한다.

같이 보기

• Ajax
• 자바스크립트 프레임워크 비교
• 자바스크립트 프레임워크
• 자바스크립트 라이브러리

외부 링크

• 데모
• API 참조
• 소스포지 프로젝트 페이지
• Ajaxian.com의 비디오 브리핑
• HTMLGoodies의 리뷰
• Qooxdoo - 공식 웹사이트