시소당
하이브리드 앱 강좌 1
안드로이드 앱을 만들려던 어떤 웹개발자의 이야기
PHP를 주로 사용하고 HTML, javascript를 이용하여 웹사이트를 개발해 본 적이 있는 개발자가 있습니다.
스마트폰이 널리 보급되고 모바일 환경이 확대되면서 모바일 앱을 개발할 필요성을 느낍니다.
인터넷으로 “안드로이드 개발 강좌” 등을 검색해보지만 설치 과정부터 복잡함을 느낍니다.
우여곡절 끝에 안드로이드 개발환경 준비를 마치고 첫 어플리케이션을 만들어보지만 실행조차 쉽지 않습니다.
흰 바탕에 검은 글씨로 Hello, World만 덩그러니 출력된 첫 어플리케이션에서 디자인과 기능을 발전시켜 보려 하지만 곳곳에서 에러가 발생합니다.
빌드가 된 이후에 실행해도 “어플리케이션이 응답하지 않습니다”라는 메시지가 나오면 해결방법을 몰라 당황스럽기만 합니다.
에러 수정을 포기하고 어플리케이션을 새로 만드는 과정을 반복하다 보면 짜증이 납니다.
이대로 앱 개발을 포기하기는 싫어 학원이나 책을 알아보다가 지쳐 모바일 앱 개발은 당분간 미루기로 합니다.
어느날 “하이브리드 앱”이라는 개념을 알게 되고 인터넷에서 강좌를 검색해 봅니다.
그러나 제대로 된 자료가 부족하고 심지어 하이브리드 앱의 개념 설명조차 제대로 되어 있지 않습니다.
강좌 대신 학원, 카페 홍보로 끝나는 블로그글만 잔뜩 나옵니다.
그러다가 어디에선가 하이브리드앱의 성능이 떨어진다는 내용을 보고 난 뒤에는 마지막 남은 의욕마저 상실합니다.
하이브리드 앱의 개념
모바일 앱은 개발 방식에 따라 네이티브 앱, 웹 앱, 하이브리드 앱으로 나누어 볼 수 있습니다.
네이티브 앱은 게임과 메신저 앱 등을 비롯한 대부분의 앱에 해당됩니다.
통화, 푸쉬 알림, GPS, 카메라, 진동, 녹음, 저장공간 활용 등 모바일 기기에서 지원하는 기능을 전부 사용할 수 있습니다.
실행 속도도 빠르고 앱스토어, 플레이스토어 등에 업로드해서 배포할 수 있습니다.
인터넷이 사용 가능하지 않은 환경에서도 일부 기능을 작동할 수 있습니다.
개발 기간이 오래 걸리고 개발 비용도 많이 필요합니다.
인스타그램: 네이티브 앱
웹 앱은 일반적인 모바일 웹사이트를 의미합니다.
각종 포털 사이트, 커뮤니티 사이트, SNS 사이트 등을 예로 들 수 있습니다.
통화, 푸쉬 알림 등의 기능을 직접 사용할 수 없습니다.
실행 속도는 빠르지만 인터넷 접속 속도에 영향을 받습니다.
앱스토어, 플레이스토어 등에 업로드해서 배포할 수 없고 즐겨찾기(책갈피) 기능으로 홈 화면에 추가해서 접속할 수는 있습니다.
인터넷이 사용 가능하지 않은 환경에서는 사용할 수 없습니다.
네이티브 앱에 비하여 짧은 기간에 개발할 수 있고 개발 비용도 상대적으로 저렴합니다.
네이버 모바일 홈페이지: 웹 앱
하이브리드 앱은 이러한 네이티브 앱과 웹앱의 중간에 위치합니다.
웹 앱을 웹뷰를 통해 네이티브 앱 속에 포장한 것이라고 보면 됩니다.
대개는 웹브라우저 어플처럼 웹뷰(Webview)가 화면의 대부분을 차지하고 있는 형태입니다.
개발자는 특정한 웹페이지만 보여주는 웹브라우저와, 거기에서 보여줄 웹페이지를 개발하면 됩니다.
네이티브 앱의 카메라, 통화 등 네이티브 앱에서 사용할 수 있는 기능을 사용할 수 있습니다.
실행 속도는 기본적으로 네이티브 앱, 웹앱에 비해서 느리지 않지만, 게임 등에 필요한 고성능의 그래픽을 제공하기는 비효율적입니다.
인터넷이 사용 가능하지 않은환경에서도 일부 기능을 작동할 수 있습니다.
개발 기간과 비용은 네이티브 앱과 웹 앱의 중간 정도입니다.
Financial Times: 하이브리드 앱
위의 내용을 도표로 정리하면 아래와 같습니다.
출처: http://www.scribd.com/doc/50805466/Native-Web-or-Hybrid-Mobile-App-Development
다양한 플랫폼 지원(X축)과 모바일 기기의 기능 활용(Y축) 정도에 따라 도식화하면 아래와 같습니다.
출처: http://www.icenium.com/blog/icenium-team-blog/2012/06/14/what-is-a-hybrid-mobile-app-
하이브리드 앱으로 개발하는 것이 유리한 경우
모든 경우에 하이브리드 앱으로 개발하는 것이 적절한 것은 아닙니다.
다음과 같은 어플은 하이브리드 앱으로 개발하는 것이 좋습니다.
- Android, iOS, Blackberry, WindowsPhone 등의 여러 모바일 플랫폼에서 작동하는 어플
- GPS, 카메라, 통화 등의 모바일 기기 기능을 사용하는 어플
- 인터넷 접속이 안 되는 상황에서도 작동하는 어플
- 네이티브 앱에서만 얻을 수 있는 고성능의 그래픽이 필요하지 않은 어플
하이브리드 앱 개발 시 주의할 점
하이브리드 앱 개발은 기본 이상의 안드로이드 앱 개발 능력과 기본 이상의 웹페이지 개발 능력이 필요합니다.
즉 Java, CSS, HTML, javascript 등을 어느 정도는 할 줄 알아야 합니다.
하이브리드앱은 단순한 웹브라우저가 아닙니다.
단지 특정 웹사이트를 보여주기 위해서라면 굳이 앱을 개발할 필요가 없고, 개발하더라도 앱스토어의 검수를 통과할 수 없습니다.
웹사이트의 접근성을 높이기 위한 목적이라면 다음과 같이 즐겨찾기를 홈화면에 추가하도록 안내하면 됩니다.
하이브리드앱을 쉽게 개발하기 위해서는 jQueryMobile이나 SenchaTouch 등의 자바스크립트 프레임웍을 사용하여 웹페이지를 개발하고 이를 PhoneGap, Appcelerator, Appspresso 등으로 포장하는 방법을 택하게 됩니다.
그러나 이러한 방식으로 개발할 경우 성능의 저하가 나타나고, 특히 스크롤을 할 때에 두드러집니다.
따라서 본 강좌에서는 이러한 프레임웍을 사용하지 않고 하이브리드앱을 만드는 방법을 다룹니다.
하이브리드 앱 개발 강좌
강좌는 다음과 같은 순서대로 진행하겠습니다.
#4. 전자책형 앱
#5. 하이브리드형 앱
…(계속)…
참고 자료