Palestra Sencha Touch + Phonegap

Sencha Touch e Phonegap

Um novo mundo mobile

Zaedy Dantas Sayão

segunda-feira, 24 de outubro de 11

Zaedy who?me = {

nome: ‘Zaedy Dantas Sayão’,usuarioExtDesde: ‘2006’,usuarioSenchaTouchDesde: ‘Sempre’,twitter: ‘@zaedysayao’,email: ‘zaedyjava@gmail.com’,usuarioExtBrasil: ‘javaman’,github: ‘javamanrj’

}

segunda-feira, 24 de outubro de 11

Write once

segunda-feira, 24 de outubro de 11

Write once

Run everywhere

segunda-feira, 24 de outubro de 11

Documentos

segunda-feira, 24 de outubro de 11

Documentos

segunda-feira, 24 de outubro de 11

Documentos

Aplicações

segunda-feira, 24 de outubro de 11

Thin Clients

segunda-feira, 24 de outubro de 11

Thin Clients

segunda-feira, 24 de outubro de 11

Thin Clients

Thick Clients

segunda-feira, 24 de outubro de 11

Um PC

segunda-feira, 24 de outubro de 11

Um PC

segunda-feira, 24 de outubro de 11

Um PC

Múltiplos Devices

segunda-feira, 24 de outubro de 11

Fixo

segunda-feira, 24 de outubro de 11

Fixo

segunda-feira, 24 de outubro de 11

Fixo

Móvel

segunda-feira, 24 de outubro de 11

Mundo Mobile

• Lançamento do Iphone - 2007

• Iphone com apps - 2008

• Ipad - 2010

segunda-feira, 24 de outubro de 11

Apps

segunda-feira, 24 de outubro de 11

segunda-feira, 24 de outubro de 11

segunda-feira, 24 de outubro de 11

segunda-feira, 24 de outubro de 11

segunda-feira, 24 de outubro de 11

segunda-feira, 24 de outubro de 11

segunda-feira, 24 de outubro de 11

segunda-feira, 24 de outubro de 11

segunda-feira, 24 de outubro de 11

segunda-feira, 24 de outubro de 11

segunda-feira, 24 de outubro de 11

segunda-feira, 24 de outubro de 11

segunda-feira, 24 de outubro de 11

?

segunda-feira, 24 de outubro de 11

2%6%

24%

41%

27%

AppleAndroidRIMMicrosoftSymbian

Top Smartphone Platforms3 Month Avg. Ending Jun. 2011 2011Total U.S. Smartphone Subscribers Ages 13+Source: comScore MobiLens

Qual você não vai atender?

segunda-feira, 24 de outubro de 11

2%6%

24%

41%

27%

AppleAndroidRIMMicrosoftSymbian

Top Smartphone Platforms3 Month Avg. Ending Jun. 2011 2011Total U.S. Smartphone Subscribers Ages 13+Source: comScore MobiLens

Qual você não vai atender?

Obj-C

segunda-feira, 24 de outubro de 11

2%6%

24%

41%

27%

AppleAndroidRIMMicrosoftSymbian

Top Smartphone Platforms3 Month Avg. Ending Jun. 2011 2011Total U.S. Smartphone Subscribers Ages 13+Source: comScore MobiLens

Qual você não vai atender?

Obj-C

Java

segunda-feira, 24 de outubro de 11

2%6%

24%

41%

27%

AppleAndroidRIMMicrosoftSymbian

Top Smartphone Platforms3 Month Avg. Ending Jun. 2011 2011Total U.S. Smartphone Subscribers Ages 13+Source: comScore MobiLens

Qual você não vai atender?

Obj-C

Java

Java

segunda-feira, 24 de outubro de 11

2%6%

24%

41%

27%

AppleAndroidRIMMicrosoftSymbian

Top Smartphone Platforms3 Month Avg. Ending Jun. 2011 2011Total U.S. Smartphone Subscribers Ages 13+Source: comScore MobiLens

Qual você não vai atender?

Obj-C

Java

Java

C#

segunda-feira, 24 de outubro de 11

2%6%

24%

41%

27%

AppleAndroidRIMMicrosoftSymbian

Top Smartphone Platforms3 Month Avg. Ending Jun. 2011 2011Total U.S. Smartphone Subscribers Ages 13+Source: comScore MobiLens

Qual você não vai atender?

Obj-C

Java

Java

C# Symbian C++

segunda-feira, 24 de outubro de 11

Aprender várias linguagens?

segunda-feira, 24 de outubro de 11

Aprender várias linguagens?

NÃO!

segunda-feira, 24 de outubro de 11

Um retorno a web

segunda-feira, 24 de outubro de 11

Um retorno a web

• Cross-plataform

• Descentralizado

• Fácil Atualização

• Ferramentas e skills familiares

• Tecnologia bem dominada

segunda-feira, 24 de outubro de 11

segunda-feira, 24 de outubro de 11

segunda-feira, 24 de outubro de 11

Uma nova arquitetura mobile

Javascript

CSS e Layouts

HTML (Semântica)

segunda-feira, 24 de outubro de 11

Uma nova arquitetura mobile

Javascript

CSS e Layouts

HTML (Semântica)

File SystemsDBs

App Cache

segunda-feira, 24 de outubro de 11

Uma nova arquitetura mobile

Javascript

CSS e Layouts

HTML (Semântica)

File SystemsDBs

App Cache

WorkerParallel

Processing

segunda-feira, 24 de outubro de 11

Uma nova arquitetura mobile

Javascript

CSS e Layouts

HTML (Semântica)

File SystemsDBs

App Cache

WorkerParallel

Processing

x-App Messaging

segunda-feira, 24 de outubro de 11

