[ActionScript 3.0] Flex 이해하기 - 1

2007-02-26     엄진영

C/C++ 과 WinAPI / Win32API / MFC를 사용하여 윈도우 프로그램을 짜면서 뭔가 2% 허기짐을 느껴왔다. 유닉스 나 리눅스에서 윈도우 프로그램을 개발할 일이 그리 없었지만, 그래도 유닉스 윈도우 프로그램을 짜고 싶은 욕구는 개발자라면 누구나 한번쯤 가졌을 것이다.  



그러나, 그런 OS에서 실행되는 윈도우 프로그램을 짜려면 또 새로운 API를 사용하는 기술을 배워야 했고, 그런 과정이 너무 소모적이라 생각이 들었다. 



그런차에 자바라는 언어는 매우 매력적으로 다가왔다. OS에 종속됨이 없이 일관성 있게 윈도우 프로그램을 짤 수 있다는 것. 나에게 있어  매우 혁명적이었다. 



그러다, Perl, ASP, PHP, Servlet/JSP 등을 가지고 웹 프로그램을 짜면서 또 2% 부족함을 느꼈다. 왜 웹에서는 PC 애플리케이션처럼 사용자와의 상호작용이 기민한 UI를 구현하기 어려울까? 하는... 물론, 자바스크립트를 활용하면 되겠지만, 역시 흉내 내기에 급급한 모습이었다. 



기민한 UI를 제공하기 위해 나름의 여러 방법들이 제안되고 있긴 하다. 그중에 Ajax가 대표적이라 하겠다. 하지만 이것은 부분별 UI를 업데이트 하기위해 서버와 통신하는 기술인 것이다. 결국, UI 생성은 기존 방법인 HTML + JavaScript를 벗어날 수 없다. 



HTML + JavaScript를 직접 코딩한다는 것은, 엄청난 노동을 수반한다. 서버측 개발자나 웹 페이지 디자이너 모두에게 이것은 엄청난 부담인 것이다. 그래서, 웹 UI를 일관성있고 손쉽게 만드는 기술에 대해 많은 시도가 있어 왔다.



그중, 얼마전에 내가 참여했던 ERP 프로젝트인 경우는, Oracle ERP 기반 프로젝트로서 Oracle Application Framework을 사용하였다. 이 프레임웍에서는 웹 UI 생성을 위해 전용 XML 태그를 사용하였는데, 이렇게 XML 기반으로 작성된 웹 UI 는 클라이언트 요청 시 HTML + JavaScript 로 변환되어 웹 브라우저로 보내진다. 



이렇게 되면, 개발자는 더이상 HTML + JavaScript를 알 필요가 없어진다. 또한, 복잡한 차트나 테이블은 미리 컴포넌트로 정의되어 있어 간단히 설정만 하면 멋진 HTML + JavaScript 페이지가 생성된다. 어찌 매력적이 아니라 할 수 있겠는가?



Oracle은 JCP에서 JSR 127의 전문가 그룹(Expert Group)으로 참여하여 자신들의 기술인 OAF의 UI 생성 기술 반영을 적극적으로 개진하였다. 그 결과 JSF 라는 기술의 많은 부분이 OAF 기술과 유사하다.



* JCP(Java Cummunity Process) - 자바 기술 스펙을 개발하는 모임

* JSR (Java Specification Requests) - 자바 기술 명세 요청 문서. 즉, 자바에서 이런 기술을 채택하였으면 하는 기술 요구사항 문서. 

* JSR 127: JavaServer Faces - 자바 서버 애플리케이션 GUI 생성과 유지보수를 단순하고 사용하기 쉽게 해주는 API 와 아키텍처에 관한 기술 명세



이렇게 지난번 프로젝트에 이런 기술이 적용된 ERP 애플리케이션을 고객사에 맞게 커스터마이즈 했었다. 전처럼 직접 HTML + JavaScript를 작성할 일이 거의 없었다. 또한, 기본 UI가 미리 컴포넌트로 정의 되어 있기 때문에, 왠만한 UI는 머리 싸매며 고민할 필요없이 만들 수 있어서 매우 인상적이 었다. 



하지만, OAF에서 제공하는 UI가 Global Standard를 추구하다보니, 우리나라 사람 정서에는 영 아니었다. 아마, 월마트와 까르프와 같은 글로발 유통 업체가 깨진 이유(물론, 많은 이유가 있겠지만, 우리나라 사람들의 아기자기하고 뽀샤시(?)한 아름다움에 대한 눈높이를 만족 시키지 못한 것)와 유사할 것이다. 



그러나, 어떡하랴~. 해당 애플리케이션이 Global Standard를 주장하고 있으니 고객은 따라갈 수 밖에. 하지만, Global Standard라는 말만으로 고객의 불평을 잠재울 수는 없을 것이다. 국수주의 또는 민족주의 교육의 잔재든 어떻든, 우리는 초.중.고에서 끊임없이 들어왔던 말이 있다. 



'우리 조상은 외부로 부터 문물을 그냥 받아들이지 않았다. 우리에게 맞게끔 주체적으로 변형하여 받아들여 왔다.'



