브라우저 제목

1. java jdk 8.1 설치

설치가 완료되면 다음과 같이 내컴퓨터의 속성에서 

phone2.png

고급 시스템 설정을 클릭한다.

고급탭에서 '환경변수'를 찾아 클릭한다.

환경변수

시스템변수에서

phone3.png

 

새로 만들기를 클릭하여

변수이름: JAVA_HOME

변수값: C:\Program Files\Java\jdk1.8.0_161

를 입력한다.

phone4.png

 

시스템 변수에서 Path를 찾아

phone5.png

 

편집을 눌러

내용의 맨 뒤에 다음과 같이 입력한다.

;C:\Program Files\Java\jdk1.8.0_161\bin;

phone6.png

 

을 입력한다(윈도우의 버전에 따라서 다르게 표시될 수도 있다.)

 

윈도우로고 Key+R 

cmd를 입력하여 명령창이 나오면

java를 입력하여 java의 옵션 명령이 나오고

javac를 입력하였을 때 javac의 옵션 명령이 나오면 

정상적으로 설치되고 실행된 것입니다.

 

2. 안드로이드 스튜디오에서 sdk를 설치하기 위해 안드로이드 스튜디오를 설치한다.

c드라이브에 util폴더를 만든다(이곳에는 sdk파일, nodjs, ant, git등이 설치됩니다. )

https://developer.android.com/studio/index.html?hl=ko

android1.png

 

android2.png

 

android3.png

 

android4.png

 

android5.png

차례대로 next를 눌러 설치가 끝나면 안드로이드 스튜디오를 실행한다.

다음의 과정을 따라간다.

android6.png

 

android7.png

 

android8.png

 

 

android9.png

 

android10.png

 

 

android11.png

 

android12.png

 

 

android13.png

 

android14.png

 

 

android15.png

 

android16.png

 

 

android17.png

 

모두 끝나면 Finish를 누른다

 

 

OK를 눌러 기본창으로 돌아간 후 창을 닫는다.

SDK메니저를 이용해 위치를 util->sdk에 install합니다.

android18.png

 

android19.png

 

android20.png

 

 

android21.png

 

모든 설정이 끝나면 

 

환경변수 설정하기

android22.png

 

android23.png

 

3. nodejs를 설치한다.

 

https://nodejs.org/ko/

nodejs1.png

 

nodejs2.png

 

nodejs3.png

 

 

nodejs4.png

 

nodejs5.png

 

 

nodejs6.png

 

nodejs7.png

 

 

node설치가 끝나면

util폴더에 phonegap더를 만든 후 

다음의 경로에서 npmrc를 수정한다.

C:\util\nodejs\node_modules\npm

npmrc를 노트패드로 열어서

prefix=${APPDATA}\phonegap  ->  prefix=C:\util\phonegap
로 변경하여 저장한다.

윈도우로고키+R을 눌러 cmd 명령으로 명령창을 연다

npm을 입력하고 Enter를 눌러 옵션이 나오는지 확인한다.

옵션이 나오면 phonegap을 설치한다.

C:\>npm install -g phonegap@latest 를 입력하고 Enter를 누른다.

설치가 끝나면

 

환경변수 Path에 다음을 추가한다.

;C:\util\phonegap

 

apk를 정렬하기 위한 명령 zipalign을 실행하기 위해 아래의 부분을 환경변수 path에 추가한다.

;C:\util\sdk\build-tools\24.0.0;

 

4. phonegap 프로젝트를 만든다.

프로젝트를 진행하기 위해 D드라이브에 pproject폴더를 만든 후 다음처럼 입력한다.

C:\>D:     enter

D:\>cd pproject

D:\pproject>phonegap create HelloWorld kr.co.dothome.comja45

phonegap 프로젝트를 만들 phonegap 명령어

create : 새 프로젝트 생성 명령

HelloWorld : 프로젝트명 App이름

kr.co.dothome.comja45 패키지명

 

cordova 플렛폼 설치 작업

D:\pproject\HelloWord2>phonegap platform add andriod

android 플렛폼이 만들어져 있는지 확인

 

프로젝트가 생성이 되면 서버를 실행시켜 서버의 주소로 현재의 내용을 폰으로 볼 수 있다.

D:\pproject\HelloWord2>phonegap serve   Enter를 친다.

hello1.png

hello2.png

 

서버가 실행된 상태에서 'www'폴더에 있는 index파일을 수정하여 즉시 그 내용을 확인할 수 있다.

모든 프로젝트가 완성되면 배포를 하기 위한 apk를 작성해야 한다.

 

D:\pproject\HelloWord2>phonegap build android --release   Enter를 친다. 

 

오류가 생겼다면 여러가지 문제가 있어서 검토해야하는 것이 많다.

일단 서버를 종료하고 cmd을 실행시켜 다시 한번 build를 해도 같은 오류가 생겼다면

위의 설치중 문제가 있는 부분때문에 발생될 수 있다.

위의 과정을 다시 한번 하면서 확인하고 오류가 있는지 파악해서 처리해야 한다.

 

일단 오류가 없다면 다음과 같은 메시지가 뜬다.

 

hello3.png

 

apk파일이 설치된 곳을 찾아서 확인한다. 아래의 그림대로 찾아가면

apk폴더가 보이고 그곳에 apk파일이 보인다.

 

hello4.png

 

hello5.png

 

hello6.png

 

hello7.png

 

hello8.png

 

hello9.png

 

위의 apk파일만 있으면 일단 배포의 준비는 되었지만 서명을 하기 위한 파일을 하나 더 만들어야 한다.

 

배포키 만들기

D:\pproject\HelloWorld2\platforms\android\build\outputs\apk>keytool -genkey -v -keystore release.keystore -alias sample -keyalg RSA -keysize 2048 -validity 10000 

 

hello10.png

 

키에 서명하기

D:\pproject\HelloWorld2\platforms\android\build\outputs\apk>jarsigner -verbose -sigalg SHA1withRSA -digestalg SHA1 -keystore release.keystore android-release-unsigned.apk sample

 

정렬하기

D:\pproject\HelloWorld2\platforms\android\build\outputs\apk>zipalign -v 4 android-release-unsigned.apk sample.apk

 

hello11.png

 

제목 날짜
한 페이지에 여러화면을 구성 file 2018.01.28
패널을 이용한 메뉴와 그리드 file 2018.02.01
탭-collapsible 및 구글맵을 이용한 현재 위치 찾기 file 2018.02.04
여러 페이지를 이용하여 화면 구성 file 2018.01.28
기본 페이지 작성 file 2018.01.28
갤러리화면을 만들기 위한 fotorama 플러그인 file 2018.01.31
phonegap을 사용하기 위한 준비 작업 file 2018.01.24
jquey mobile 테마정하기 file 2018.01.28
index의 ui구성 file 2018.01.29
index ui구성2 file 2018.01.30
태그 목록