원문 : http://www.imaso.co.kr/?doc=bbs/gnuboard.php&bo_table=article&wr_id=36687
JQuery를 이용하면 보다 더 웹앱을 개발하기 쉬울것 같다.
jQueryMobile 오버뷰
지난해 여름 웹앱 개발에 관심이 있는 개발자들에게 깜짝 놀랄 만한 소식이 들려 왔다. jQuery(전세계적으로 가장 유명하고 가장 많이 사용하는 자바스크립트 라이브러리)팀이 모바일 버전을 개발하기로 했다는 소식이었다. 이 소식에 많은 사람들이 흥분했던 이유는 이미 시장에는 자바스크립트 기반의 다양한 모바일 프레임워크(이하 모바일 프레임워크)가 여럿 존재하고 있었지만 다양한 이유로 충분한 만족감을 주지 못하고 있었기 때문이다. 그렇다면 많은 개발자들은 왜 시장에 출시돼 있는 모바일 프레임워크에 만족하지 못했을까? 지금은 개발자들 사이에 일반적으로 많이 쓰이고 있는 ‘웹앱’이라는 용어만 보더라도 개발자들이 모바일 프레임워크에 무엇을 바라는지 쉽게 예상할 수 있다.
김민태 ibare77@gmail.com｜이미지클릭의 개발팀장으로 근무하고 있으며, WebDevMobile(www.webdevmobile.com)의 운영자이기도 하다. 개인적으로 최신 웹 기술에 관심이 많아서 이런 저런 활동을 하고 있다. 그 중 jQueryMobile에 관심이 많아서 WebDevMobile에 기초 강좌를 연재하고 있다.
웹 표준 기술(HTML, CSS, 자바스크립트)만을 사용해 개발된 앱이라는 의미의 ‘웹앱’은 그 용어에서부터 아이폰이나 안드로이드 앱(일명 네이티브앱)을 목표로 하고 있다는 것을 알 수 있다. 웹앱 개발자라면 누구나 네이티브앱이 사용자에게 제공하는 다양한 사용자 경험이 웹앱에서도 동일한 수준으로 제공될 수 있길 바란다. 그것이 가능할까?
현재를 기준으로 한다면 필자의 개인적인 견해로 대략 80% 정도 수준까지는 가능할 것 같다. 그리고 앞으로 이 격차는 점점 더 줄어들 것이 분명하지만 현재의 수준에서도 80% 정도 가깝게 네이티브와 유사한 UX로 웹앱을 개발한다는 것 또한 쉽지 않은 것이 사실이다. 보통 수준의 웹 개발자라면 상당한 수준의 도전과제인 것이 분명하다. 이런 이유에서 알 수 있듯이 개발자들이 모바일 프레임워크에 바라는 것은 좀 더 네이티브 같으면서 매우 쉽고 빠르게 개발하는 것이다.
하지만 대부분의 모바일 프레임워크들은 그 기대를 충분히 만족시키지 못했고 ‘아직은 조금 더 시간이 필요한가’라는 생각을 하게 될 즈음 들려 온 자바스크립트 세계에서 최고의 팀이라고 불러도 손색없을 jQuery팀의 모바일 프레임워크 개발 소식은 정말로 그들의 마음을 들뜨게 만들기에 충분한 사건이었다.
jQueryMobile의 출사표
| 모바일 프레임워크의 두 가지 타입 자바스크립트 기반의 모바일 프레임워크는 개발방법에 따라 다음과 같이 크게 ‘HTML 마크업 기반 개발 방식’과 ‘자바스크립트 코딩 기반 개발 방식’으로 구분할 수 있다. 마크업 기반 개발방식은 웹앱 페이지를 개발하는 방법이 기존 웹사이트 개발과 유사하다. 다만 한 가지 차이가 있다면 사용하는 모바일 프레임워크가 마크업 자체를 인식할 수 있도록 기본 형태를 가이드하고 있는데 이를 지켜야한다는 점이다. 이 방식의 장점은 웹 개발자가 거부감 없이 쉽게 웹앱 개발을 시작할 수 있으며 좀 더 직관적으로 화면 구성요소를 파악할 수 있다는 것이다. 마크업 기반 개발방식을 취하고 있는 대표적인 프레임워크로는 jQTouch와 jQueryMobile이 있다. 코딩 기반의 개발방식은 HTML 마크업을 최소화하고 프레임워크가 제공하는 자바스크립트 API를 이용해 순수하게 코딩으로 웹앱을 개발하는 것이다. 대표적인 프레임워크로 Sencha Touch가 있다. 이 방식의 장점은 HTML 마크업을 최소화함으로써 프레임워크의 일관성을 유지할 수 있고 프레임워크 버전업함에 따라 최종 결과물인 HTML 마크업의 튜닝을 프레임워크 제작자가 좀 더 수월하게 수정할 수 있다는 것이다. 웹앱 개발자는 프레임워크 API만 이용하기 때문에 최종 마크업의 변화를 신경 쓰지 않아도 되는 것이다. 단점이라면 웹앱 개발자가 프레임워크의 많은 API를 공부한 후에나 개발을 시작할 수 있기 때문에 진입장벽이 상당히 높다는 것이 있다. |
jQueryMobile 개발 발표 이후 얼마 지나지 않아 jQuery Mobile의 UI를 알 수 있는 일러스트 파일이 공개됐다. 이 한 장의 일러스트 이미지로 jQueryMobile에 대한 기대는 더욱 더 확고해진다. <화면 1>은 당시 발표됐던 일러스트 이미지의 일부다. 기존의 프레임워크들과 확연히 다른 모습을 볼 수 있다. 매우 많은 UI 구성 요소를 제공하고 N 스크린 대응 방식을 포함하고 있다. 더욱 놀라운 것은 모바일 디바이스의 범위를 벗어나 데스크톱도 그 범위에 포함시키고 있다는 것이다. 이것이 가능한 이유는 Fixed N 스크린 방식이 아닌 Resizable N 스크린 방식으로 구현됐기 때문이다.
두 번째로 눈여겨 볼 만한 부분은 많은 UI 구성 요소를 제공함에 있어 이미지의 사용을 최소화하겠다는 것이다. 이미지의 사용을 완전히 배제할 수는 없겠지만 지극히 최소화한다는 의미다. 이는 데스크톱과 다르게 제한된 성능을 갖고 있는 모바일 디바이스 상에서 최대한의 성능을 발휘하기 위한 것으로 보인다.
.jpg)
<화면 1> jQueryMobile UI
Fixed N 스크린 & Resizable N 스크린 2011년은 아마도 N 스크린 대응이 굉장한 화두가 될 것 같다. N 스크린 대응이란 데스크톱 이외의 수많은 디바이스들(스마트폰, 스마트패드, 인터넷 TV등)이 출시되면서 발생한 이슈다. 이런 디바이스들은 다양한 종류의 화면 크기와 각기 다른 해상도를 갖고 있기 때문에 애플리케이션 개발자들은 어떻게 하면 최상의 UI를 각기 다른 해상도에 맞춰 제공하느냐는 최우선 과제에 직면해 있다. 여기서 N 스크린 타입도 Fixed와 Resizable로 나뉜다. 대부분의 디바이스들이 고정 크기의 해상도를 제공하지만 데스크톱과 같은 윈도우 환경의 디바이스들은 앱의 최대 크기가 유동적이고 사용자의 선택에 의해 실시간으로 크기가 변하는 경우도 있다. N 스크린이라 불리는 많은 디바이스들이 지금도 쏟아져 나오고 있는 상황에서 모바일 프레임워크가 어떤 방식까지 지원하는지 또는 지금은 없지만 언젠가 나오게 될 미지의 해상도를 지원할 수 있는 방식으로 돼 있는지 확인하는 것은 매우 중요하다고 할 수 있겠다. |
jQueryMobile 베일을 벗다
2010년 10월 16일 드디어 jQueryMobile의 첫 번째 버전(알파 1)이 모습을 드러냈다. 그리고 비교적 빠르게 11월 12일 두 번째 버전인 알파 2가 공개됐다.
이후 업데이트는 아직 공개되지 않아서 현재 사용할 수 있는 최신 버전은 알파 2다. jQueryMobile은 공개와 함께 다음과 같은 많은 특징을 공개했다.
Lightweight size
Progressive enhancement
Compatible with all major mobile platforms
Built on jQuery core
Automatic initialization
HTML5 Markup-driven configuration
Accessibility
New events
Powerful theming framework
New plugins
멋진 내용들이 많지만 실제로 공개된 jQueryMobile의 모습은 많은 사람들에게 실망감을 준 것도 사실이다. 필자 또한 여러 가지 측면에서 실망감을 느꼈는데 가장 큰 이유는 기대했던 것만큼 네이티브앱스럽지 않다는 것이다. 하지만 실망감은 그리 오래가지 않았고 지금은 더 큰 기대감으로 다음 버전을 기대하고 있는 중이다. 자, 이제 첫 모습에 실망감을 안겨 주고 다시 큰 기대를 하게 만든 이유가 무엇인지 알파 2의 jQueryMobile의 특징을 중요한 것부터 하나 하나 살펴보자.
HTML5 마크업 기반 개발방식
jQueryMobile을 시작하기 위해 <리스트 1>의 코드를 모바일 앱이 되고자 하는 HTML 파일의 <HEAD>에 삽입한다.
| <리스트 1> jQueryMobile 초기화 파일 <link rel="stylesheet" href="http://code.jquery.com/ mobile/1.0a2/jquery.mobile-1.0a2.min.css" /> |
jquery.mobile-1.0a2.min.css 파일은 jQueryMobile의 UI를 정의하고 있는 CSS 파일이다. “min”이라는 중간 이름에서도 알 수 있듯이 개행문자 등 용량을 최대한 줄이기 위해 콤팩트한 파일로 제공된다. 이는 jQuery팀의 독특한 네이밍 방식이다. jquery-1.4.4.min.js는 jQuery 1.4.4 버전이다. jQueryMobile 프레임워크가 jQuery Core를 필요로 하기 때문에 반드시 포함돼야 하는 라이브러리다. 마지막으로 jquery.mobile-1.0a2.min.js는 jQueryMobile의 자바스크립트 라이브러리 파일이다. 이 세 개의 파일이 jQueryMobile의 필수 구성요소이며 반드시 <리스트 1>과 같은 순서로 배치돼야 한다.
이제 jQueryMobile을 사용하기 위한 준비가 모두 끝났다. 정말 간단하지 않은가? 이것이 가능한 이유는 jQueryMobile이 마크업 기반의 방식으로 개발됐기 때문이다. 이런 방식을 선택한 것에 대해 필자 개인적으로는 매우 현명한 결정이었다고 생각한다. 이 방법이 줄 수 있는 혜택이 매우 많기 때문이다. 초기화 파일을 포함하고 있는 완전한 코드는 <리스트 2>다.
| <리스트 2> jQueryMobile판 “Hello World” <!DOCTYPE html> |
<리스트 2>는 jQueryMobile판 “Hello World”다. 이 유명한 “Hello World”의 마법은 너무나 간단한 코드로 이뤄져 있지만 거의 모든 구조를 함축적으로 보여줄 수 있다는 것이다. jQuery Mobile판 “Hello World”도 그렇다. 눈치 빠르고 경험이 많은 개발자라면 <리스트 2>만 보고도 대부분의 jQueryMobile 구조를 이해할 수 있을 것이다.
<리스트 2>를 브라우저로 열어 보면 완전한 형태의 웹앱 UI를 보여준다. 가장 큰 특징이라면 자바스크립트 코드가 한 줄도 보이지 않는다는 것이다. 최소한 최초 초기화를 하는 코드라도 있어야 할 것인데 <리스트 2>에는 그런 부분이 전혀 보이지 않는다. 여기서 알 수 있듯이 jQueryMobile은 자바스크립트 코딩을 전혀 할 줄 모르는 퍼블리셔나 디자이너도 모바일 앱을 만들 수 있도록 해 준다. 마크업만으로 말이다. 이런 방식의 진정한 혜택은 일반 웹사이트도 초기화 파일을 추가하고 아주 약간의 수정을 거친 후 모바일 웹사이트로 둔갑시킬 수 있다는 것이다. 이것과 관련해서는 이후에 구체적으로 살펴보기로 하자.
웹앱 화면의 구성 특성상 하나의 화면은 크게 세 개의 영역으로 구분할 수 있다. 각각 타이틀, 콘텐츠, 푸터 영역이다. jQueryMobile은 <DIV> 태그로 각 영역을 구분하도록 하고 있으며 data-role이란 커스텀 속성값을 지정함으로써 각각 어떤 영역인지 프레임워크가 감지하는 구조다. data-role로 지정할 수 있는 값은 매우 다양하다. 이는 각 구성 요소를 설명할 때 자세히 살펴보자.
자동화
마크업 개발방식과 더불어 대부분의 액션이 자동화돼 있다는 것도 jQueryMobile의 특징이다. 여기서 자동화된 액션이란 웹앱 초기화, 화면 전환, 외부 파일 로딩, 폼 제출, 내비게이션 히스토리 관리 등을 말한다.
.jpg)
<그림 1> 자동화된 화면 전환 흐름
웹앱은 브라우저에서 메인 파일이 로딩된 후 모든 서브 화면을 메인 파일이 유지되는 상태에서 전환해야 하는 구조다. 이것을 가능하게 하는 방법에는 몇 가지가 있다. 하나의 파일에 모든 화면의 내용을 갖고 있는 것과 각각의 화면을 외부 파일로 구성하고 필요에 따라 Ajax 방식으로 불러들여 사용하는 방법이다. 각각의 방식은 장단점이 있으나 일반적으로 후자의 방식이 선호된다. 그 이유는 화면의 수가 몇 개 안 되는 앱의 경우 전자의 방식으로 개발해도 되지만 화면이 많고 업무가 복잡한 경우 하나의 파일에 모든 코드를 넣는 것은 매우 비효율적이기 때문이다.
<그림 1>은 웹앱 개발 중 많은 개발 로드가 걸리는 파트 중 하나인 화면간 전환 처리를 jQueryMobile에서 어떻게 자동화해주는지 그 구조를 보여준다. 웹앱에서 화면을 전환하는 방식으로는 링크에 의한 단순 화면 전환과 전환될 화면에 사용자에게 입력받은 데이터를 <FORM> 태그로 제출하는 두 가지를 들 수 있다. 두 가지 방식 모두에 대해 자동으로 Ajax 방식으로 처리해 준다. 따라서 외부 파일 전환을 위해 사용자가 별도의 Ajax 코딩을 할 필요가 없다.
또 한 가지 주목해 봐야 할 구조는 Stack History Manage ment다. 모바일 웹앱은 제한된 화면 크기를 갖고 있기 때문에 일반적으로 하나의 화면 안에는 최소한의 정보가 표시되고 부가적으로 더 많은 정보가 필요한 경우 화면을 나눠 상세화면으로 진입하는 방식을 많이 사용한다. 따라서 화면의 갯수가 조금 더 많이 필요할 수 있고 화면간 전환도 매우 빈번하게 일어난다. <그림 1>의 File 1에서 File 2로 이동하면 타이틀 바 좌측에 <Back> 버튼이 존재하고 이 버튼이 터치되면 다시 File 1로 이동한다. 마찬가지로 File 2에서 File 3으로 화면이 전환되면 File 3의 화면에서도 <Back> 버튼이 존재할 것이고 클릭 시 File 2로 이동하는 것이 정상일 것이다. 그런데 만약 File 1에서 File 3으로 전환되는 링크를 제공한다면 File 3의 <Back> 버튼 클릭 시 어떤 화면으로 이동해야 할까? 이 때 발생하는 이전 화면과 현재 화면간의 전환 정보를 고정된 링크로 처리하게 될 경우 링크가 꼬이는 문제가 발생한다. 문제를 해결하기 위해 화면 전환 경로를 저장해서 체크하고 관리하거나 화면구성 시 신중하게 설계해야 한다. 하지만 이런 처리를 개발자가 따로 할 필요 없이 프레임워크에서 자동으로 제공된다.
ARIA 지원
일반적으로 모바일 프레임워크의 최우선 과제는 미려한 UI 제공이다. 이 점에 있어선 jQueryMobile 또한 다를 바 없지만 독특하게도 jQueryMobile은 다른 프레임워크들이 관심을 두지 않는 접근성 마크업을 자동화해 지원하는 부분을 포함하고 있다. 웹페이지 뿐만 아니라 앱, 웹앱 등 애플리케이션 개발에 있어서도 접근성 지원은 매우 중요할 수밖에 없으며 경우에 따라 공공 서비스에서는 접근성 지원을 강제화하는 움직임도 있다. 이런 흐름에 맞춰 jQueryMobile은 ARIA(Accessible Rich Internet Applica tion)를 지원한다.
ARIA 지원을 위해 웹앱 개발자가 WAI-ARIA 마크업을 공부할 필요는 다행스럽게도(?) 없다. 물론 좀 더 수준 높은 접근성 지원 웹앱을 만들기 위해 공부한다면 더할 나위 없이 좋겠지만 지금 당장 꼭 그렇게 깊이 있게 공부하지 않아도 jQueryMobile을 사용한 것만으로 접근성 지원 웹앱을 개발할 수 있다. 어떻게 그것이 가능할까? ARIA 스펙을 알고 있는 개발자라면 눈치 챘을지도 모르겠다.
jQueryMobile이 각 영역의 타입을 결정하는 커스텀 속성인 data-role이라는 속성의 이름 중 role은 ARIA 속성과 그 이름이 같다. 실제로 data-role에 지정되는 속성의 값도 상당수 ARIA 속성의 값과 일치하고 있어서 ‘그것 차체가 ARIA인가?’하는 의문이 들 수도 있다. 하지만 그것 자체가 ARIA는 아니고 jQueryMobile이 초기화되는 과정에서 자동으로 data-role의 값을 파싱해 ARIA 속성인 role 속성으로 자동 변환한다.
실제로 그렇게 되는지 확인해 보자. <리스트 2>의 내용을 HTML 파일로 저장 후 브라우저로 열어 보면(데스크톱 브라우저로 보는 것이 확인이 편하다) <화면 2>와 같은 것을 볼 수 있다.
.jpg)
<화면 2> jQueryMoibile판 "Hello World"
Hello World 웹앱의 주요 코드 부분은 <리스트 2>지만 브라우저에서 제공되는 현재의 DOM 마크업을 볼 수 있는 Inspect Element 기능을 이용해 실제로 어떻게 구성돼 있는지 확인해 보자.
| <리스트 3> 크롬 브라우저의 Inspect Element로 확인한 DOM 상태 <html class="ui-mobile landscape min-width-320px min-width-480px min-width-768px max-width-1024px"> |
<리스트 3>을 보면 <리스트 2>의 소스와 많이 다른 것을 알 수 있다. jQueryMobile 프레임워크가 웹앱으로 재구성되면서 많은 속성들이 추가된 것을 볼 수 있다. 우리가 지금 주목해 봐야 하는 부분은 바로 role 속성이다. data-role의 header 값은 role 속성의 banner로, content는 main으로, footer는 contentinfo로 변환돼 추가돼 있는 모습을 볼 수 있을 것이다. banner, content, contentinfo 등은 실제 ARIA 속성의 값이다. jQueryMobile은 개발자가 ARIA 마크업을 모른다 하더라도 개발된 웹앱이 접근성을 지원할 수 있도록 이렇게 자동화된 변환방식을 제공하고 있다. 지금 당장 접근성 마크업을 공부하지 않고도 손쉽게 접근성 지원 웹앱을 개발할 수 있다는 것이다.
멀티 플랫폼 / 멀티 디바이스 지원
.jpg)
<화면 3> jQueryMobile팀의 테스트 디바이스
jQueryMobile은 프레임워크 기획 컨셉부터 다양한 디바이스, 플랫폼을 지원할 것을 목표로 설계됐다. 어떻게 보면 상당히 무모한 도전일지도 모를 일이지만 jQuery팀이 그동안 쌓아 왔던 크로스 브라우징에 대한 노하우를 생각해 본다면 자신감이 지나친 공수표는 아니라는 생각을 하게 된다. 그럼에도 불구하고 지울 수 없는 의문은 ‘세상 모든 디바이스가 항상 최신 스펙을 지원하는 브라우저를 탑재하고 있는 것이 아니기 때문에 그 목표가 과연 가능할까?’라는 근본적인 것이다. 이에 대한 jQueryMobile의 답은 무엇일까?
jQueryMobile팀은 최신 기능을 지원하지 못하는 브라우저를 만났을 때 어떻게 할 것인가에 대한 답으로 다음과 같은 표현을 했다.
“Graceful Degradation”
역설적이면서도 재미있는 표현이라는 생각이 든다. <화면 4>는 동일한 화면이 웹 표준 스펙 지원 범위가 다른 디바이스에서 어떻게 표시되는지의 상태를 보여준다. 왼쪽 화면과 오른쪽 화면의 차이점이 보이는가? 그렇다. 왼쪽 브라우저는 최신 스펙을 지원하지 못하는 브라우저이며 오른쪽 화면은 최신 스펙을 지원하는 브라우저다.
.jpg)
<화면 4> 하위 호환성 보장
jQueryMobile팀의 표현대로 우아함이란 의미는 비록 최신 스펙을 지원하지 못하는 브라우저라 할지라도 가능한 선에서 최대한의 모습을 보여줄 수 있는 방법을 취한다는 것이다. 또한 하락이라는 의미는 그럼에도 불구하고 최신 브라우저의 모습보다는 못한 모습을 보여 줄 수 밖에 없다는 것을 의미한다.
현실적으로 모든 디바이스의 브라우저에서 동일한 화면을 표시하는 것이 불가능한 상황에서 하위 브라우저를 포기하는 방식이 아닌 비록 약간 낮은 수준의 화면이라도 표시해 주는 방법을 취한 것을 필자는 옳은 선택이었다고 생각한다. 낮은 스펙의 디바이스 사용자들도 유사한 서비스를 받을 수 있으며 최신 서비스를 받고 싶다면 사용자의 선택에 의해 디바이스나 브라우저를 업그레이드하면 될 것이다.
.jpg)
<화면5> jQueryMobile 디바이스 지원 현황
<화면 5>를 보면 jQueryMobile이 얼마나 다양한 플랫폼과 브라우저를 지원하고 있는지 알 수 있다. 비록 디바이스별, 브라우저별 지원 편차가 존재하지만(가장 좋은 A등급부터 C등급까지) 현재까지 시장에 나온 모바일 프레임워크 중에선 가장 다양한 플랫폼을 지원하고 있다.
테마 시스템
.jpg)
<화면 6> 5가지 서브 테마
동일한 모바일 프레임워크를 사용한 앱이라 하더라도 다른 앱과 똑같은 디자인으로 출시하고 싶은 개발자는 없을 것이다. 비록 모바일 앱이라는 제한된 공간에서 사용자가 사용하기 가장 좋은 표준화된 UI 가이드가 존재하더라도 그 안에서 독특한 개성을 살리고 싶은 것이 개발자의 마음이다. 그런 이유로 모바일 프레임워크가 어떤 테마 시스템을 갖고 있는가는 중요하다. 일반적으로 테마 시스템은 스킨이라 불리는 방식으로 많이 제공되는데 jQueryMobile에서는 다소 독특한 방식으로 디자인됐다. 기본적으로 현재 선택된 메인 테마는 5가지 서브 테마를 갖고 있는 구조이고 a부터 e 값을 지정할 수 있는 5가지 서브 테마는 각각의 UI 구성요소별로 data-theme 속성에 서브 테마 값을 지정함으로써 <화면 6>과 같이 동일 테마 내에서 다양한 연출이 가능하다.
| <리스트 4> 두 가지 종류의 다른 버튼 만들기 <A href="#" data-role="button" data-theme="a">확인</a> |
jQueryMobile 테마 시스템의 또 다른 특징은 메인 테마를 실행 중에 변경할 수 있다는 것이다. CSS3 기반의 테마 시스템을 갖고 있는 웹앱의 특성을 잘 살린 멋진 기능이라고 할 만 하다. 메인 테마를 만드는 방법은 아직 공개되지 않았지만 완전한 테마 시스템이 공개되면 이 연재를 통해 그 내용을 충분히 다룰 것이다.
jQueryMobile의 발전 모습을 기대하며
jQueryMobile은 많은 모바일 프레임워크들 중에서 가장 최근에 나온 막내뻘이다. 아직 정식 버전도 아니고 베타 버전도 아닌 두 번째 알파 버전 상태지만 가장 많은 주목을 받고 있으며 가장 활발하게 활동하는 사용자 커뮤니티를 갖고 있다.
jQueryMobile은 아직 수 많은 버그를 갖고 있으며 구현되지 않은 많은 기능이 있다. 또한 다른 프레임워크처럼 잘 정리된 예제조차 제공되지 않기 때문에 제대로 학습하기가 쉽지 않은 것도 사실이다. 하지만 필자를 비롯해서 많은 사람들이 jQueryMobile의 훌륭한 목표와 영리한 컨셉을 지지하고 있기 때문에 조만간 흥미로운 많은 예제와 레퍼런스들이 출현할 것이다. 4회로 예정된 이 연재와 함께 jQueryMobile이 발전하는 모습을 지켜보는 것도 나름 즐거운 일이 되지 않을까 생각한다.
다음 호에서는 본격적으로 jQueryMobile을 이용해 웹앱을 개발해 보자.
참고자료
1. jQueryMobile 웹사이트 : http://www.jquerymobile.com
2. jQueryMobile 포럼 : http://forum.jquery.com/jquery-mobile
더보기.zip
chapter44.sample1.html