주메뉴바로가기 본문바로가기

센차터치2/폰갭

  • 교육명센차터치2/폰갭
  • 교육상담1588-9780
  • 교육대상일반과정재직자과정
  • 강의캠퍼스
  • 모집인원20명

과정소개


‘모바일웹앱/하이브리드앱 개발
(HTML5/센차터치2/폰갭)‘



모바일 웹앱은 모바일 장치에서 구동될 수 있는 웹 기반의 어플리케이션을 의미하는 것으로서, 일반적인 웹 페이지 보다는
좀 더 포괄적인 의미입니다. 사용자들에게 모바일 친화적인 인터페이스와 페이지 이동시에 적절한 애니메이션 처리, 모바일의 단점인 네트워크의 불안정을 해소하기 위한 오프라인 구동이 가능한 웹이라는 특징들을 하나로 모아 놓은 형태입니다.

이러한 모바일 웹앱은 웹 브라우저만 있으면 사용자들에게 일반 App과 동일한 UI 환경을 제공할 수 있다는 장점은 있지만,
웹 브라우저로 접근해야 하기 때문에 일반 App 보다는 사용자들의 접근성에 취약한 면이 있습니다. 모바일 웹앱에 아주 약간의 작업을 얹게 되면 HTML페이지를 보여주는 형태의 설치 가능한 App을 제작 할 수 있습니다. 이러한 형태를 하이브리드 앱이라고 부르고, 페이스북, 네이버앱, SK엔카 등 이미 다양한 하이브리드 앱이 출시되어 있습니다.

본 과정은 HTML5 API와 Javascript 클래스 구조에 대한 기반을 다진 후, HTML5를 기반으로 하고 있는 모바일 웹앱 Framework 중에서 가장 각광받고 있는 Sencha Touch2 Framework를 기반으로 하는 모바일 웹앱 및 하이브리드 앱을 제작하는 과정을
통하여 iOS와 Android 두 마리의 토끼를 한번에 잡을 수 있는 방법을 제시합니다.
이 과정은 크게 다음과 같이 구성되어 있습니다.

HTML5을 기반으로 하고 있는 웹 기술을 통해서 어플리케이션을 개발하는 과정은 지금까지 나와 있는 스마트폰 디바이스들에 대하여 하나의 소스로 모든 형태를 지원할 수 있다는 이점과 함께, 앞으로 출시될 단말기들 역시 웹페이지를 볼 수 있는 기능만 있다면, 종류를 구분하지 않고 일관된 프로그램을 제공 할 수 있기 때문에 이미 많은 개발사들이 채용하고 있는 실무 제작 기술입니다. 이 과정은 하이브리드 앱이라는 주제로 모바일 어플리케이션 개발자로 도약할 수 있는 훌륭한 밑거름이되어 드릴
것 입니다.


교육정보

강의대상
  • 모바일웹앱이나 하이브리드 앱을 개발하고자 하는 개발자.
  • Java나 Object-C를 사용하지 않고 Android나 iOS용 App을 개발하고자 하는 개발자
  • Sencha Touch2를 익히고자 하는 개발자
  • 현재 웹 프로그래머로 활동하고 있는 개발자

커리큘럼

하이브리드 앱개발(html5/센차터치/폰갭)
강의일차하이브리드 앱개발(html5/센차터치/폰갭)
1일차
  • · 네이티브 앱, 모바일 웹, 모바일 웹앱, 하이브리드 앱
  • ·모바일 웹앱 framework
  • ·html5 기본 구조 및 모바일 웹앱을 위한 확장 태그
  • ·html5 api webform
  • ·queryselector
  • ·멀티미디어, webstorage, webdatabase, geolocation, application cache
2일차
  • ·framework 및 개발환경 구성
  • ·객체 지향 javascript
  • ·prototype을 사용한 클래스 정의하기
  • ·json 표기법
3일차
  • ·panel과 layout
  • ·button과 icon
  • ·toolbar와 titlebar
  • ·messagebox, overlay, actionsheet
  • ·form
4일차
  • ·멀티미디어
  • ·위치정보 활용과 구글맵 사용하기
  • ·화면전환
5일차
  • ·sass의 소개
  • ·sass를 사용한 사용자 정의 테마 만들기
6일차
  • ·ajax 통신과 xml 데이터 처리
  • ·xml 기반의 crossdomain 통신 (네이버 openapi 연동)
  • ·ajax 통신과 json 데이터 처리
  • ·jsonp 기반의 crossdomain 통신 (다음 openapi 연동)
7일차
  • ·템플릿을 사용한 화면 레이아웃 구성
  • ·확장 템플릿을 사용한 화면 구성
  • ·데이터 모델
  • ·데이터 스토어
8일차
  • ·데이터 뷰를 사용한 리스트 구현
  • ·데이터 프록시
  • ·데이터 스토어 핸들링
  • ·페이징 처리와 중첩 리스트
9일차
  • ·sencha cmd 설치
  • ·mvc 모델의 개요와 구조
  • ·view
  • ·sencha touch2 mvc 모델 (2)
  • ·controller
  • ·model
  • ·store
10일차
  • ·daum open api를 연동한 이미지 검색 app mvc 모델 적용하기
  • ·sencha touch2 android hybrid app
  • ·구글 마켓을 통한 배포 과정 소개
  • ·sencha touch2 ios hybird app


대표갤러리