Cordova로 Android 앱 만들기

초간단으로 초간단한 안드로이드 앱을 만들어 봤습니다.
Windows 기준입니다.

준비

  • Android Studio 와 SDK 를 설치합니다.
    BS는 [구글 다운로드 사이트]에서 무설치 압축 파일로 받았습니다.
  • 환경변수 설정 (Win 키 누르고 환경변수 검색해서 계정 환경변수에…)
    • ANDROID_SDK_ROOT=X:\android-sdk
    • JAVA_HOME=X:\android-studio\jre
    • PATH=%PATH%;X:\android-sdk\platform-tools;X:\android-sdk\tools
  • Cordova 설치
    npm install -g cordova

프로젝트 만들기

아래 내용을 차례로 실행해서
프로젝트 만들고 -> 플랫폼에 안드로이드를 추가하고 -> 요구사항 정상인지 확인 -> 플러그인 추가(이건 필요한 것들만)

cordova create ytm4bs kr.pe.bspfp.ytm4bs YTM4BS
cd ytm4bs
cordova platform add android
cordova requirements
cordova plugin add cordova-plugin-inappbrowser

빌드를 위한 Key Store 만들기

정상적인 APK를 만들기 위해서 키스토어를 생성합니다.

keytool -genkey -v -keystore android.keystore -alias mykey1 -keyalg RSA -keysize 2048 -validity 36500

이제 프로젝트 폴더에 build.json 파일을 만들어 키스토어를 지정합니다.

{
    "android": {
        "debug": {
            "keystore": "../android.keystore",
            "storePassword": "android",
            "alias": "mykey1",
            "password" : "password",
            "keystoreType": ""
        },
        "release": {
            "keystore": "../android.keystore",
            "storePassword": "",
            "alias": "mykey1",
            "password" : "password",
            "keystoreType": ""
        }
    }
}

앱을 구현하기

BS는 초간단 앱을 만들고 있으므로 많이 수정하지 않았습니다.

www/img/logo.png 를 원하는 아이콘 이미지로 바꾸고
config.xml에 아이콘으로 지정합니다.

<icon src="www/img/logo.png" />

www/index.html 에 jqeury 를 포함시키고

<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="jquery/jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="js/index.js"></script>

www/js/index.js에 로직을 구현합니다.

class App {
    constructor() {
        document.addEventListener('deviceready', this.onDeviceReady.bind(this), false);
    }

    onDeviceReady() {
    }
}

var app = new App();

www/css/index.css 도 편집합니다.

빌드해서 기기에 넣기

BS의 초간단앱은 이제 완성되었습니다.
안드로이드 기기를 USB로 연결하여, USB 디버깅을 켜고, 아래 명령을 실행합니다.

cordova run --debug --device android

기기에서 앱이 실행되는 것을 확인합니다.

참고: 연습 프로젝트 내용
YTM4BS는 명시적으로 종료할 때에만 종료되게 설정해서 사용하는 앱입니다.

글쓴이

BS

BS == Programmer