Phonegap AutoRefresh
https://www.facebook.com/FonsoFernandes
http://social.msdn.microsoft.com/profile/afonso%20fernandes/
...
• Phonegap autorefresh, é basicamente, o recurso que permite enviar o
app direto pro dispositivo, sem intermédios de emula...
• Instalando o Node JS
• Instalar Phonegap
• Instalar Phonegap Developer no dispositivo
• Ser feliz 
Como usar ?!
• Node JS
• Android SDK (http://developer.android.com/sdk/index.html )
NODE JS
1. Vá ao prompt e digite:
1. npm install phonegap –g
Instalar o phonegap
No android
https://play.google.com/store/apps/details?id=com.adobe.phonegap.app&hl=pt_BR
IOS
https://itunes.apple.com/br/app/phonegap-developer/id843536693?mt=8
Windows Phone
http://www.windowsphone.com/pt-br/store/app/phonegap-developer/5c6a2d1e-4fad-4bf8-aaf7-71380cc84fe3
VAMOS AO CÓDIGO ???????
• ESTANDO TUDO INSTALADO E PRONTO, AQUI AGORA COMEÇA A
BRINCADEIRA !!!
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 crea...
1. Abra a pasta no seu editor ( indiferente qual, no caso vou usar o brackets )
Editando
• .cordova
• Padrão do phonegap
• Hooks
• Padrão do phonegap
• Platforms
• Ao adicionar uma plataforma de so, aparece la a...
1. Abra a pasta www e coloque qualquer coisa no body do html
Editando
1. Após editar, salve, e digite no prompt:
1. Phonegap serve
2. utilize o ip demonstrado no pc na próxima etapa
Executando
1. Para emular o APP direto no seu device basta abrir o aplicativo (Phonegap developer
) no celular
2. Digitar o ip da sua...
1. Para emular o APP direto no seu device basta abrir o aplicativo (Phonegap developer
) no celular
2. Digitar o ip da sua...
TCHARAAAAAAM !!!
Print tirado de um smartphone Motorola Moto X
OBRIGADO !!!
https://www.facebook.com/FonsoFernandes
http://social.msdn.microsoft.com/profile/afonso%20fernandes/
afonso.f...
Próximos SlideShares
Carregando em…5
×

Phonegap autorefresh - app direto no celular sem emulador

3.750 visualizações

Publicada em

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

Publicada em: Celular

Phonegap autorefresh - app direto no celular sem emulador

  1. 1. Phonegap AutoRefresh https://www.facebook.com/FonsoFernandes http://social.msdn.microsoft.com/profile/afonso%20fernandes/ afonso.fernandes[at]msn.com
  2. 2. • 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... ?
  3. 3. • Instalando o Node JS • Instalar Phonegap • Instalar Phonegap Developer no dispositivo • Ser feliz  Como usar ?!
  4. 4. • Node JS • Android SDK (http://developer.android.com/sdk/index.html ) NODE JS
  5. 5. 1. Vá ao prompt e digite: 1. npm install phonegap –g Instalar o phonegap
  6. 6. No android https://play.google.com/store/apps/details?id=com.adobe.phonegap.app&hl=pt_BR
  7. 7. IOS https://itunes.apple.com/br/app/phonegap-developer/id843536693?mt=8
  8. 8. Windows Phone http://www.windowsphone.com/pt-br/store/app/phonegap-developer/5c6a2d1e-4fad-4bf8-aaf7-71380cc84fe3
  9. 9. VAMOS AO CÓDIGO ??????? • ESTANDO TUDO INSTALADO E PRONTO, AQUI AGORA COMEÇA A BRINCADEIRA !!!
  10. 10. 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!
  11. 11. 1. Abra a pasta no seu editor ( indiferente qual, no caso vou usar o brackets ) Editando
  12. 12. • .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...
  13. 13. 1. Abra a pasta www e coloque qualquer coisa no body do html Editando
  14. 14. 1. Após editar, salve, e digite no prompt: 1. Phonegap serve 2. utilize o ip demonstrado no pc na próxima etapa Executando
  15. 15. 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
  16. 16. 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
  17. 17. TCHARAAAAAAM !!! Print tirado de um smartphone Motorola Moto X
  18. 18. OBRIGADO !!! https://www.facebook.com/FonsoFernandes http://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/

×