본문 바로가기
컴퓨터이야기/폰갭

[폰갭] 폰갭(PhoneGap) 설치하기 1

by 행중이 2014. 1. 24.
반응형



폰갭(PhoneGap) 설치하기 1

폰갭을 설치하기 전에 어떤 플랫폼에 앱을 올릴지 결정 해야 한다고 했죠?

저는 일단 안드로이드 플랫폼에 제 앱을 올릴 예정입니다.

그려려면 안드로이드 개발환경이 갖추어져 있어야 합니다.


1. JAVA JRE 설치하기

http://www.java.com/ko/download/manual.jsp 에서 자신에게 맞는 OS를 선택하여

받으시면 됩니다. 설치경로는 기억해 두셔야 합니다. 설치 할때 설치 경를 따로 지정하시지

않았다면 기본적으로 "C:\Program Files\Java\jre버전정보" 으로 되어 있을 것입니다.


2.JAVA JDK 설치하기

http://www.oracle.com/technetwork/java/javase/downloads/index.html에 

JAVA Platform (JDK)를 받으시면 됩니다. 마찬가지로 자신에게 맞는 OS를 선택하시어 받으시고

 설치 경로를 기억하세요~!

설치경로를 따로 지정하지 않았다면

"C:\Program Files\Java\jdk버전정보" 일 것 입니다.


3.Apache Ant 설치하기

http://ant.apache.org/bindownload.cgi에 zip archive 최신 버전을 다운 받습니다.

Apache Ant가 필요한 이유는 PhoneGap이 Command-line Interface(CLI)를 지원하기 때문입니다.

받은 파일은 임의의 경로에다 압축을 풀어줍니다

제 경우에는 "C:\apache-ant-버전정보"에다 풀었습니다.


4.Android SDK 설치하기



이미 Eclipse 같은 환경이 갖추어져 있다면 안드로이드 SDK만 다운 받으시면 되고,

처음 이용하는 사용자면 Eclipse와 안드로이드 개발 툴이 셋팅 되어있는 ADT 번들을 다운 받으시면됩니다.

안드로이드 ADT 번들과 SDK는 http://developer.android.com/sdk/index.html 이 곳에서 다운이 가능합니다.

받은 zip파일은 원하는 곳에다 압축을 푸시면 됩니다.

제 경우에는 "C:\adt-bundle"에다 풀었습니다.



5. 환경 변수 설정하기

프로그램이 JAVA나 ANT를 사용하려면 환경변수를 등록해 주어야 합니다.

컴퓨터 -> 시스템 -> 속성 -> 고급 시스템 설정을 눌러 '고급' 탭의 제일 하단에 위치한

'환경 변수' 버튼을 눌러 줍니다.


먼저 JAVA_HOME을 추가합니다.

시스템 변수(S)의 새로 만들기 버튼을 눌러 JDK가 설치된 경로를 적어줍니다.


JRE_HOME도 만들어 줍니다.

시스템 변수(S)의 새로 만들기 버튼을 눌러 JRE가 설치된 경로를 적어줍니다.


ANT_HOME도 만들어 줍니다.

시스템 변수(S)의 새로 만들기 버튼을 눌러 ANT의 경로를 적어줍니다.


마지막으로 상단의 사용자 변수에 새로 만들기 버튼을 눌러

PATH 변수를 만들고 변수 값으로 Android ADT 번들의 platform-tools의 위치와 tools의 위치를

';' 세미 콜론으로 구분하여 적어 주고 JAVA_HOME과 ANT_HOME의 bin폴더의 경로 까지 적어줍니다.

기존에 PATH 변수가 있다면 뒤에 연달아 적어주시면 됩니다.(세미콜론으로 구분하시고)





;C:\adt-bundle\sdk\platform-tools;C:\adt-bundle\sdk\tools;%JAVA_HOME%\bin;%ANT_HOME%\bin

순서대로 platform-tools경로, tools 경로 java_home, ant_home입니다.


자 이제 폰갭을 설치 할 차례입니다.

http://nodejs.org

에서 nodejs를 받아서 설치합니다.



설치 후 Node.js command prompt를 실행시켜

npm install -g cordova 명령어를 치면



코드가 쭈욱 나와서 다음과 같이 나오면

성공적으로 PhoneGab이 설치 된 것입니다.

실제로는 cordova라는 Uitlity가 설치 된 것 이지만 폰갭이라는 이름이 최근에

cordova라고 변경되었습니다.

 

설치가 성공적으로 끝나면 마찬가지로 환경변수의 사용자 변수 PATH에

;C:\Users\username\AppData\Roaming\npm를 추가해줍니다.

 


 

이상으로 PhoneGab의 설치법을 알아 보았습니다.

다음 포스트는 안드로이드 에뮬레이터에 껍데기 앱을 만들어 실행시켜 보겠습니다.

폰갭(PhoneGap) 설치하기 1

FIN.




반응형

댓글