Phonegap autorefresh - app direto no celular sem emulador

18
Phonegap AutoRefresh https://www.facebook.com/FonsoFernandes http://social.msdn.microsoft.com/profile/afonso%20fernandes/ afonso.fernandes[at]msn.com

description

Slides simples e diretos de como utilizar o phonegap autorefresh ( phonegap serve ) direto no seu device, sem precisar de instalar emulador nem nada, a grande vantagem é que quem é usuário windows pode testar apps para ios e vice versa. Fora que aumenta muito a produtividade do desenvolvedor por não precisar toda hora subir o emulador

Transcript of Phonegap autorefresh - app direto no celular sem emulador

Page 1: Phonegap autorefresh - app direto no celular sem emulador

Phonegap AutoRefresh

https://www.facebook.com/FonsoFernandeshttp://social.msdn.microsoft.com/profile/afonso%20fernandes/afonso.fernandes[at]msn.com

Page 2: Phonegap autorefresh - app direto no celular sem emulador

• Phonegap autorefresh, é basicamente, o recurso que permite enviar o app direto pro dispositivo, sem intermédios de emulador aumentando produtividade de desenvolvimento ao máximo.

• simplesmente sexy !!!

Afinal, para que serve... ?

Page 3: Phonegap autorefresh - app direto no celular sem emulador

• Instalando o Node JS

• Instalar Phonegap

• Instalar Phonegap Developer no dispositivo

• Ser feliz

Como usar ?!

Page 4: Phonegap autorefresh - app direto no celular sem emulador

• Node JS

• Android SDK (http://developer.android.com/sdk/index.html )

NODE JS

Page 5: Phonegap autorefresh - app direto no celular sem emulador

1. Vá ao prompt e digite:1. npm install phonegap –g

Instalar o phonegap

Page 6: Phonegap autorefresh - app direto no celular sem emulador

No android

https://play.google.com/store/apps/details?id=com.adobe.phonegap.app&hl=pt_BR

Page 7: Phonegap autorefresh - app direto no celular sem emulador

IOS

https://itunes.apple.com/br/app/phonegap-developer/id843536693?mt=8

Page 8: Phonegap autorefresh - app direto no celular sem emulador

Windows Phone

http://www.windowsphone.com/pt-br/store/app/phonegap-developer/5c6a2d1e-4fad-4bf8-aaf7-71380cc84fe3

Page 9: Phonegap autorefresh - app direto no celular sem emulador

VAMOS AO CÓDIGO ???????

• ESTANDO TUDO INSTALADO E PRONTO, AQUI AGORA COMEÇA A BRINCADEIRA !!!

Page 10: Phonegap autorefresh - app direto no celular sem emulador

1. vamos organizar o nosso app no path:

2. C:\apps\

3. Para isso vamos no prompt e executemos:1. cd c:\apps

2. phonegap create meuaplicativo

3. cd meuaplicativo

• Ao executar o phonegap create <<nome>>, ele cria a estrutura

• Padrão e um template do phonegap

Prompt!

Page 11: Phonegap autorefresh - app direto no celular sem emulador

1. Abra a pasta no seu editor ( indiferente qual, no caso vou usar o brackets )

Editando

Page 12: Phonegap autorefresh - app direto no celular sem emulador

• .cordova

• Padrão do phonegap

• Hooks

• Padrão do phonegap

• Platforms

• Ao adicionar uma plataforma de so, aparece la a pasta com as configurações ( wp8, android, ios... ) por exemplo

• Comando para adicionar uma plataforma:

• Cordova platform add <<nome>> ex: (cordova platform add android )

• Plugins

• Sempre que adicionar plug-ins, ficam instalados ali para serem compilados no build

• www

• Os fontes html, css e js que iremos trabalhar !

Entendendo diretórios...

Page 13: Phonegap autorefresh - app direto no celular sem emulador

1. Abra a pasta www e coloque qualquer coisa no body do html

Editando

Page 14: Phonegap autorefresh - app direto no celular sem emulador

1. Após editar, salve, e digite no prompt:1. Phonegap serve

2. utilize o ip demonstrado no pc na próxima etapa

Executando

Page 15: Phonegap autorefresh - app direto no celular sem emulador

1. Para emular o APP direto no seu device basta abrir o aplicativo (Phonegap developer) no celular

2. Digitar o ip da sua máquina 1. Caso der erro de conexão com o phonegap serve executado verifique:

1. Firewall

2. Antivirus

2. Algum desses pode estar bloqueando o acesso

Executando

Page 16: Phonegap autorefresh - app direto no celular sem emulador

1. Para emular o APP direto no seu device basta abrir o aplicativo (Phonegap developer) no celular

2. Digitar o ip da sua máquina 1. Caso der erro de conexão com o phonegap serve executado verifique:

1. Firewall

2. Antivirus

2. Algum desses pode estar bloqueando o acesso

Executando

Page 17: Phonegap autorefresh - app direto no celular sem emulador

TCHARAAAAAAM !!!

Print tirado de um smartphone Motorola Moto X

Page 18: Phonegap autorefresh - app direto no celular sem emulador

OBRIGADO !!!

https://www.facebook.com/FonsoFernandeshttp://social.msdn.microsoft.com/profile/afonso%20fernandes/afonso.fernandes[at]msn.com

Duvidas, críticas, sugestões ???

Links uteis:http://phonegap.com/blog/2014/04/23/phonegap-developer-app

https://www.youtube.com/watch?v=-bGR5b45N-s (pt-br)

http://devgirl.org/2014/04/22/introducing-the-phonegap-developer-app/