안드로이드(Android) PhoneGap, Eclipse 와 연동하여 개발을 위한 환경셋팅 1부

안드로이드(Android) PhoneGap, Eclipse 와 연동하여 개발을 위한 환경셋팅 1부

 

개발환경 : window 7 64bit, Eclipse Mars, Android 4.2.2

 

PhoneGap 은 간단히 말해서 웹앱을 쉽게 구현하게 해주는 프레임웍입니다. 이런 편리한 것들이 많이 나오니 생산성은 높아지고 쉽게 개발할수 있어서 좋아졌지만 개발스킬보다 아이디어로 승부를 해야 되는 환경이 나에겐 점점 힘들어 지는군요. ㅋㅋ 돌머리에 이끼 안낄려고 오늘도 공부만 하고 있으니 말이죠.

 

이번 아티클에서는 PhoneGap 파일을 다운로드

받아서 이클립스에 샘플프로젝트를 추가한뒤

어떻게 동작하는지 간단하게 볼 것입니다.

먼저 PhoneGap 사이트로 가서  Install 버튼을

클릭해 다운로드 페이지로 갑니다.

 

 

아래로 내려가셔서 압축파일을 다운 받습니다.

http://phonegap.com/install/

 

 

다음은 컴파일을 위한 Ant 와 JDK 를 설치해야 합니다.

Apache Ant 는 홈페이지의 왼쪽에 있는 Binary Distributions

메뉴를 클릭해 들어가서 파일을 다운 받습니다.

http://ant.apache.org/

 

 

저는 Zip 파일을 다운 받았습니다.

 

다운받아 압축을 푼후 bin 폴더위치를 환경변수에

등록합니다. Path 에 bin 디렉토리 위치를 넣으면 됩니다.

콘솔에서 어디서나 ant.bat 를 실행하기 위함입니다.

 

 

이클립스를 한번이라도 돌렸으면 JAVA_HOME 환경변수 만들어

설정이 되어있겠죠. 그리고 Path 에 bin 폴더 위치가 셋팅

되어있어야 합니다. 없다면 JDK 다운받아서 하시기 바랍니다.

 

 

이번에는 PhoneGap 의 bin 폴더를 Path 변수에 디렉토리를

넣습니다. 이것은 프로젝트를 생성하는 create.bat 를 쓰기

위해서 입니다.

 

 

주의할 것은 ant 의 bin 폴더를 환경변수에 넣을 때 PhoneGap 의 bin

링크 주소보다 앞에 와야 합니다. 그렇지 않으면 ant 없다고

에러 날겁니다.

 

환경설정이 끝났으면 이제 안드로이드용 프로젝트를

생성해야 합니다.

다시 Node.js command prompt 를 띄웁니다. 그리고

안드로이드 프로젝트를 만들 Workspace 로 갑니다.

Create 명령어의 첫번째인수는 프로젝트명이며 두번째는

패키지주소, 세번째는 메인 activity 명이 됩니다.

Ø  Create PhoneGapSample com.gon.phonegap MainActivity

 

 

 

이렇게 프로젝트를 생성하고 이클립스에서 import 합니다.

 

Import 하게 되면 처음에 아래와 같이 에러가 날겁니다.

Cordova 라이브러리가 없어서 그런 것이므로

다운 받은 PhoneGap Framework 프로젝트를

Import 해서 넣습니다.

 

 

아래는 Framework 을 추가한 모습입니다.

현재 제가 추가한 Framework 은 Android 4.3.1 을 사용합니다.

그 아래 버전은 에러가 납니다.

 

 

그리고 프로젝트의 Properties 속성으로 갑니다.

Android 메뉴를 선택한후 오른쪽에 Add 버튼을

클릭해 Cordova 프로젝트를 추가 합니다.

 

  

 

 

그럼 프로젝트에서 Android Dependencies 에는

Cordova.jar 가 추가 되어 있으며 에러 없이

정상적으로 컴파일 되었습니다.

 

실행하면 샘플화면이 정상적으로 뜹니다.