아~ 이런 우리의 정신을 "Global Standard" 라는 말로 잠재우기에는 너무 빈약한다. 그래서, 해결 방안을 찾던중에 어느 회사의 "X-Internet" 솔루션이 들어왔다. 그러나, 살펴보니 개발자가 웹 UI를 편리하게 생성하는 것은 똑 같았고, 다만 사용의 기민함을 위해 ActiveX 컨트롤을 사용한다는 사실이 추가되었다. 헐~~ 요즘 말많은 그 기술 ActiveX 컨트롤 기술. 



일단, 비판 부터 해보자.

단점 1, OS 종속 적이다. ActiveX는 윈도우즈에서만 실행된다. 

단점 2, Internet Explorer 종속적이다. 다음 웹 브라우저에서는 실행 안된다.

단점 3, 비스타에서 안된다. 기존에 구축된 고객사 애플리케이션을 어떻게 할 것인가?

단점 4, 향후 OS가 비스타에서 또 다른 버전으로 바뀐다면 어떻게 할 것인가?



MS는 참 고맙다. 비스타 출시로 인해 우리 IT 관계자(정부, 고객, 개발사 등)들에게 많은 생각을 하게끔 도움을 주었다. 요즘, 정부의 관계 부처에서는 다중 웹 브라우저를 지원하게끔 하겠다고 떠들고 있다. 



이런 저런 사건들로 분주하던 차에 눈에 들어오는 기술이 있으니, Adobe사의 Flex 기술이다. 무엇인가해서 파헤쳐 보니, Flash 를 만드는 기술이란다. 



그토록 웹 개발자들이 찾고 바라던 "기민한 UI", "미려하고 화려한 UI", "여러가지 다양한 효과 제공", "특정 OS나 웹 브라우저에 종속되지 않는 UI" 를 만들 수 있는 기술이 아니겠는가!



웹 개발자가 기존의 방법처럼 특정한 XML 태그와 스크립트 언어를 사용하여 UI를 작성하고, 컴파일 하면 바로 Flash 파일인 .swf 파일이 생성된다. 대부분의 사용자들은 자신들이 사용하고 있는 웹 브라우저에 Flash 플러그-인이 설치 되어 있다. 즉, 특별한 추가 설치 없이 실행 가능하다는 얘기다. 



이 어찌 반갑지 아니할쏜가? 그러나, 나만 안다는 것은 너무 안타까운 일이 아니겠는가? 따라서, 나처럼 UI에 대해 고민을 했던 서버측 개발자들과, 이제 새로 시작하는 개발자들에게 이 기술을 소개 할까 한다. 



이 플렉스 기술을 여러 단계에 걸쳐 여러분들께 소개하겠다. 우선 첫번째 단계로서, 플렉스 기술의 근간이 되는 ActionScript 3.0에 대해 먼저 소개할 것이다. 



ActionScript는 굳이 비교하자면 HTML + JavaScript 에서 "JavaScript" 와 대비 될 수 있을 것이다. HTML 과 대비되는 기술은 MXML 이다. 즉, HTML 문서내에 JavaScript를 삽입하여 쓰듯, MXML 내에 ActionScript를 삽입하여 사용한다. 



ActionScript는 객체지향 스크립트 언어다. 따라서, 기존에 객체지향 언어인 C++, Java, C# 을 접했던 분들은 접근하기가 훨씬 쉬울 것이다(특시, 자바 언어와 유사하다).



웹 클라이언트를 Flash 로 꾸민다고 생각하니, 가슴이 뛰지 않는가? 서버측 애플리케이션을 개발하는 개발자들 입장에서는 보통 웹 페이지의 Flash는 웹 디자이너가 만드는 일이라 생각하지 않았는가! 



드디어, 우리들에게도 멋지고 화면한 UI를 생성할 수 있는 도구가 생겼다. 현재도 많은 프로젝트들이 웹 클라이언트를 Flex를 가지고 구축하고 있다. 그러니, 이런 매력적인 기술을 안 배울수 있겠는가?



앞으로 연재되는 ActionScript3.0 에 대한 강의를 통해, 여러분들이 Flex에 대한 기술력을 갖추는데 도움이 될 수 있다면 좋겠다. 



그럼, 즐거운 시간이 되기를 바란다. 아자~ 아자~ 홧팅!!



p.s

연재되는 강의 제목은 '마누라, 플렉스 개발자 만들기 제1탄, ActionScript 너는 누구냐?" 로 정했다. 왜 하필 마누라냐고? 내가 남자이니까 마누라라 했고, 여자였으면 남편이라 했을 것이다. 여기서 마누라는 개발 입문자들을 대표하는 애칭이라 생각하면 된다. 



얘기를 재미있게 풀어가기 위해 "내 아내를 플렉스 개발자로 만든다" 라는 가정으로 이야기를 쓴것이다. 아무것도 모르는 마누라를 플렉스 개발자로 만들려하니, 얼마나 설명을 쉽게 해야 겠는가? 설명을 위해 단어 하나를 선택하더라도 고민이 된다. 



'나는 지금 아무것도 모르는 내 아내에게 Flex 프로그래밍 기술을 가르치려 하고 있다.' 이런 생각으로 강의를 연재할 것이다.



(사실, 내 아내도 나처럼 자바 강사로서 활동 하고 있고, 요번에 플렉스 기술을 습득케 하여 플렉스 강사로서 활동하도록 종용하고 있다. 부부 플렉스 개발자 및 강사 탄생인가? ^^)