Worklight exemplo
-
Upload
percival-lucena -
Category
Documents
-
view
251 -
download
0
Transcript of Worklight exemplo
![Page 1: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/1.jpg)
![Page 2: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/2.jpg)
Mobile - O próximo passo na evolução da computação
Host/Mainframe
Cliente/Servidor
Web/Desktop
Mobile/Wireless/Cloud
Mobile é diferente:
• Transformação no modelo de negócios
• Ciclos mais rápidos, mais interativos
• Novos ambientes para suportar
![Page 3: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/3.jpg)
Não é só o FrontEnd que está mudando...
![Page 4: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/4.jpg)
Native Apps
Requer conhecimentos específicos, maior custo e tempo para desenvolver. Pode entregar uma melhor experiência final ao usuario
Native Application
Device APIs
1001010101011101001010010010101110100100110101010101001001001011110010011001010101001010101010010101010101010101010111111000001010101010101001001010101010101000111101010001111010100111010101111100101101111010001011001110
Hybrid Apps -
Código WEB com a utilização de código nativo para uso específico, garantindo melhor experiência do usuário.
Native Shell
Web Native
Device APIs
<!DOCTYPE html PUBLICcreated 2003-12</p></body></html>
10010101010111010010101010101010010010010111100100110010
Hybrid Apps - Web
Código HTML5 e bibliotecas do Worklight empacotada na aplicação em native shell.
Native Shell
Web Code<!DOCTYPE html PUBLIC<html><! - - created 2003-12-1<head><title>XYZ</title</head></body></html>
Device APIs
Web Apps
Escreva em HTML5 JavaScript e CSS3. Rápido e barato para desenvolver, porem menos poderoso que o nativo
Mobile Browser
Web Code
<!DOCTYPE html PUBLIC<html><! - - created 2003-12-12 - - <head><title>XYZ</title></head><body></p></body></html>
Browser Access Downloadable Downloadable Downloadable
Browser Access Hybrid Apps - Web Hybrid Apps - Mixed
Native Apps
Desenvolvimento Móvel
![Page 5: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/5.jpg)
Arquitetura Worklight
![Page 6: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/6.jpg)
Worklight Studio
Eclipse Juno/Kepler• Nativo, Hibrido, WebOtimizações para cada ambiente• Código comum vs Personalizado• Opções para desenvolvimento nativo• Skins para cada tipo de dispostivoIntegração com bibliotecas
Integração com SDKs• Emuladores e ambiente de teste• Integração com Android SDK, Xcode e Visula Studio
![Page 7: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/7.jpg)
Single DOM – WYSIWYG
![Page 8: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/8.jpg)
Simuladores para teste (não nativo)
![Page 9: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/9.jpg)
Worklight Console - Conexão com Backend
![Page 10: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/10.jpg)
Primers - dojox/app• http://dojotoolkit.org/reference-guide/1.9/dojox/app.html
*
![Page 11: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/11.jpg)
Sencha Touchhttp://www.sencha.com/products/touch/
![Page 12: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/12.jpg)
INSTALAÇÃO DO WORKLIGHT
![Page 13: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/13.jpg)
Instalação Java
*
![Page 14: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/14.jpg)
Instalação Eclipse Kepler/Juno
*
![Page 15: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/15.jpg)
Instalação Plugin
Eclipse → Help
![Page 16: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/16.jpg)
CRIANDO UM APP HIBRIDO
![Page 17: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/17.jpg)
Livraria
■ App consulta serviço REST/JSON do Google Books
■ Consulta por autor e titulo■ Programa é escrito em JS (main.js)
com Jquery■ Interface em HTML 5 + Dojo■ https://github.com/plucena/Livros■ http://percivallucena.com/livros.apk■ http://percivallucena.com/livros.ipa
![Page 18: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/18.jpg)
Criando o Projeto
![Page 19: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/19.jpg)
Estrutura do Projeto
![Page 20: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/20.jpg)
Index.html – Ambiente Visual – Dojo/
![Page 21: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/21.jpg)
Index.html
![Page 22: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/22.jpg)
Index.html
![Page 23: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/23.jpg)
Código Comum vs Customizações
Common code placedin primary file
Environment optimization code is maintained separately
![Page 24: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/24.jpg)
API REST GoogleBooks
![Page 25: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/25.jpg)
client.js
![Page 26: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/26.jpg)
client.js
![Page 27: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/27.jpg)
O App
![Page 28: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/28.jpg)
Arquitetura Worklight
![Page 29: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/29.jpg)
Adpters
![Page 30: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/30.jpg)
Worklight Adapters
■ Serviços Disponíveis para o app móvel no Servidor Worklight
■ Conectar a outros sistemas■ Conectar a middleware: BDS,
JMS, Webservices
![Page 31: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/31.jpg)
Worklight SQL Adapter
■ Permite que o app se conecte a Bds MySQL, Oracle e DB2
■ Driver JDBC deve ser copiado para\server\lib
![Page 32: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/32.jpg)
Worklight SQL Adapter
■ Implementação em JS■ Configuração em XML
![Page 33: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/33.jpg)
Worklight SQL Adapter – SQLAdapter.xml
![Page 34: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/34.jpg)
Worklight SQL Adapter – SQLAdapter-impl.js
1 – WL.Server.createSQLStatement é usado para criar a consulta
2- Função JS no caso GetAcounts vai ser disponibilizada para o cliente com parametrização cliente recebe JSON como resposta
![Page 35: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/35.jpg)
Código Cliente para chamar adapter / Resposta JSON
![Page 36: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/36.jpg)
Perguntas
![Page 37: Worklight exemplo](https://reader034.fdocumentos.com/reader034/viewer/2022042614/55878b67d8b42a3c318b473a/html5/thumbnails/37.jpg)
Obrigado