linguagil 2012: desenvolvendo aplicações ria com ext js 4 e touch 2

48
Desenvolvendo Aplicações RIA com Ext JS 4 e Touch 2 Loiane Groner http://loiane.com @loiane

Upload: loiane-groner

Post on 22-May-2015

555 views

Category:

Technology


1 download

DESCRIPTION

palestra no Linguagil 2012 - Salvador BA

TRANSCRIPT

Page 1: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

DesenvolvendoAplicações RIA com Ext JS 4 e Touch 2

Loiane Gronerhttp://loiane.com@loiane

Page 2: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Loiane Groner

•Sencha e Java Evangelist

•Livro!

•http://loiane.com

•@loiane

Page 3: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

www. sencha.com

Page 4: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Ext JS 4

Page 5: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Cross-Browser

Page 6: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Cross-Browser

Roda até no IEca 6!

Page 7: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Alguns Exemplos...

Page 8: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Fácil Integração

Page 9: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Faltou alguma coisa?

Page 10: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Construindo aplicações ExtJS

Page 11: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Como organizar um projeto JS?

Page 12: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

ExtJS 3

4k linhas de código

Page 13: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Difícil de testar

Difícil de manter

Difícil de trabalhar em equipe

Difícil de entender

Page 14: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Trabalho em Equipe

Pessoas diferentes == trabalho diferente

É preciso usar um padrão

Page 15: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Código precisa ser organizado

Boas práticas precisam ser seguidas

Evitar confusão com versão de controle

Page 16: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Model View Controller == MVC

Page 17: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Model

Carrega e Gerencia dados da app

Dados dos requests da View

Page 18: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

View

Gerencia a visualização dos dados

Componentes UI

Page 19: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Controller

Gerencia inputs do usuário

Atualiza o Model e View

Page 20: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Model

Page 21: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

View

Page 22: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

View

Page 23: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Controller

Page 24: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Benefícios do MVC

Escalabilidade

Mantenabilidade

Flexibilidade

Page 25: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Demo - ExtJS 4

Page 26: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Mas “peraí...”

Page 28: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

“Bora na onda mobile também!”

Page 29: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Sencha Touch 2

Page 30: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Primeiro framework Javascript para desenvolvimento de apps mobile ricas

usando padrões web

Page 31: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2
Page 32: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2
Page 33: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Motivos

Page 34: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2
Page 35: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Vai aprender várias linguages e vai fazer uma aplicação para cada

dispositivo?

Page 36: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Vai limitar?

Page 37: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Alguns Exemplos...

Page 38: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Voltando a nossa app...

Page 39: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2
Page 40: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2
Page 41: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

E look and feel?

Page 42: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2
Page 43: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

E testes?

Page 44: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Siesta!

http://www.bryntum.com/

Page 45: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Exemplos reais!

Page 46: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Para saber mais...

Cursos Gratuitos e Online:

ExtJS 4 e Touch 2:

http://loiane.com

Page 47: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Download do Código:

https://github.com/loiane/linguagil2012

Page 48: Linguagil 2012: Desenvolvendo Aplicações RIA com  Ext JS 4 e Touch 2

Obrigada!