catch three stores with one web : 하나의 웹 페이지로 3대 스토어 앱 개발하기
TRANSCRIPT
![Page 1: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/1.jpg)
CatchThree Stores With
One Web생산성으로 소문난 하이브리드 앱을 끝가지 밀어붙여보기
![Page 3: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/3.jpg)
앱개발우선
개인 혹은 소규모 개발자의 입장이라고 생각합니다.
일반적으로
하나 이상의 디바이스 특성을 사용하고 네트웍을 이용합니다.
기본적으로
오프라인시에도 로컬에서 사용이 가능합니다.
![Page 4: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/4.jpg)
개발환경을
선택
내게유리한언어는H
TML
내가자신있는언어는H
TML
다른언어도잘할수는있겠지만
HTM
L5
세미나참석자니깐역시H
TML
그렇다면H
TML
에맞는개발환경이있는가
그환경에서개발한앱을배포할시장이있는가
HTML을 메인으로 하는
개발 환경, 마켓
![Page 5: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/5.jpg)
앱 개발자로 생활하기만만치 않다BY DAVID STREITFELD, NOVEMBER 17, 2012
![Page 6: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/6.jpg)
여러 마켓에 동시 진입십시일반
계란을여러바구니에나눠담기
모든언어에정통할필요없이
HTM
L을이용하여개발하면
여러환경에배포할수있다고
그것이하이브리드의장점이라고
들어왔거나
믿어왔거나
실제로경험했거나
하이브리드앱의 장점을
십분 발휘하는 전술
![Page 7: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/7.jpg)
무료배포레드오션에서 치열한 경쟁에 따른 당연한 귀결
광고 혹은 아이템 판매룰 통한 수익 모델
![Page 8: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/8.jpg)
웹 앱을 기본으로어차피
HTM
L
을기본으로하지않던가
브라우저로도접근하면좋지
데스크탑도가능하고
모바일브라우저에서도가능하니
시장이넓어지잖아
HTML에게 가장 유리한
환경을 잊지 않는다
![Page 9: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/9.jpg)
일석사조웹을 기본으로 3개 앱스토어에 무료앱을 배포하고 광고로 수입을
![Page 10: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/10.jpg)
몰타참치성공을 위한 동기부여 , 매우 개인적이지만
![Page 11: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/11.jpg)
웹뷰
UI
까지도네트웍을통해받아야하고
심지어오프라인이면사용불가이기도해
그리고서버없이도배포해야할것아냐
모든처리는웹에서하는거라면
결국앱에브라우저하나넣은거네
바탕화면에아이콘깔기위해만든다고하기도
기본적인 앱과는 다른
생산자 입장의 앱
![Page 12: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/12.jpg)
SenchaJavaScript기반의 강력한 앱개발 환경
하이브리드의 선두주자
![Page 13: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/13.jpg)
PhoneGapHTML중심의 개발을 꾀하는 오픈소스 기반의 환경
웹개발과 가까운 구성
![Page 14: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/14.jpg)
단어장 https://hamdalf.com/fingabulary
여친과의 행복한 영어 학습을 위한 서비스
![Page 15: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/15.jpg)
기술선택
HTM
L5
CSS3
JavaScript
jQu
ery Mo
bile
Web
Storage
Dro
pb
ox D
atastore
AP
I
Ap
ache W
eb Server H
ostin
g
No
de.js
HTML만으로 구현하는
앱의 기본 기능
![Page 16: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/16.jpg)
jQuery Mobilehttp://jquerymobile.com/
HTML을 통한 최소한의 설정으로도
가능한 앱 구현
![Page 17: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/17.jpg)
Web App’s Spec.
LOCAL STORAGE
사용이 편리함
문자열로의 변환에 유의
오래된, 안정적인
mailto: 크기의 한계
서버측 전송 구현
서버측 기술을 완전히 피할 순 없다
DROPBOX DATASTORE
쉬운 API
안정적인 성능
SSL 프로토콜 전용
인증서가 필요
URL 단순화를 위한 서버설정
![Page 18: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/18.jpg)
Android폰갭으로 도전하는 첫번째 환경
![Page 19: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/19.jpg)
폰갭 개발 환경 구성오픈소스개발환경설치가
까다로운것은알고있었지만
에디터따로
라이브러리따로
에뮬레이터따로
디버거따로
거기다가
버전선택에대한책임은
온전히니맘대로하세요
앱개발보다개발환경구성이
더어려워
Cordova 3.0.8을 중심으로
관련 라이브러리를 설치
![Page 20: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/20.jpg)
폰갭의
특징
웹코드를그대로이식하여즉시사용가능
웹뷰에서제한된웹기술도사용가능
브라우저식의창끼리의통신이나
아이프레임간의통신은어려움
디바이스에접근하기위해서는플러그인사용
플러그인이없으면직접개발해야함
결국원래의코드에서일부수정은불가피
자유로운앱개발의성격상
플러그인개발도불가피
살인적인디버깅환경
본격적인 앱을 위해서는
알아둬야 할 것이 많다
![Page 21: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/21.jpg)
IOS안드로이드에서의 고생이 헛되지 않다 . 하지만 .
![Page 22: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/22.jpg)
폰갭 플러그인 개발앱이라면
네이티브환경접근은
피할수없는요소이므로
관련플러그인을죽어라찾던가
최소한의
오브젝티브씨
자바
정도는해야한다는마음가짐으로
임하는것이좋을듯
디바이스 접근을 위해서는
HTML 만으로는 어렵다
![Page 23: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/23.jpg)
Android & IOS App’s Spec.
생산성
개발은 어려움
그럼에도 생산성은 높음
JAVA & OBJECTIVE-C
피할 수 없는
플러그인 검색 우선
최소한의 지식은 필요
서버측 기술을 완전히 피할 순 없다
DEBUGGING
쉽지않다
어렵다
살인적이다
안드로이드 부터 개발
![Page 24: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/24.jpg)
Windows 8네이티브에서 지원하는 JAVASCRIPT의 강력함 .
![Page 25: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/25.jpg)
사전경험웹 코드를 앱에 적용해 봤음 , 매우 단순했지만
![Page 26: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/26.jpg)
Windows 8 App’s Spec.
생산성
매우 높음
앱을 위한 수정이 최소
JUST JAVASCRIPT
네이티브로써 JS를 지원
사실상 별도 언어가 필요없음
자바스크립트 만으로 가능하다
DEBUGGING
편하다
![Page 27: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/27.jpg)
요약웹을 통한 배포시에도 서버측 기술은 필요한 듯
단 하나의 OS를 선택한다면 Mac. 하지만 매우 고사양의.
폰갭을 통하더라도 네이티브 언어는 피할 수 없음.
절대적이지는 않으나, 네이티브 개발 보다 생산성에서 우위.
노하우가 뒷받침 된다면 큰 결과를 얻을 수 있을 듯
단, 고통스러운 도전은 필수.
![Page 28: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/28.jpg)
이제, 시작쉽지 않지만 . 나아갈수록 즐거운 .
![Page 29: Catch Three Stores With One Web : 하나의 웹 페이지로 3대 스토어 앱 개발하기](https://reader031.vdocuments.site/reader031/viewer/2022020307/55a45cae1a28ab09648b461e/html5/thumbnails/29.jpg)
감사합니다다음번에는 시장 운영 결과를 더해보도록 하겠습니다 .