DailyGrid IT Solution Review Report
HTML 5 완벽 지원…DB 모델링 도구 통합으로 사용자 편의성 향상

엔터프라이즈 RIA 애플리케이션 구축에 필요한 클라이언트 아키텍처와 데이터 커뮤니케이션, 그리고 이클립스(Eclipse) 기반의 통합개발도구 등을 포함하고 있는 토마토시스템의 UI개발툴인 eXria. 웹 표준을 지켜 HTML5를 완벽히 지원하는 툴로 각광받고 있는 이 제품의 기능을 써보고 리뷰했다.

[Overview]
2000년대 초, 웹 초창기 시절 다양한 운영체제 환경에서 원소스 멀티유즈 개념을 구현하기 위해 자바(JAVA)가 등장했다. 운영체제가 다른 경우, 운영체제마다 별도의 코딩을 해야 했는데 이런 이슈를 자바가 해결해 관심받았다. 이를 통해 개발한 하나의 소스를 다양한 운영체제 환경에서 사용할 수 있게 됐다.

브라우저 이슈가 등장한 2000년대 중반엔 표준 브라우저 전쟁이 시작됐다. IE, 크롬, 사파리 등 다양한 브라우저 환경에서 프로그램이 동작돼야 했는데 해당 제품을 만드는 벤더들이 해결할 과제였다. 멀티 브라우저를 해결하기 위해 순수하게 웹 표준을 지켜야 한다는 이슈가 등장했으며, 자바에서 제공하는 애플릿을 이용해서 이런 이슈를 해결해 나갔다.

그러나 이 시기에 멀티 디바이스 이슈가 새롭게 등장하며 자바의 위상은 흔들렸다. 스마트폰, 태블릿 등 멀디 디바이스 환경에서 프로그램이 동일하게 구현해야 한다는 이슈가 등장했지만, 이를 자바 애플릿만으로 해결하기는 어려웠다. 이 때부터 벤더들은 문제 해결을 위해 각자 길을 찾아 나섰다. 특정 회사들은 모바일에 특화된 제품을 만들기 시작했고, 어떤 회사들은 애플릿 기반으로 멀티브라우저 이슈만을 해결하는 제품을 시장에 선보였다.

여기까지 지난 10여년 간 UI 개발 툴 시장에서 벌어진 몇가지 기술 이슈를 간략히 점검했다. 토마토시스템의 eXria(엑스리아)는 이런 이슈들을 모두 해결한 전문 UI툴로 주목을 받아왔다. 주요 기능 먼저 정리한 후 리뷰를 적는다.

지난해부터 이슈가 되고 있는 HTML5는 정치적 이슈가 강해서, 아직 스펙이 모두 정해지지 않은 상태다. 스펙은 계속 변화하고 있지만, '웹 표준을 완벽하게 지원해주는지 여부'가 항상 논란의 핵심이 되고 있다. eXria는 웹 표준을 모두 지원하기 때문에 HTML5 를 모두 지원한다고 볼 수 있다. 프로그램 구현 과정에서 이슈가 발생할 뿐이지, 웹 표준 기능을 모두 지원한다.

멀티 디바이스, 크로스 브라우징(멀티브라우저) 기능 제공

eXria는 개발툴인 만큼, 실제 제품을 이용하는 개발자, 개발된 화면을 보는 일반 사용자, 그리고 해당 제품을 갖고 서비스를 제공하는 운영자 모두에게 적용에 따른 이점을 제공해야 할 것이다.

개발자 측면에서 강점은 친숙함이다. eXria는 이클립스 기반이라 개발자들이 툴에 대한 기능을 새로 학습할 필요가 없어 툴에 대한 학습속도가 매우 짧은 편이다. eXria로 개발된 화면을 접하는 일반 사용자들은 모바일 등 멀티 디바이스에서 서비스를 이용할 수 있다. 크로스 브라우징 기능도 제공하고, 화면의 응답속도는 매우 빠르다.

