Jump Start Adobe Phonegap @ DevRioClaro

Post on 17-Dec-2014

137 views 1 download

description

A short Jump Start to mobile development using Adobe Phonegap and Adobe Phonegap Build to ship apps for multiple platforms.

Transcript of Jump Start Adobe Phonegap @ DevRioClaro

Adobe PhonegapJump Start

Seja bem vindo(a)!Somos um grupo voluntário e

independente de desenvolvedores de software, com o intuito de disseminar

conhecimento e fortalecer a comunidade local

fb.com/devrioclaro

devrioclaro@gmail.com

www.mappase.com.br

www.novatec.com.br

• Livro para sorteio no dia do evento!• 25% de desconto - “DevRioClaro25” (válido até

10/06/2014)

www.altabooks.com.br

• Livro para sorteio no dia do evento!

www.casadocodigo.com.br

• 2 e-Books para sorteio no dia do evento!• 15% desconto - “DevRioClaro” (valido até 31/05/2014)

www.lcm.com.br

• 2 e-Books para sorteio no dia do evento!• Desconto de 40% livro impresso e 10% eBook - “V00031” (válido

até ...)

Murilo Beltrame

• Marketing - FACINTER

• Especialista Microsoft (MCTS Web Development/Data Access)

• Entusiasta JavaScript

• Motociclista

• Futuro marido

Agenda

• Mobile development

• Phonegap

• Environment

• Workflow

• Demos

MobileDevelopment = []

MobileDevelopment[Panorama]

2012 2013 20140

500000

1000000

1500000

2000000

2500000

Vendas globais (em milhares)

PC Ultramobile Tablet Smartphone

Gartner, Worldwide Device Shipments, October, 2013

MobileDevelopment[Panorama]

Vendas 2º Sem. 2013

Participação de Mercado 2º Sem. 2013

Android 187.4 mi 79.3%

iOS 31.2 mi 13.2%

Windows Phone 8.7 mi 3.7%

Outros (BB, Symbian, ... )

3.8%IDC, Worldwide Mobile Phone Tracker, August 7, 2013

MobileDevelopment[Ambiente]

Android (JAVA)• Eclipse• Android SDK• Java SDK

WP (C#)• Windows 8 Pro• WP SDK• Visual Studio

2013

iOS (Objective C)• OS X• XCode

MobileDevelopment[Desenvolvedor]

C#Objective C

Java

MobileDevelopment[Desenvolvedor(es)]

C# Objective C Java

MobileDevelopment[Desenvolvedor]

+ =$$$

MobileDevelopment[Desenvolvedor]

+ =$$$

Phonegap = []

Phonegap[Eles_dizem]

PhoneGap é um framework gratuito e de código aberto que lhe permite a criação de aplicativos móveis utilizando APIs Web padronizadas para múltiplas plataformas.

Phonegap[O_Murilo_diz]

Um jeito de criar um único código HTML, CSS and JS e entregar para múltiplas plataformas

Magic?

Phonegap[Por_dentro]

• Plugins!

• Plugins são um monte de código especializado para cada plataforma com interface para o JavaScript

• As estruturas dos plugins são padronizadas

• Os códigos dos plugins são especializados por plataforma

• Um monte de plugins (https://build.phonegap.com/plugins)

• Você pode fazer o seu!

Phonegap[Nada _muito_mágico]

Sua aplicação web é embutida em projetos de código especializado por plataforma. Desse modo, você precisa ter os ambientes de desenvolvimento de cada plataforma para compilar seu código.

MobileDevelopment[Idéia]

Web

Phonegap[Dor_de_cabeça]

Phonegap[Sem_dor_de_cabeça]

Adobe Phonegap Build – é um serviço que compila seu código na núvem da Adobe

http://build.phonegap.com

Phonegap Build significa: não é necessário manter ambiente para cada plataforma.

Amazed Padawan

Environment = []

Environment[Início]

http://nodejs.org/download/

Environment[Você_vai_querer_usar]

http://git-scm.com/downloads

Environment[CLI]

npm install –g cordova

Workflow = []

Workflow[Inicio]

cordova create [nome_do_diretorio] [id_unico_do_app] [nome_do_app]

cordova create hello br.com.murilobeltrame.hellocordova HelloCordova

Tenha certeza que seu config.xml está dentro da pasta www

Experienced Padawan

Workflow[Git]

Vá para a pasta do aplicativo:

git init

git add .

git commit –am “adding to source control”

git remote add origin [repo_url]

git push –u origin master

Workflow[Plugins]

No config.xml

xmlns:gap=http://phonegap.com/ns/1.0

<gap:plugin name=“” version=“” />

Temos documentação!

https://build.phonegap.com/plugins

Use o DTD fornecido pelo Phonegap ao invés de o fornecido pela Apache. Você

será mais feliz com ele.

Experienced Padawan

Workflow[Manutenção]

git commit –am “descrição da mudança feita”

git push

DemoMy first app

DemoCordovaPlayground

Fork me on github : http://goo.gl/CJvw4f

Thanksmurilobeltrame.com.br

@murilobeltrame

fb.com/murilobeltrame

br.linkedin.com/in/murilobeltrame