Mobile app with cordova
Download as PPTX, PDF0 likes175 views
The document provides a step-by-step guide to creating mobile applications using Cordova (PhoneGap) with HTML, CSS, and JavaScript. It details the installation of necessary tools, adding iOS and Android platforms, and deploying the app to emulators. It includes links to platform-specific guides and commands to run throughout the process.
Mobile app with cordova
- 1. Mobile App with Cordova (PhoneGap) by Candy Zhuang 2014-01-09
- 2. Content ● Introduction ● Set environment o Install NodeJS (v0.10.24) o Install Cordova by npm o Create App with Cordova ● Add Platforms o Add IOS o Add Android ● Deploy to Emulator o Emulator iOS o Emulator Android
- 3. Introduction PhoneGap Easily create mobile apps (Android, iOS, Windows) using the web technologies you know: HTML, CSS, and JavaScript http://phonegap.com
- 4. Set Environment ● Install NodeJS > nvm install 0.10.24 > nvm use 0.10.24 > nvm alias default 0.10.24 ● Install Cordova by npm > sudo npm install -g cordova ● Create the App (project directory) > cordova create hello com.example.hello HelloWorld ● Run within the project’s directory > cd hello
- 5. Add Platforms - iOS ● Add iOS Platform > cordova platform add ios ● Build the App > cordova prepare (or cordova build) ● Open it from within Xcode Double-click to open the file “hello/platforms/ios/hello.xcodeproj”
- 6. Add Platforms - Android ● Requirements and Support o Android SDK & ADT Bundle (for Mac) : adt-bundle-mac-x86_64-20131030 o JDK7 : jdk-7u45-macosx-x64.dmg o Ant : apache-ant-1.8.4 (must be v1.8.4) ● Include SDK’s tools and platform-tools directories in your PATH env. (Mac) o Modify ~/.bash_profile > vim ~/.bash_profile export JAVA_HOME=$(/usr/libexec/java_home) export ANT_HOME=~/Documents/and-source/apache-ant-1.8.4 export PATH=${PATH}:/Users/candychuang/Documents/and-source/adt-bundle-mac-x86_64-20131030/sdk/platform-tools:/ Users/candychuang/Documents/and-source/adt-bundle-mac-x86_64-20131030/sdk/tools:$ANT_HOME/bin o This exposes SDK tools in newly opened terminal windows > source ~/.bash_profile
- 7. Add Platforms - Android ● Add Android Platform > cordova platform add android ● Build the App > cordova build ● Launch the Eclipse application o Select the New Project o Choose Android Project from Existing Cdoe o Navigate to hello -> Finish
- 8. Deploy to Emulator - iOS ● Emulator iOS o Make sure the .xcodeproj file is selected in the left panel. o Select the hello app in the panel immediately to the right. o Select the intended device from the toolbar's Scheme menu, such as the iPhone 6.0 Simulator as highlighted here: ● iOS Platform Guide o http://docs.phonegap.com/en/3.3.0/guide_platforms_ios_index.md.html#iOS%20Plat form%20Guide RUN
- 9. Deploy to Emulator - Android ● Emulator Android > cordova emulate android ● Deploy to Device > cordova run android ● Android Platform Guide o http://docs.phonegap.com/en/3.3.0/guide_platforms_android_index.md.html#Androi d%20Platform%20Guide