Maximiliano Firtman - Разработка приложений с помощью PhoneGap

66
max firtman @firt firt.mobi

description

 

Transcript of Maximiliano Firtman - Разработка приложений с помощью PhoneGap

Page 1: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

max firtman @firt firt.mobi

Page 2: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

mobile+web developer mobilexweb.com blog @firt

who am I?

Page 3: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

buenos aires ~ argentina

where?

patagonia football meat & wine tango

Page 4: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

speaker

Page 5: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

Image from my house

books

Page 6: Maximiliano Firtman - Разработка приложений с помощью PhoneGap
Page 7: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

coming soon... also by @estellevw

Page 8: Maximiliano Firtman - Разработка приложений с помощью PhoneGap
Page 9: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

.com

Page 10: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

why mobile?

Page 11: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

mobile

‣  absolutely personal ‣  +5 billions ‣  make us focus ‣  read our context... ‣  ... always... ‣  ... and everywhere.

Page 12: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

then... what is the problem?

Page 13: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

mobile is a minefield

Photo by World of Good (Flickr) Malvinas / Falklands Islands

Page 14: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

lots of questions

Photo by wayneandwax (Flickr)

Page 15: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

lots of questions

we need to learn

Page 16: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

lots of platforms

Page 17: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

mobile web appears

Page 18: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

native vs

web

Page 19: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

WAIT!

Page 20: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

Are you sure?

Page 21: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

native code vs

javascript

Page 22: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

browser vs

installed apps & stores

Page 23: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

lack of definitions

Page 24: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

when we say mobile web

from a developer’s perspective it’s using HTML, CSS and JavaScript to develop mobile apps

(browser or installed)

Page 25: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

Callback

Page 26: Maximiliano Firtman - Разработка приложений с помощью PhoneGap
Page 27: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

§  A platform to create native apps using web technologies

§  A JavaScript library

§  A native library for every platform

§  Compilation helpers

What is

Page 28: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

§  Open Source

§  Multi-platform

§  Latests -even future- standards

§  First class apps

Features

Page 29: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

WARNING!

Page 30: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

§  PhoneGap is not a UI framework

§  PhoneGap doesn’t include a browser and or a rendering engine

§  PhoneGap doesn’t compile

§  Every platform need its own compilation

§  HTML5/CSS3 compatibility varies - www.mobilehtml5.org

Warning!

Page 31: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

Compatibility

Page 32: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

§  iOS (iPhone y iPad)

§  Android

§  BlackBerry 4.x, - 7

§  webOS

§  Symbian

§  Samsung Bada

§  Windows Phone 7.5

Compatibility (official 1.2)

Page 33: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

§  BlackBerry PlayBook

§  Meego 1.2 Harmattan (Nokia N9)

Compatibility (non-official yet)

Page 34: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

§  Apple AppStore

§  Android Market, Amazon AppStore

§  AppWorld

§  AppCatalog

§  Nokia Store

§  Samsung Apps

§  Windows Marketplace

Stores

Page 35: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

§  Accelerometer

§  Camera (video/photo)

§  Compass

§  Contacts

§  File Management

Abilities

Page 36: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

§  Geolocation

§  Multimedia

§  Network Information

§  Notification

§  Storage

Abilities

Page 37: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

Abilities

Page 38: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

Architecture

Page 39: Maximiliano Firtman - Разработка приложений с помощью PhoneGap
Page 40: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

Requirements

Page 41: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

§  Download PhoneGap www.phonegap.com

§  Use your HTML5 IDE

To develop

Page 42: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

§  Install SDKs

§  Dreamweaver CS5.5 or IDEs

§  Or you can use PhoneGap Build

To compile

Page 43: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

§  Xcode for iOS - available in Mac App Store

§  Android SDK - developer.android.com

§  BlackBerry WebWorks - blackberry.com/developers/browserdev/widgetsdk.jsp

§  Nokia Web Tools for Symbian - developer.nokia.com

§  Windows Phone SDK - microsoft.com/download

Compile ourselves

Page 44: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

Get an account at build.phonegap.com

To compile on the cloud

Page 45: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

§  Simulatos and Emulators (www.mobilexweb.com/emulators)

§  Real devices

§  Ripple Simulator

§  Can we use a desktop browser?

To test

Page 46: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

Challenges & questions

Page 47: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

we are using the browser engine... so

why package it?

Page 48: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

is it safe to use an embedded web

view?

Page 49: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

from http://blog.brightcove.com

Page 50: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

§  HTML5 and CSS3 support

§  Debugging & Profiling

§  Performance & Memory usage

§  BlackBerry 5

Challenges

Page 51: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

§  Screen sizes & orientations

§  DPIs

§  User Interface - should we emulate native UI?

§  Performance & JavaScript Best Practices

Challenges

Page 52: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

Debug

Page 53: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

§  Weinre (debug.phonegap.com)

§  iWebInspector for iOS (iwebinspector.com)

§  Pray?

Debug

Page 54: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

Plugins

Page 55: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

§  Native code to add more support

§  Every platform should have its native code

§  We need a plugin community

Plugins

Page 56: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

Advices

Page 57: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

§  Try to maintain one source code

§  Define CSS and JavaScript per platform for porting

§  Embrace differences

§  Best experience for every platform

Advices

Page 58: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

some last advices

Page 59: Maximiliano Firtman - Разработка приложений с помощью PhoneGap
Page 60: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

performance, performance

Page 61: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

good practices

Page 62: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

don’t be fanatic

photo by Kurt Christensen (flickr)

Page 63: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

be multiplatform

Page 64: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

be

futurefriend.ly

Page 65: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

best experience for every context

best experience for every context

Page 66: Maximiliano Firtman - Разработка приложений с помощью PhoneGap

you can reach a good experience

firt.mobi twitter: @firt

mobilexweb.com

спасибо!