Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

진도와켄도모바일

2,946 views

Published on

진도와켄도모바일

  1. 1. Naver : Jindo MobileKendo : KendoUI Mobile발표자 양용성SQLGate 개발사 대표
  2. 2. Jindo Mobile 은?네이버에서 독자적으로 개발한모바일 컴포넌트네이버만을 위한 독자적인 솔루션이 필요2011년 10월 0.9 베타 출시2012년 12월 1.5 버전
  3. 3. Jindo Mobile 장점모바일 전용 컴포넌트이다.마크업 구조이며, Jquery 와 비슷한 문법 구조를 갖는다.국산 컴포넌트이며, 기술지원이 한글로 된다.국산 안드로이드 단말기에서 거의 모두 잘 작동한다.반응속도가 빠르다.
  4. 4. Jindo Mobile 단점기본적인 버튼 위젯 같은게 없어서 모두 디자인해야한다.Jquery와 비슷하지만 호환은 안된다.페이지 로딩 방식으로 앱처럼 구동하기가 쉽지 않다.
  5. 5. Jindo Mobile 생각하는 결론네이버에서 만든것 처럼 만들수 있다.이것은 사용자가 네이버 모바일과 같은 친숙한 환경을 제공해 줄수 있다는 것과 같다.모바일 웹 개발에서는 최고의 생산성을 주지 않을까생각합니다.CSS 를 잘 아신다면…
  6. 6. Jindo Mobile 데모http://m.openbooks.co.kr - 열린책들http://m.infopub.co.kr – 정보 문화사
  7. 7. Jindo Mobile 일부 샘플 코드 - 리스트HTML<ul class="h_scl_u" id="new_booklist"><li class=scl_o onclick="location.href=bookview.php?bookid=7089214;"> <p class=scl_tmb><imgsrc=http://img.ikeepbook.net/cover/2144/30/07089214_64@2x.pngwidth=64 height=91 alt=오후 네시 class=tli_monerror="this.src=http://img.ikeepbook.net/no_image.jpg;"></p> <span class=scl_cnt><span class=scl_link>오후 네시</span></span> <ul class=info_lst> <li class=author>아멜리 노통브</li> <li class=date>2012-11-20</li></li></ul>
  8. 8. Jindo Mobile 일부 샘플 코드 - 리스트javascript //신간 자바스크립트 var NewListContent = jindo.$Element(new_booklist); var sNewTpl = "<li class=scl_o onclick=location.href="bookview.php?bookid={=BOOKID}";><p class=scl_tmb><img src={=IMGURL} width=64 height=91 alt={=TITLE2} class=tli_m onerror="this.src=http://img.ikeepbook.net/no_image.jpg;"></p><p class=scl_cnt><span class=scl_link>{=TITLE}</span><ul class=info_lst><li class=author>{=AUTHOR}</li><li class=date>{=PUBDATE}</li></ul></li>"; var o_New_More = new jindo.m.MoreContentButton(jindo.$(new_contentMore),{ nTotalItem : 27, //실제 아이템 개수 nShowMaxItem : 27, //최대 더보기 하여 보여줄 개수 nItemPerPage : 10, htAjax : { sApi : php/_newbest_json.php?c_id=PU00380240&new_book=1, sStart : start, //파라미터 명 수정 sDisplay : limit //파라미터명 수정 } }); o_New_More.attach({ more : function(oCustomEvt){ …. 이하 생략
  9. 9. Kendo Mobile 은?http://www.kendoui.com/HTML5 기반의 모바일 자바스크립트 프레임워크
  10. 10. KendoUi Mobile 장점모바일 전용 컴포넌트이다.HTML 마크업 구조이며, Jquery 기반이다.아이폰, 안드로이드 폰에서 UI 가 다르게 나타난다.반응속도가 빠르다.앱 같은 UI를 제공한다. 위젯
  11. 11. http://goo.gl/YisJA
  12. 12. KendoUi Mobile 단점유료이다. $399 30% 할인중…HTML5를 일부 구조를 이해해야 한다.너무 마크업스러워서 깜짝 놀랄때가 있다. <a data-click="closeModalViewLogin" data-role="button" data- align="right">닫기</a>
  13. 13. KendoUi Mobile 생각하는 결론Jindo mobile 보다 앱스러워서 앱스토어 등록이 가능할것 같다. 따라서 하이브리드 앱 개발에 적당하다고 판단함.디자이너의 역할이 jindo 보다 약하나, 디테일하게되면 더 곤란한 문제를 야기할 수 있다.IOS,Andoroid가 알아서 다르게 나오므로.. 뭐든 알아서 나오는것은 의심하고 본다.센차터치가 그것을 가장 크게 반증하고 있음.
  14. 14. KendoUi Mobile 일부 샘플 코드 - 리스트 <div data-role="view" data- title="Destinations" id="listview-home"> <ul data-role="listview" data- style="inset" data-type="group"> <li> Africa <ul> <li data- icon="toprated"><a>Nairobi</a></li> </ul> </li> <li> America
  15. 15. 감사합니다.

×