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


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편에서는 또한 테스트로부터 얻어낸 정보를 기반으로 설계 및 구현을 수정하는 반복적/점진적 개발 프로세스를 보여주고 있는데, 이 또한 매우 유익합니다.
마지막으로, 각 편에서 소개하는 참고자료 또한 매우 유용하고 알찬 정보이므로 꼭 한 번씩 읽어보실 것을 권합니다.
|
 |
!-->!-->!-->!-->!-->
|
 |