제품 기능은 강력하다. 위즈윅(WYSWYG) 기능을 제공해, 드레그엔드롭으로 컴포넌트를 갖다 배치해 코딩을 하지 않고 직접 갖다 쓸 수 있다. 또 디버깅 기능과 코드 인텔리전스 기능이 강하다. 여기에 자체 개발한 모델링 도구인 eXERD란 제품을 eXria에 결합해 개발자의 편리성을 더 했다.

[Review]
이클립스 기반으로 친숙한 개발 환경 제공

화면구성이 우선 돋보인다. 몇 가지 기능 개발을 위해 eXria를  PC에서 구동했다. 대중적인 자바 개발툴인 이클립스와 흡사한 형태의 화면 구성을 갖춘 화면이 떴다. 자바 개발자의 70% 이상이 이클립스를 쓴다는 통계도 있듯이, 이클립스 화면 구성을 따르는 eXria를 사용하는 개발자는 툴 학습시간을 줄일 수 있다.

개방형 구조인 eXria는 이름이 알려진 다양한 자바스크립트 라이브러리와 쉽게 연동해 쓸 수 있는 점이 좋아 보인다. 이는 웹 표준을 준수했기 때문에 가능한 일. 이름이 널리 알져진 프레임워크인 제이쿼리나 NHN진도의 라이브러리를 함께 연동해서 프로젝트를 성공적으로 진행한 경험을 갖고 있다.

eXria 개발 기능 중 ‘그리드(grid)’는 특히 돋보였다. 먼저 컬럼이동, 핀고정, 숨김, 멀티해더, 숨김, 수치기능제공, 그리드 간에 드레그엔드롭 등의 기능을 제공한다. 여기까진 UI개발 툴이면 모두 제공하는 기능이다. eXria엔 경쟁사가 제공하지 않는 특별한 ‘간트(gantt)’라는 기능을 웹 표준 기반으로 제공한다.

간트는 스케줄링에 특화된 기능으로 테스크 간의 연결성을 라인 등을 이용해 시각화해서 보여준다. 표를 만들고 간트를 이용해 해당 그리드 간의 관계를 직관적으로 볼 수 있었다. 간트 기능이 없는 경쟁제품의 경우, 더블클릭을 해서 팝업을 띄운 후 특정 잡과 다른 잡이 어떤 관계가 있는지 파악해야 한다. 개발자 측면에선 두 개의 화면을 만드니 공수가 곱절 더 들어간다.

표라든지 막대그래프 등을 그리드 위에서 구현하는 기능도 눈길을 끌었다. 액티브X나 플래시를 적용한 솔루션을 쓰면 이 기능 구현이 가능하지만, 웹 표준형태로 보여주는 그리드에서 표나 그래프를 구현해주는 제품은 eXria가 유일하다.

강력한 시각화 기능 제공 ‘눈길’

개발자들에게 특별한 관심을 받는 것이 ‘시각화 기능’일 것이다. 일반적인 UI툴은 시각화 기능이 매우 약해 화면이 복잡하다는 단점이 있다. 첫 화면에 버튼이 수십개 있고, 탭으로 이동하면 수백개씩 기능 버튼이 숨어 있다. 화면을 구현하기 위한 자바스크립트 코드가 못해도 1,000라인을 넘어설 것이고, 이것들과 관계 맺을 데이터 모델들도 매우 복잡할 수 밖에 없다. 경력이 있는 고급개발자라면 머릿속으로 그려 나갈 수 있지만, 화면이 복잡해지면 초급개발자들은 어려움을 겪게 된다.

eXria는 이런 문제점을 해결하기 위해서 강력한 시각화 기능을 제공한다. 객체간 관계가 어떻게 되는지, 몇 번째 라인의 자바스크립트와 몇 번째 위치의 데이터 모델과 화면이 어떻게 관계되는지, 라인으로 연결하는 방식을 써 시각적으로 보여줬다. 이렇게 머리 속으로 생각했던 관계를 눈으로 선명하게 볼 수 있는 점이 매우 편리해 보였다. 객체간의 관계를 시각화한 이 기능은 사용자 직관성을 높여 개발 생산성을 향상시켜준다.

* 다음편에 계속