모바일 앱 개발의 방법 중 하이브리드 앱 개발 방식을 소개한다.


개발 도구는 Node.js, 안드로이드 스튜디오, Cordova로 구성된다.

Node.js 가 설치된 상태에서 Cordova를 설치하는 것부터 시작한다.



1. 설치된 node.js의 command prompt를 실행한다.

2. Cordova 를 설치한다.

명령)

npm install cordova -g

결과)


3. Cordova 프로젝트를 생성한다.

명령)

C:\cordova>cordova create example com.ex.example1 example1 -d
Using detached cordova-create
Creating a new cordova project.
Copying assets."

결과)

파일 구조


4. 생성한 프로젝트 경로에서 개발할 플랫폼(안드로이드, iOS)을 추가한다.

C:\cordova>cd example C:\cordova\example>cordova platform add android Using cordova-fetch for cordova-android@~7.1.1 Adding android project... Creating Cordova project for the Android platform: Path: platforms\android Package: com.ex.example1 Name: example1 Activity: MainActivity Android target: android-27 Android project created with cordova-android@7.1.1 Android Studio project detected Android Studio project detected Discovered plugin "cordova-plugin-whitelist" in config.xml. Adding it to the pro ject Installing "cordova-plugin-whitelist" for android This plugin is only applicable for versions of cordova-android gr eater than 4.0. If you have a previous platform version, you do *not* need this plugin since the whitelist will be built in. Adding cordova-plugin-whitelist to package.json Saved plugin info for "cordova-plugin-whitelist" to config.xml --save flag or autosave detected Saving android@~7.1.1 into config.xml file ... C:\cordova\example>


생성한 example 경로로 이동한 후 android 플랫폼을 추가한다.


결과:


.

5. 웹 개발을 한다.
C:\cordova\example\www에 작업한 웹 결과물을 복사해 넣는다.

6. 웹 개발 결과를 빌드하여 플랫폼에 반영한다.
cordova build


결과

C:\cordova\example>cordova build
Android Studio project detected
ANDROID_HOME=C:\Users\KCPARK\AppData\Local\Android\Sdk
JAVA_HOME=C:\Java\jdk1.8.0_181
studio
Starting a Gradle Daemon (subsequent builds will be faster)

BUILD SUCCESSFUL in 3s
1 actionable task: 1 executed
Subproject Path: CordovaLib
Subproject Path: app
Starting a Gradle Daemon (subsequent builds will be faster)
publishNonDefault is deprecated and has no effect anymore. All variants are now
published.
The Task.leftShift(Closure) method has been deprecated and is scheduled to be re
moved in Gradle 5.0. Please use Task.doLast(Action) instead.
        at build_bnegh9d9b1wid3zp99n4naud8.run(C:\cordova\example\platforms\andr
oid\app\build.gradle:143)
:CordovaLib:preBuild UP-TO-DATE
:CordovaLib:preDebugBuild UP-TO-DATE
:CordovaLib:compileDebugAidl
:CordovaLib:compileDebugRenderscript
:CordovaLib:checkDebugManifest
:CordovaLib:generateDebugBuildConfig
:CordovaLib:prepareLintJar
:CordovaLib:generateDebugResValues
:CordovaLib:generateDebugResources
:CordovaLib:packageDebugResources
:CordovaLib:platformAttrExtractor
:CordovaLib:processDebugManifest
:CordovaLib:javaPreCompileDebug
:CordovaLib:processDebugJavaRes NO-SOURCE
:app:preBuild UP-TO-DATE
:app:preDebugBuild
:app:compileDebugAidl
:CordovaLib:packageDebugRenderscript NO-SOURCE
:app:compileDebugRenderscript
:app:checkDebugManifest
:app:generateDebugBuildConfig
:app:prepareLintJar
:app:generateDebugResValues
:app:generateDebugResources
:app:mergeDebugResources
:app:createDebugCompatibleScreenManifests
:app:processDebugManifest
:app:splitsDiscoveryTaskDebug
:app:compileDebugNdk NO-SOURCE
:CordovaLib:mergeDebugShaders
:CordovaLib:compileDebugShaders
:CordovaLib:generateDebugAssets
:CordovaLib:mergeDebugAssets
:app:mergeDebugShaders
:app:compileDebugShaders
:app:generateDebugAssets
:app:mergeDebugAssets
:CordovaLib:compileDebugNdk NO-SOURCE
:CordovaLib:mergeDebugJniLibFolders
:CordovaLib:transformNativeLibsWithMergeJniLibsForDebug
:CordovaLib:transformNativeLibsWithIntermediateJniLibsForDebug
:app:mergeDebugJniLibFolders
:app:processDebugJavaRes NO-SOURCE
:app:validateSigningDebug
:CordovaLib:processDebugResources
:CordovaLib:generateDebugSources
:CordovaLib:compileDebugJavaWithJavacNote: Some input files use or override a de
precated API.
Note: Recompile with -Xlint:deprecation for details.

:CordovaLib:transformClassesAndResourcesWithPrepareIntermediateJarsForDebug
:app:processDebugResources
:app:generateDebugSources
:app:javaPreCompileDebug
:app:compileDebugJavaWithJavac
:app:compileDebugSources
:app:transformClassesWithStackFramesFixerForDebug
:app:transformClassesWithDesugarForDebug
:app:transformClassesWithDexBuilderForDebug
:app:transformDexArchiveWithExternalLibsDexMergerForDebug
:app:transformDexArchiveWithDexMergerForDebug
:app:transformNativeLibsWithMergeJniLibsForDebug
:app:transformResourcesWithMergeJavaResForDebug
:app:packageDebug
:app:assembleDebug
:app:cdvBuildDebug