Uma nova arquitetura mobile

Javascript

CSS e Layouts

HTML (Semântica)

File SystemsDBs

App Cache

WorkerParallel

Processing

x-App Messaging

Device Acess

Câmera

Geolocalização

Contatos

SMS

Orientação

Gyro

segunda-feira, 24 de outubro de 11

Uma nova arquitetura mobile

Javascript

CSS e Layouts

HTML (Semântica)

File SystemsDBs

App Cache

WorkerParallel

Processing

x-App Messaging

Device Acess

Câmera

Geolocalização

Contatos

SMS

Orientação

Gyro

Server e Services

HTTP

AJAX

Events

Sockets

SSL

Mais...

segunda-feira, 24 de outubro de 11

O que somos capazes?

segunda-feira, 24 de outubro de 11

O que somos capazes?

segunda-feira, 24 de outubro de 11

O que somos capazes?

segunda-feira, 24 de outubro de 11

O que somos capazes?

segunda-feira, 24 de outubro de 11

O que somos capazes?

segunda-feira, 24 de outubro de 11

O que somos capazes?

segunda-feira, 24 de outubro de 11

O que queremos fazer?

segunda-feira, 24 de outubro de 11

O que queremos fazer?

segunda-feira, 24 de outubro de 11

O que queremos fazer?

segunda-feira, 24 de outubro de 11

O que queremos fazer?

segunda-feira, 24 de outubro de 11

O que queremos fazer?

segunda-feira, 24 de outubro de 11

O que queremos fazer?

segunda-feira, 24 de outubro de 11

Usuário quer?

segunda-feira, 24 de outubro de 11

Usuário quer?

USAR

segunda-feira, 24 de outubro de 11

A resposta

segunda-feira, 24 de outubro de 11

A resposta

SENCHA TOUCH

segunda-feira, 24 de outubro de 11

A empresa

segunda-feira, 24 de outubro de 11

A empresa

• www.sencha.com

• ExtJS

• Ext GWT

• Sencha Touch

• Sencha Animator

• Sencha.io

segunda-feira, 24 de outubro de 11

O que é?

segunda-feira, 24 de outubro de 11

O que é?

• Framework Javascript

• Rich mobile apps

• Web standards

• HTML5, CSS3 e JS

segunda-feira, 24 de outubro de 11

O que tem no Sencha Touch?

segunda-feira, 24 de outubro de 11

O que tem no Sencha Touch?

• Layouts e componentes

• Temas e ícones

• Orientação e Animação

• Eventos de Touch e scroll

• Data package

• MVC

• Gráficos

segunda-feira, 24 de outubro de 11

Componentes

segunda-feira, 24 de outubro de 11

Componentes• List

• Nested, Grouped, Sortable

• Carousel

• Picker

• Overlay

• Slider

• Forms

• Toolbars

• Botões

• HTML

• Audio

• Vídeo

• Geolocalização

segunda-feira, 24 de outubro de 11

List

segunda-feira, 24 de outubro de 11

Carousel

segunda-feira, 24 de outubro de 11

Sheets

segunda-feira, 24 de outubro de 11

Eventos

• Feito baseado em eventos nativos

• Abstração

• Eventos adicionais:

• Tap

• Double tap

• Tap and Hold

• Swipe

• Rotate

• Drag and drop

segunda-feira, 24 de outubro de 11

Data Package• Model, Stores e Proxies

• Associations

• Validations

• Local e server storage

• Webservices

• JSON/P

• Ajax

• YQL

segunda-feira, 24 de outubro de 11

Temas

• CSS3

• SASS

• Temas flexíveis

• Otimizados

• Ex:

• $base-color: #ff6699

segunda-feira, 24 de outubro de 11

Gráficos

segunda-feira, 24 de outubro de 11

Write once, run everywhere?

segunda-feira, 24 de outubro de 11

Write once, run everywhere?

Quase!

segunda-feira, 24 de outubro de 11

Dispositivo mobile não é uma Web com 320px!

segunda-feira, 24 de outubro de 11

segunda-feira, 24 de outubro de 11

Quase mas você pode reaproveitar muito

código!

segunda-feira, 24 de outubro de 11

Models

Controllers

Stores

Proxies

Server

Web Mobile

.

.

.

.

segunda-feira, 24 de outubro de 11

Lembrando

Para dispositivos móveis,

adapte mas escreva apenas uma vez

sempre!segunda-feira, 24 de outubro de 11

E como distribuir?E como acessar o

device?

segunda-feira, 24 de outubro de 11

E como distribuir?E como acessar o

device?

Phonegap!

segunda-feira, 24 de outubro de 11

O que é?

• “Empacotador”

• Deploy para várias plataformas

• Acesso nativo

segunda-feira, 24 de outubro de 11

O que suporta• Acelerômetro

• Câmera

• Captura de sons, vídeos e imagens

• Bússula

• Conexão

• Contatos

• Device

• Eventos

• Arquivos

• Geolocalização

• Mídia

• Notificações

• Storage

segunda-feira, 24 de outubro de 11

Quero algo que não é suportado

segunda-feira, 24 de outubro de 11

Quero algo que não é suportado

Plugins

segunda-feira, 24 de outubro de 11

O que é possível fazer

segunda-feira, 24 de outubro de 11

O que é possível fazer

Com Sencha Touch + Phonegap?

segunda-feira, 24 de outubro de 11

O que sua mente permitir

segunda-feira, 24 de outubro de 11

O que sua mente permitir

E seu chefe deixar....

segunda-feira, 24 de outubro de 11

Exemplos?

• www.sencha.com/apps

segunda-feira, 24 de outubro de 11

Perguntas?

segunda-feira, 24 de outubro de 11