IBM®
메인 컨텐츠로 가기
    Korea [국가변경]    이용약관
 
 
   
        제품    서비스 & 솔루션    고객지원 & 다운로드    회원 서비스    
한국 developerWorks   >  기획 기사  > developerworks

Finite State Machine 이론을 응용해 JavaScript로 고급 웹 위젯 만들기



필자 | 강규영, 엔씨소프트 오픈마루 스튜디오 웹서비스 개발팀 alankang@openmaru.com

2007년 11월 13일

Ajax 열풍 덕분에 자바스크립트가 점점 더 중요한 언어로 부각되고 있습니다. 최근 부상하고 있는 '클라이언트 기반 매시업(mash-up)'이라는 추세에서도 자바스크립트가 주요 기술로 쓰이고 있습니다. 자바스크립트는 더 이상 '세상에서 가장 천대받는 언어'가 아니라, 제대로 된 프로그래밍 언어로 자리매김하고 있습니다.

이에 따라 자바스크립트 개발자들이 갖추어야 할 교양(혹은 배경 지식)의 종류도 점차 다양해지고 있습니다. 지금까지는 주로 HTML이나 CSS, 각종 브라우저의 특성과 같이 구현 중심적인 측면에 대한 관심사가 대부분이었지만, 앞으로는 요구 분석, 설계, 테스트 등 소프트웨어 개발의 모든 분야로 확대될 것입니다.

이 기사는 유한 상태 기계(Finite State Machine)에 기반을 두고 이벤트 중심(event-driven) 프로그램을 설계하고 이를 자바스크립트로 구현하는 방법을 단순한 이론의 나열이 아니라 실용적인 모듈을 개발하는 과정을 통해 전달하고 있습니다.

  • 1편: 위젯 디자인 (한글)

  • 이 연재를 통해 개발하고자 하는 모듈은 웹 페이지에서 사용할 수 있는 고급 툴 팁(tool-tip) 위젯입니다. 1편에서는 앞으로 만들고자 하는 위젯이 지원할 기능을 정하고, 상태 다이어그램이나 상태 전이 테이블 등의 표기를 이용하여 위젯을 설계하는 과정을 보여줍니다. 상태 전이를 이용한 설계는 사용자 인터페이스 및 네트워크 관련 프로그램에서 매우 유용하게 쓰이는 방법이므로, 자바스크립트 개발자들에게는 특히 중요합니다.

  • 2편: 위젯 구현하기 (한글)

  • 2편에서는 1편에서의 설계를 자바스크립트 코드로 구현하는 과정을 보여줍니다. 이 과정에서 객체(associative array나 hash 또는 dictionary 등으로 불립니다), 익명 함수(anonymous function) 생성 및 전달, 프로토타입 기반 객체지향 프로그래밍(prototype based OOP) 등 자바스크립트의 여러 특징을 두루 살펴볼 수 있습니다.

  • 3편: 위젯 테스트 하기 (한글)

  • 3편에서는 2편의 구현을 브라우저에서 테스트합니다. 여기에서 소개하는 테스트용 장치를 통한 수동 테스트는 테스트 자동화(test automation)를 향한 중요한 진전이라고 볼 수 있습니다. 3편에서는 또한 테스트로부터 얻어낸 정보를 기반으로 설계 및 구현을 수정하는 반복적/점진적 개발 프로세스를 보여주고 있는데, 이 또한 매우 유익합니다.

마지막으로, 각 편에서 소개하는 참고자료 또한 매우 유용하고 알찬 정보이므로 꼭 한 번씩 읽어보실 것을 권합니다.



위로


문서 옵션

JavaScript가 필요한 문서 옵션은 디스플레이되지 않습니다.

사이트 여행

dW 커뮤니티
포럼 | 블로그 | Spaces
dW Student Community

로컬 컨텐츠

행사 및 세미나

개발자 입문 | IBM Software 입문

튜토리얼 및 교육

TOP 10 인기자료

SW 다운로드

RSS 피드

뉴스레터
  
자바스크립트가 작동이 중지되었습니다. 이 기능을 수행하시려면 브라우저에서 자바스크립스트를 작동시켜 주시거나 이곳을 클릭해주세요.
Special offers
SOA Series
WebSphere Download
db2expressC
기획 기사 시리즈

    IBM 소개 개인정보 보호정책 문의