tools for phonegap developers

20
Tools for PhoneGap Developers Eclipse + Android SDK, VS + Windows Phone SDK Svetlin Nakov Telerik Software Academy academy.telerik.com Technical Trainer www.nakov.com

Upload: yoko

Post on 24-Feb-2016

42 views

Category:

Documents


0 download

DESCRIPTION

Tools for PhoneGap Developers. Eclipse + Android SDK, VS + Windows Phone SDK. Svetlin Nakov. Telerik Software Academy. academy.telerik.com. Technical Trainer. www.nakov.com. Table of Contents. PhoneGap in Eclipse + Android SDK + Android Emulator + Android Development Tools (ADT) - PowerPoint PPT Presentation

TRANSCRIPT

Page 1: Tools for  PhoneGap  Developers

Tools for PhoneGap Developers

Eclipse + Android SDK, VS + Windows Phone SDK

Svetlin Nakov

Telerik Software Academyacademy.telerik.com

Technical Trainerwww.nakov.com

Page 2: Tools for  PhoneGap  Developers

2

Table of Contents1. PhoneGap in Eclipse + Android

SDK + Android Emulator + Android Development Tools (ADT) The AppLaud Eclipse Plugin

2. PhoneGap in Visual Studio + Windows Phone SDK + Windows Phone Emulator

3. PhoneGap in iOS + Xcode + iPhone Simulator

4. PhoneGap Build

Page 3: Tools for  PhoneGap  Developers

PhoneGap in Android SDKEclipse + Android SDK + Android

Emulator + Android Development Tools (ADT) + Cordova

Page 4: Tools for  PhoneGap  Developers

1. Install Java (JRE 7) – http://java.com

2. Install Eclipse + Android Developer Tools (ADT) + Android SDK http://developer.android.com/sdk/

3. Android SDK Manager Download and install system

images4. Android Virtual Device Manager

Create new Android Virtual Device (AVD)

5. Install "Eclipse Web Developer Tools" plug-in

Installing Android SDK + ADT

4

Page 5: Tools for  PhoneGap  Developers

1. Download PhoneGap http://phonegap.com/install/

2. Add the Cordova libraries to the project libs/cordova-2.9.0.jar

3. Create res/xml/config.xml4. Configure the AndroidManifest.xml5. Create the applications files in assets/www/ index.html, styles.css, cordova.js

Creating a PhoneGapApplication in Eclipse

5

Page 6: Tools for  PhoneGap  Developers

PhoneGap in Android SDKLive Demo

Page 7: Tools for  PhoneGap  Developers

The AppLaud Eclipse Plug-inPhoneGap for Android Made Easy

Page 8: Tools for  PhoneGap  Developers

AppLaud Eclipse Plug-in The AppLaud Eclipse Plug-in simplifies the PhoneGap development in Eclipse Install though Eclipse Help

Install New Software https://svn.codespot.com/a/eclipselabs.org/mobile-web-development-with-phonegap/tags/r1.2/download

Once installed, the AppLaud plugin adds New PhoneGap for Android Project

8

Page 9: Tools for  PhoneGap  Developers

The AppLaud Eclipse Plug-inLive Demo

Page 10: Tools for  PhoneGap  Developers

PhoneGap in Visual StudioVisual Studio + Windows Phone SDK +

Windows Phone Emulator + Cordova

Page 11: Tools for  PhoneGap  Developers

1. Install Windows Phone SDK http://

dev.windowsphone.com/downloadsdk Windows Phone SDK 8.0 is comes

built-in Visual Studio 20132. Install the PhoneGap template for

Visual Studio for WP8 Download

https://github.com/phonegap/phonegap/archive/2.8.1.zip

Copy lib\windows-phone-8\CordovaWP8_2_8_0.zip to C:\Users\<user>\Documents\Visual Studio 2013\Templates\ProjectTemplates

Installing Windows Phone SDK

11

Page 12: Tools for  PhoneGap  Developers

PhoneGap in Visual StudioLive Demo

Page 13: Tools for  PhoneGap  Developers

PhoneGap in iOSiOS + Xcode + iPhone Simulator +

Cordova

Page 14: Tools for  PhoneGap  Developers

1. Install Xcode2. Install Cordova3. Create new Cordova app

Use the script lib/ios/bin/crate4. Open the generated Xcode project

E.g. HelloCordova.xcodeproj5. Run the Xcode project in the iOS

Simulator* Full guidelines available at: http://docs.phonegap.com/en/3.0.0/guide_platforms_ios_index.md.html

Run PhoneGap in iOS

14

Page 15: Tools for  PhoneGap  Developers

PhoneGap BuildCloud-based Build Service for Multiple

Platforms

Page 16: Tools for  PhoneGap  Developers

PhoneGap Build is a cloud service that builds your Cordova apps for different platforms iOS, Android, Windows Phone,

Win8, Blackberry, Symbian, etc.1. Register at https://

build.phonegap.com2. Upload your www folder in a ZIP

archive3. Press the [Rebuild all] button4. Scan the QR code to install the

app on your Android phone / download the binary file

PhoneGap Build

16

Page 17: Tools for  PhoneGap  Developers

PhoneGap BuildLive Demo

Page 18: Tools for  PhoneGap  Developers

форум програмиране, форум уеб дизайнкурсове и уроци по програмиране, уеб дизайн – безплатно

програмиране за деца – безплатни курсове и уроцибезплатен SEO курс - оптимизация за търсачки

уроци по уеб дизайн, HTML, CSS, JavaScript, Photoshop

уроци по програмиране и уеб дизайн за ученициASP.NET MVC курс – HTML, SQL, C#, .NET, ASP.NET MVC

безплатен курс "Разработка на софтуер в cloud среда"

BG Coder - онлайн състезателна система - online judge

курсове и уроци по програмиране, книги – безплатно от Наков

безплатен курс "Качествен програмен код"

алго академия – състезателно програмиране, състезанияASP.NET курс - уеб програмиране, бази данни, C#, .NET, ASP.NET

курсове и уроци по програмиране – Телерик академия

курс мобилни приложения с iPhone, Android, WP7, PhoneGapfree C# book, безплатна книга C#, книга Java, книга C# Дончо Минков - сайт за програмиране

Николай Костов - блог за програмиранеC# курс, програмиране, безплатно

?? ? ?

??? ?

?

? ?

??

?

?

? ?

Questions?

?

Tools for PhoneGap Developers

http://academy.telerik.com

Page 19: Tools for  PhoneGap  Developers

Exercises1. Configure and install the PhoneGap for

Android development environment Install and configure Eclipse + Android

SDK Configure the Android Virtual Device

Manager Install "Eclipse Web Developer Tools" and

"AppLaud" Create a sample PhoneGap application

and run it in the Android Emulator2. Configure and install PhoneGap for WP

development environment: Visual Studio + Windows Phone SDK + PhoneGap templates. Create and run a sample app.

3. Build a sample app using PhoneGap Build. Test it on your phone.

19

Page 20: Tools for  PhoneGap  Developers

Free Trainings @ Telerik Academy

C# Programming @ Telerik Academy csharpfundamentals.telerik.com

Telerik Software Academy academy.telerik.com

Telerik Academy @ Facebook facebook.com/TelerikAcademy

Telerik Software Academy Forums forums.academy.telerik.com