BUILD SUCCESSFUL in 15s
46 actionable tasks: 46 executed
Built the following apk(s):
        C:\cordova\example\platforms\android\app\build\outputs\apk\debug\app-deb
ug.apk

C:\cordova\example>

7. App를 실행한다.
cordova run android

결과:

>cordova run android Android Studio project detected ANDROID_HOME=C:\Users\KCPARK\AppData\Local\Android\Sdk JAVA_HOME=C:\Java\jdk1.8.0_181 studio Subproject Path: CordovaLib Subproject Path: app publishNonDefault is deprecated and has no effect anymore. All variants are now published. The Task.leftShift(Closure) method has been deprecated and is scheduled to be re moved in Gradle 5.0. Please use Task.doLast(Action) instead. at build_bnegh9d9b1wid3zp99n4naud8.run(C:\cordova\example\platforms\andr oid\app\build.gradle:143) :CordovaLib:preBuild UP-TO-DATE :CordovaLib:preDebugBuild UP-TO-DATE :CordovaLib:compileDebugAidl UP-TO-DATE :CordovaLib:compileDebugRenderscript UP-TO-DATE :CordovaLib:checkDebugManifest UP-TO-DATE :CordovaLib:generateDebugBuildConfig UP-TO-DATE :CordovaLib:prepareLintJar UP-TO-DATE :CordovaLib:generateDebugResValues UP-TO-DATE :CordovaLib:generateDebugResources UP-TO-DATE :CordovaLib:packageDebugResources UP-TO-DATE :CordovaLib:platformAttrExtractor UP-TO-DATE :CordovaLib:processDebugManifest UP-TO-DATE :CordovaLib:processDebugResources UP-TO-DATE :CordovaLib:generateDebugSources UP-TO-DATE :CordovaLib:javaPreCompileDebug UP-TO-DATE :CordovaLib:compileDebugJavaWithJavac UP-TO-DATE :CordovaLib:processDebugJavaRes NO-SOURCE :CordovaLib:transformClassesAndResourcesWithPrepareIntermediateJarsForDebug UP-T O-DATE :app:preBuild UP-TO-DATE :app:preDebugBuild UP-TO-DATE :app:compileDebugAidl UP-TO-DATE :CordovaLib:packageDebugRenderscript NO-SOURCE :app:compileDebugRenderscript UP-TO-DATE :app:checkDebugManifest UP-TO-DATE :app:generateDebugBuildConfig UP-TO-DATE :app:prepareLintJar UP-TO-DATE :app:generateDebugResValues UP-TO-DATE :app:generateDebugResources UP-TO-DATE :app:mergeDebugResources UP-TO-DATE :app:createDebugCompatibleScreenManifests UP-TO-DATE :app:processDebugManifest UP-TO-DATE :app:splitsDiscoveryTaskDebug UP-TO-DATE :app:processDebugResources UP-TO-DATE :app:generateDebugSources UP-TO-DATE :app:javaPreCompileDebug UP-TO-DATE :app:compileDebugJavaWithJavac UP-TO-DATE :app:compileDebugNdk NO-SOURCE :app:compileDebugSources UP-TO-DATE :CordovaLib:mergeDebugShaders UP-TO-DATE :CordovaLib:compileDebugShaders UP-TO-DATE :CordovaLib:generateDebugAssets UP-TO-DATE :CordovaLib:mergeDebugAssets UP-TO-DATE :app:mergeDebugShaders UP-TO-DATE :app:compileDebugShaders UP-TO-DATE :app:generateDebugAssets UP-TO-DATE :app:mergeDebugAssets UP-TO-DATE :app:transformClassesWithStackFramesFixerForDebug UP-TO-DATE :app:transformClassesWithDesugarForDebug UP-TO-DATE :app:transformClassesWithDexBuilderForDebug UP-TO-DATE :app:transformDexArchiveWithExternalLibsDexMergerForDebug UP-TO-DATE :app:transformDexArchiveWithDexMergerForDebug UP-TO-DATE :CordovaLib:compileDebugNdk NO-SOURCE :CordovaLib:mergeDebugJniLibFolders UP-TO-DATE :CordovaLib:transformNativeLibsWithMergeJniLibsForDebug UP-TO-DATE :CordovaLib:transformNativeLibsWithIntermediateJniLibsForDebug UP-TO-DATE :app:mergeDebugJniLibFolders UP-TO-DATE :app:transformNativeLibsWithMergeJniLibsForDebug UP-TO-DATE :app:processDebugJavaRes NO-SOURCE :app:transformResourcesWithMergeJavaResForDebug UP-TO-DATE :app:validateSigningDebug :app:packageDebug UP-TO-DATE :app:assembleDebug UP-TO-DATE :app:cdvBuildDebug UP-TO-DATE BUILD SUCCESSFUL in 1s 46 actionable tasks: 1 executed, 45 up-to-date Built the following apk(s): C:\cordova\example\platforms\android\app\build\outputs\apk\debug\app-deb ug.apk ANDROID_HOME=C:\Users\KCPARK\AppData\Local\Android\Sdk JAVA_HOME=C:\Java\jdk1.8.0_181 No target specified, deploying to device '5200e8a5f4f0a485'. none Skipping build... Built the following apk(s): C:\cordova\example\platforms\android\app\build\outputs\apk\debug\app-deb ug.apk Using apk: C:\cordova\example\platforms\android\app\build\outputs\apk\debug\app- debug.apk Package name: com.ex.example1 LAUNCH SUCCESS



+ Recent posts

티스토리 툴바