하이브리드 앱을 만들자 by cordova

(windows environment)

노드 설치하기CMD 창에서 버전확인 명령어로 정상적으로 설치되었는지 확인http://nodejs.org 에서 다운로드 후 설치 next.next.finishNode 4.x 버전 다운로드 . 5.0 버전에 코도바 프로젝트 생성 시 에러 있음

node -vnpm –v

코도바 설치하기npm 명령어로 cordova 설치하기 Npm install cordova -g

-g 옵션은 개발환경을 글로벌 영역에 설치 의미

Cordova -v 설치된 코도바 버전 확인

안드로이드 SDK 설치하기 1https://developer.android.com/sdk/installing/index.html

스튜디오를 설치해도 상관없음* 자바 환경설정이 되어 있어야 함

안드로이드 SDK 설치하기 2시스템 변수에 아래 경로 추가안드로이드 설치 path/sdk/tools안드로이드 설치 path/sdk/platform-tools

안드로이드 SDK 설치하기 3

Android –hAdb version

아래 커맨드를 실행하여 환경변수 설정이 제대로 되었는지 확인

안드로이드 에뮬레이터 설정android 명령어로 Android SDK Manager 를 실행Tools -> Manage AVDs 에서 가상디바이스를 생성

코도바 예제 생성 1cordova create hello com.example.hello HelloWorld -d

hello 라는 코도바 프로젝트 생성 명령어 – d 옵션은 경과 표시cd hellocordova platform add ioscordova platform add android생성한 프로젝트경로에서 ios 와 android 를 플랫폼으로 추가

코도바 예제 생성 2Cordova platform ls

프로젝트에 설치된 플랫폼 확인

Cordova platform remove ios설치된 플랫폼 삭제 ( 예 : ios)

코도바 예제 폴더 설명설치한 플랫폼

웹뷰에서 실행될 웹 관련 파일

코도바 플러그인

예제 프로젝트 실행에뮬레이터로 실행

웹브라우저로 실행

실제 디바이스로 실행디바이스의 디버그 옵션을 켜놔야함

Cordova emulate android –dCordova emulate ios -d

Cordova run android -dCordova run ios -d

Cordova serve

코도바 플러그인 설치https://cordova.apache.org

공식 사이트에서 플러그인 검색 후 설치

cordova plugin add cordova-plugin-camera검색한 플러그인 이름으로 설치 ( 예 : cordova-plugin-camera)

코도바 실행 life cycle(?) 설명순서1.DomContentLoaded (dom 모두 읽음 )2.Load ( 렌더링 리소스 모두 읽음 )3.Deviceready ( 네이티브 접근가능 )

Cordova prepare -d수정된 프로젝트 적용

프로젝트 재실행Cordova run android