SlideShare uma empresa Scribd logo

Web 2.0 e AJAX - Parte 2 / 3

David Ruiz
David Ruiz
David RuizCTO em Paraná Banco

Segunda parte da palestra sobre Web 2.0 e AJAX.

Web 2.0 e AJAX - Parte 2 / 3

1 de 23
Apresentação




Empresário e Analista de Sistemas
BLOG: www.davidruiz.eti.br
SITE: www.zaptrade.com.br
COMUNIDADE: www.gamedev.com.br/cpbr2008/

CONTATO: wupsbr@gmail.com
Agenda

Quarta-Feira ( 13/02 ) às 16h
* Entenda o XMLHttpRequest;

* API DOM (Document Object Model);

* AJAX Toolkits e Frameworks;
 - ExtJS;
 - MOOTOOLS;
 - EXEMPLOS DE UTILIZAÇÃO.

* Desenvolvimento de Aplicação WEB 2.0.
 - INÍCIO DO PROJETO.
Agenda

Quinta-Feira ( 14/02 ) às 16h
* Desenvolvimento de Aplicação WEB 2.0;
 - FINALIZAÇÃO DO PROJETO.

* Conclusão.
Refrescando a memória

Características da WEB 2.0:
• WEB COMO PLATAFORMA;
• COLABORAÇÃO / INTELIGÊNCIA COLETIVA;
• CONTEÚDO DINÂMICO / RSS ( Really Simple Syndication );
• FASE quot;BETAquot; CONTÍNUO;
• CONTEÚDO DINÂMICO;
• MASHUPS / INTEGRAÇÃO COM SERVIÇOS EXISTENTES;
• CLOUD COMPUTING.
Refrescando a memória

AJAX permite trabalhar com modelo assíncrono:
Refrescando a memória

Veja como aplicar o AJAX em seus projetos:
• VALIDAÇÃO EM TEMPO REAL;
   Ex: Verificar o nível de segurança da senha informada.
• AUTOCOMPLETAR;
   Ex: Ao digitar o CEP o mesmo preenche automaticamente o endereço, bairro e etc.
• OPERAÇÕES MESTRE-DETALHE;
   Ex: Seleciona o ESTADO o mesmo retorna as CIDADES correspondentes.
• COMPONENTES DE INTERFACE AVANÇADOS (WIDGETS);
   Ex: Árvores, menus, barra de progresso.
• NOTIFICAÇÕES PROVENIENTES DO SERVIDOR.
   Ex: Notificação de um novo e-mail.
Anúncio

Recomendados

Consumindo dados via web service no android
Consumindo dados via web service no androidConsumindo dados via web service no android
Consumindo dados via web service no androidAlexandre Antunes
 
Java Web 4 - Servlets e JSP 2
Java Web 4 - Servlets e JSP 2Java Web 4 - Servlets e JSP 2
Java Web 4 - Servlets e JSP 2Eduardo Mendes
 
Android webservice
Android webserviceAndroid webservice
Android webserviceAlan Echer
 
Cactus - Testes em J2EE com Jakarta Cactus
Cactus - Testes em J2EE com Jakarta CactusCactus - Testes em J2EE com Jakarta Cactus
Cactus - Testes em J2EE com Jakarta CactusDenis L Presciliano
 
Java web 6 JSP Expression Language Taglib parte 2
Java web 6 JSP Expression Language Taglib parte 2Java web 6 JSP Expression Language Taglib parte 2
Java web 6 JSP Expression Language Taglib parte 2Eduardo Mendes
 
AJAX?? Não!! Asynchronous Javascript and... JSON!!
AJAX?? Não!! Asynchronous Javascript and... JSON!!AJAX?? Não!! Asynchronous Javascript and... JSON!!
AJAX?? Não!! Asynchronous Javascript and... JSON!!Lucas Brasilino
 
Ajax O Objeto Xml Http Request Parte 4
Ajax   O Objeto Xml Http Request   Parte 4Ajax   O Objeto Xml Http Request   Parte 4
Ajax O Objeto Xml Http Request Parte 4infinitopublicidade
 

Mais conteúdo relacionado

Mais procurados

Java Web 5 - JSP, Expression Language e Taglibs
Java Web 5 - JSP, Expression Language e TaglibsJava Web 5 - JSP, Expression Language e Taglibs
Java Web 5 - JSP, Expression Language e TaglibsEduardo Mendes
 
Desenvolvimento em .Net - nHibernate
Desenvolvimento em .Net - nHibernateDesenvolvimento em .Net - nHibernate
Desenvolvimento em .Net - nHibernateVitor Silva
 
PHP RESTful Web Services
PHP RESTful Web ServicesPHP RESTful Web Services
PHP RESTful Web ServicesFelipe Ribeiro
 
Java Web 3 - Servlets e JSP 1
Java Web 3 - Servlets e JSP 1Java Web 3 - Servlets e JSP 1
Java Web 3 - Servlets e JSP 1Eduardo Mendes
 
Dsi 015 - poo e php - conexão com bancos de dados usando pdo
Dsi   015 - poo e php - conexão com bancos de dados usando pdoDsi   015 - poo e php - conexão com bancos de dados usando pdo
Dsi 015 - poo e php - conexão com bancos de dados usando pdoJorge Luís Gregório
 
Node.js - #6 - Core Modules - net - Rodrigo Branas
Node.js - #6 - Core Modules - net - Rodrigo BranasNode.js - #6 - Core Modules - net - Rodrigo Branas
Node.js - #6 - Core Modules - net - Rodrigo BranasRodrigo Branas
 
Curso de WebServlets (Java EE 7)
Curso de WebServlets (Java EE 7)Curso de WebServlets (Java EE 7)
Curso de WebServlets (Java EE 7)Helder da Rocha
 
55 New Things in Java 7 - Brazil
55 New Things in Java 7 - Brazil55 New Things in Java 7 - Brazil
55 New Things in Java 7 - BrazilStephen Chin
 
Jdbc, JAVA DATABASE CONNECTIVITY
Jdbc, JAVA DATABASE CONNECTIVITYJdbc, JAVA DATABASE CONNECTIVITY
Jdbc, JAVA DATABASE CONNECTIVITYraquelcarsi
 
Javaone Brazil 2012: Integrando Ext JS 4 com Java EE
Javaone Brazil 2012: Integrando Ext JS 4 com Java EEJavaone Brazil 2012: Integrando Ext JS 4 com Java EE
Javaone Brazil 2012: Integrando Ext JS 4 com Java EELoiane Groner
 
Uma abordagem ao Java EE 6
Uma abordagem ao Java EE 6Uma abordagem ao Java EE 6
Uma abordagem ao Java EE 6danielfcampos
 
Httpunit - Teste de interface Web com HttpUnit
Httpunit - Teste de interface Web com HttpUnitHttpunit - Teste de interface Web com HttpUnit
Httpunit - Teste de interface Web com HttpUnitDenis L Presciliano
 
Testes em Aplicações Web com Cactus
Testes em Aplicações Web com CactusTestes em Aplicações Web com Cactus
Testes em Aplicações Web com CactusDenis L Presciliano
 

Mais procurados (20)

Java Web 5 - JSP, Expression Language e Taglibs
Java Web 5 - JSP, Expression Language e TaglibsJava Web 5 - JSP, Expression Language e Taglibs
Java Web 5 - JSP, Expression Language e Taglibs
 
Desenvolvimento em .Net - nHibernate
Desenvolvimento em .Net - nHibernateDesenvolvimento em .Net - nHibernate
Desenvolvimento em .Net - nHibernate
 
Ajax em java
Ajax em javaAjax em java
Ajax em java
 
Http Servlet
Http ServletHttp Servlet
Http Servlet
 
PHP RESTful Web Services
PHP RESTful Web ServicesPHP RESTful Web Services
PHP RESTful Web Services
 
Java Web 3 - Servlets e JSP 1
Java Web 3 - Servlets e JSP 1Java Web 3 - Servlets e JSP 1
Java Web 3 - Servlets e JSP 1
 
Fundamentos de JDBC
Fundamentos de JDBCFundamentos de JDBC
Fundamentos de JDBC
 
servlet-respostas
servlet-respostasservlet-respostas
servlet-respostas
 
Frameworks Ajax
Frameworks AjaxFrameworks Ajax
Frameworks Ajax
 
Dsi 015 - poo e php - conexão com bancos de dados usando pdo
Dsi   015 - poo e php - conexão com bancos de dados usando pdoDsi   015 - poo e php - conexão com bancos de dados usando pdo
Dsi 015 - poo e php - conexão com bancos de dados usando pdo
 
Ajax
AjaxAjax
Ajax
 
Node.js - #6 - Core Modules - net - Rodrigo Branas
Node.js - #6 - Core Modules - net - Rodrigo BranasNode.js - #6 - Core Modules - net - Rodrigo Branas
Node.js - #6 - Core Modules - net - Rodrigo Branas
 
Curso de WebServlets (Java EE 7)
Curso de WebServlets (Java EE 7)Curso de WebServlets (Java EE 7)
Curso de WebServlets (Java EE 7)
 
55 New Things in Java 7 - Brazil
55 New Things in Java 7 - Brazil55 New Things in Java 7 - Brazil
55 New Things in Java 7 - Brazil
 
Aula de Node
Aula de NodeAula de Node
Aula de Node
 
Jdbc, JAVA DATABASE CONNECTIVITY
Jdbc, JAVA DATABASE CONNECTIVITYJdbc, JAVA DATABASE CONNECTIVITY
Jdbc, JAVA DATABASE CONNECTIVITY
 
Javaone Brazil 2012: Integrando Ext JS 4 com Java EE
Javaone Brazil 2012: Integrando Ext JS 4 com Java EEJavaone Brazil 2012: Integrando Ext JS 4 com Java EE
Javaone Brazil 2012: Integrando Ext JS 4 com Java EE
 
Uma abordagem ao Java EE 6
Uma abordagem ao Java EE 6Uma abordagem ao Java EE 6
Uma abordagem ao Java EE 6
 
Httpunit - Teste de interface Web com HttpUnit
Httpunit - Teste de interface Web com HttpUnitHttpunit - Teste de interface Web com HttpUnit
Httpunit - Teste de interface Web com HttpUnit
 
Testes em Aplicações Web com Cactus
Testes em Aplicações Web com CactusTestes em Aplicações Web com Cactus
Testes em Aplicações Web com Cactus
 

Semelhante a Web 2.0 e AJAX - Parte 2 / 3

PHP e Ajax com XAJAX
PHP e Ajax com XAJAXPHP e Ajax com XAJAX
PHP e Ajax com XAJAXRafael Dohms
 
PHP e AJAX: do Request ao Framework
PHP e AJAX: do Request ao FrameworkPHP e AJAX: do Request ao Framework
PHP e AJAX: do Request ao FrameworkRafael Dohms
 
Minicurso de PHP Com Ajax
Minicurso de PHP Com AjaxMinicurso de PHP Com Ajax
Minicurso de PHP Com AjaxAdler Medrado
 
Aplicações Web com AJAX - Er Galvão Abbott
Aplicações Web com AJAX - Er Galvão AbbottAplicações Web com AJAX - Er Galvão Abbott
Aplicações Web com AJAX - Er Galvão AbbottTchelinux
 
Node.js - #7 - Core Modules - http - Parte 1 - Rodrigo Branas
Node.js - #7 - Core Modules - http - Parte 1 - Rodrigo BranasNode.js - #7 - Core Modules - http - Parte 1 - Rodrigo Branas
Node.js - #7 - Core Modules - http - Parte 1 - Rodrigo BranasRodrigo Branas
 
Ajax O Objeto Xml Http Request Parte 2
Ajax   O Objeto Xml Http Request   Parte 2Ajax   O Objeto Xml Http Request   Parte 2
Ajax O Objeto Xml Http Request Parte 2infinitopublicidade
 
Introdução aos Servlets e JSPs
Introdução aos Servlets e JSPsIntrodução aos Servlets e JSPs
Introdução aos Servlets e JSPsLuiz Ricardo Silva
 
De Web Services RESTful a Aplicações Mashup
De Web Services RESTful a Aplicações MashupDe Web Services RESTful a Aplicações Mashup
De Web Services RESTful a Aplicações MashupWagner Roberto dos Santos
 
Ajax O Objeto Xml Http Request Parte 1
Ajax   O Objeto Xml Http Request   Parte 1Ajax   O Objeto Xml Http Request   Parte 1
Ajax O Objeto Xml Http Request Parte 1infinitopublicidade
 
Apostilava Java EE 5 - 2007
Apostilava Java EE 5 - 2007Apostilava Java EE 5 - 2007
Apostilava Java EE 5 - 2007Rafael Benevides
 
Curso de Java (Parte 7) Web Application
Curso de Java (Parte 7) Web ApplicationCurso de Java (Parte 7) Web Application
Curso de Java (Parte 7) Web ApplicationMario Sergio
 

Semelhante a Web 2.0 e AJAX - Parte 2 / 3 (20)

PHP e Ajax com XAJAX
PHP e Ajax com XAJAXPHP e Ajax com XAJAX
PHP e Ajax com XAJAX
 
PHP e AJAX: do Request ao Framework
PHP e AJAX: do Request ao FrameworkPHP e AJAX: do Request ao Framework
PHP e AJAX: do Request ao Framework
 
Treinamento ajax 02
Treinamento ajax   02Treinamento ajax   02
Treinamento ajax 02
 
Minicurso de PHP Com Ajax
Minicurso de PHP Com AjaxMinicurso de PHP Com Ajax
Minicurso de PHP Com Ajax
 
Aplicações Web com AJAX - Er Galvão Abbott
Aplicações Web com AJAX - Er Galvão AbbottAplicações Web com AJAX - Er Galvão Abbott
Aplicações Web com AJAX - Er Galvão Abbott
 
ASP.NET AJAX
ASP.NET AJAXASP.NET AJAX
ASP.NET AJAX
 
Aplicacoes Web Com AJAX
Aplicacoes Web Com AJAXAplicacoes Web Com AJAX
Aplicacoes Web Com AJAX
 
Node.js - #7 - Core Modules - http - Parte 1 - Rodrigo Branas
Node.js - #7 - Core Modules - http - Parte 1 - Rodrigo BranasNode.js - #7 - Core Modules - http - Parte 1 - Rodrigo Branas
Node.js - #7 - Core Modules - http - Parte 1 - Rodrigo Branas
 
Ajax O Objeto Xml Http Request Parte 2
Ajax   O Objeto Xml Http Request   Parte 2Ajax   O Objeto Xml Http Request   Parte 2
Ajax O Objeto Xml Http Request Parte 2
 
Introdução aos Servlets e JSPs
Introdução aos Servlets e JSPsIntrodução aos Servlets e JSPs
Introdução aos Servlets e JSPs
 
Servlets e JSP
Servlets e JSPServlets e JSP
Servlets e JSP
 
De Web Services RESTful a Aplicações Mashup
De Web Services RESTful a Aplicações MashupDe Web Services RESTful a Aplicações Mashup
De Web Services RESTful a Aplicações Mashup
 
introdução a ajax
introdução a ajaxintrodução a ajax
introdução a ajax
 
servlet-requisicoes
servlet-requisicoesservlet-requisicoes
servlet-requisicoes
 
Tutorial de ajax
Tutorial de ajaxTutorial de ajax
Tutorial de ajax
 
Ajax O Objeto Xml Http Request Parte 1
Ajax   O Objeto Xml Http Request   Parte 1Ajax   O Objeto Xml Http Request   Parte 1
Ajax O Objeto Xml Http Request Parte 1
 
Apostilava Java EE 5 - 2007
Apostilava Java EE 5 - 2007Apostilava Java EE 5 - 2007
Apostilava Java EE 5 - 2007
 
8159540 Tutorial De Ajax
8159540 Tutorial De Ajax8159540 Tutorial De Ajax
8159540 Tutorial De Ajax
 
Curso de Java (Parte 7) Web Application
Curso de Java (Parte 7) Web ApplicationCurso de Java (Parte 7) Web Application
Curso de Java (Parte 7) Web Application
 
Artigoajax
ArtigoajaxArtigoajax
Artigoajax
 

Mais de David Ruiz

Developer Experience - Escalando Negócios com a melhor experiência ao desenvo...
Developer Experience - Escalando Negócios com a melhor experiência ao desenvo...Developer Experience - Escalando Negócios com a melhor experiência ao desenvo...
Developer Experience - Escalando Negócios com a melhor experiência ao desenvo...David Ruiz
 
Plataformas de Inovação - Criando Conexões
Plataformas de Inovação - Criando ConexõesPlataformas de Inovação - Criando Conexões
Plataformas de Inovação - Criando ConexõesDavid Ruiz
 
Containers com docker #CPRecife4
Containers com docker #CPRecife4Containers com docker #CPRecife4
Containers com docker #CPRecife4David Ruiz
 
Internet of Things
Internet of ThingsInternet of Things
Internet of ThingsDavid Ruiz
 
Arduino Day 2014 - Cloud para Internet das Coisas & Intel Galileo
Arduino Day 2014 - Cloud para Internet das Coisas & Intel GalileoArduino Day 2014 - Cloud para Internet das Coisas & Intel Galileo
Arduino Day 2014 - Cloud para Internet das Coisas & Intel GalileoDavid Ruiz
 
Hoodie na Campus Party Brasil 2013
Hoodie na Campus Party Brasil 2013Hoodie na Campus Party Brasil 2013
Hoodie na Campus Party Brasil 2013David Ruiz
 
Workshop Kit de Desenvolvimento IoT
Workshop Kit de Desenvolvimento IoTWorkshop Kit de Desenvolvimento IoT
Workshop Kit de Desenvolvimento IoTDavid Ruiz
 
Workshop de Firefox OS
Workshop de Firefox OSWorkshop de Firefox OS
Workshop de Firefox OSDavid Ruiz
 
Desenvolvendo para Firefox OS
Desenvolvendo para Firefox OSDesenvolvendo para Firefox OS
Desenvolvendo para Firefox OSDavid Ruiz
 
Introdução ao Firefox OS
Introdução ao Firefox OSIntrodução ao Firefox OS
Introdução ao Firefox OSDavid Ruiz
 
node.js - Eventful JavaScript on the Server
node.js - Eventful JavaScript on the Servernode.js - Eventful JavaScript on the Server
node.js - Eventful JavaScript on the ServerDavid Ruiz
 
livre.fm - keynote
livre.fm - keynotelivre.fm - keynote
livre.fm - keynoteDavid Ruiz
 
GED - A caminho do conhecimento
GED - A caminho do conhecimentoGED - A caminho do conhecimento
GED - A caminho do conhecimentoDavid Ruiz
 
imax games - Desenvolvimento de Jogos
imax games - Desenvolvimento de Jogosimax games - Desenvolvimento de Jogos
imax games - Desenvolvimento de JogosDavid Ruiz
 
Modelagem 3D de personagens para jogos
Modelagem 3D de personagens para jogosModelagem 3D de personagens para jogos
Modelagem 3D de personagens para jogosDavid Ruiz
 
Ruby On Rails - Porque Utilizar?
Ruby On Rails - Porque Utilizar?Ruby On Rails - Porque Utilizar?
Ruby On Rails - Porque Utilizar?David Ruiz
 
Trabalhe na Abril Digital
Trabalhe na Abril DigitalTrabalhe na Abril Digital
Trabalhe na Abril DigitalDavid Ruiz
 
Lua para Jogos
Lua para JogosLua para Jogos
Lua para JogosDavid Ruiz
 
Web 2.0 e AJAX - Parte 3 / 3
Web 2.0 e AJAX - Parte 3 / 3Web 2.0 e AJAX - Parte 3 / 3
Web 2.0 e AJAX - Parte 3 / 3David Ruiz
 
Tendências de Search Egines - Microsoft
Tendências de Search Egines - MicrosoftTendências de Search Egines - Microsoft
Tendências de Search Egines - MicrosoftDavid Ruiz
 

Mais de David Ruiz (20)

Developer Experience - Escalando Negócios com a melhor experiência ao desenvo...
Developer Experience - Escalando Negócios com a melhor experiência ao desenvo...Developer Experience - Escalando Negócios com a melhor experiência ao desenvo...
Developer Experience - Escalando Negócios com a melhor experiência ao desenvo...
 
Plataformas de Inovação - Criando Conexões
Plataformas de Inovação - Criando ConexõesPlataformas de Inovação - Criando Conexões
Plataformas de Inovação - Criando Conexões
 
Containers com docker #CPRecife4
Containers com docker #CPRecife4Containers com docker #CPRecife4
Containers com docker #CPRecife4
 
Internet of Things
Internet of ThingsInternet of Things
Internet of Things
 
Arduino Day 2014 - Cloud para Internet das Coisas & Intel Galileo
Arduino Day 2014 - Cloud para Internet das Coisas & Intel GalileoArduino Day 2014 - Cloud para Internet das Coisas & Intel Galileo
Arduino Day 2014 - Cloud para Internet das Coisas & Intel Galileo
 
Hoodie na Campus Party Brasil 2013
Hoodie na Campus Party Brasil 2013Hoodie na Campus Party Brasil 2013
Hoodie na Campus Party Brasil 2013
 
Workshop Kit de Desenvolvimento IoT
Workshop Kit de Desenvolvimento IoTWorkshop Kit de Desenvolvimento IoT
Workshop Kit de Desenvolvimento IoT
 
Workshop de Firefox OS
Workshop de Firefox OSWorkshop de Firefox OS
Workshop de Firefox OS
 
Desenvolvendo para Firefox OS
Desenvolvendo para Firefox OSDesenvolvendo para Firefox OS
Desenvolvendo para Firefox OS
 
Introdução ao Firefox OS
Introdução ao Firefox OSIntrodução ao Firefox OS
Introdução ao Firefox OS
 
node.js - Eventful JavaScript on the Server
node.js - Eventful JavaScript on the Servernode.js - Eventful JavaScript on the Server
node.js - Eventful JavaScript on the Server
 
livre.fm - keynote
livre.fm - keynotelivre.fm - keynote
livre.fm - keynote
 
GED - A caminho do conhecimento
GED - A caminho do conhecimentoGED - A caminho do conhecimento
GED - A caminho do conhecimento
 
imax games - Desenvolvimento de Jogos
imax games - Desenvolvimento de Jogosimax games - Desenvolvimento de Jogos
imax games - Desenvolvimento de Jogos
 
Modelagem 3D de personagens para jogos
Modelagem 3D de personagens para jogosModelagem 3D de personagens para jogos
Modelagem 3D de personagens para jogos
 
Ruby On Rails - Porque Utilizar?
Ruby On Rails - Porque Utilizar?Ruby On Rails - Porque Utilizar?
Ruby On Rails - Porque Utilizar?
 
Trabalhe na Abril Digital
Trabalhe na Abril DigitalTrabalhe na Abril Digital
Trabalhe na Abril Digital
 
Lua para Jogos
Lua para JogosLua para Jogos
Lua para Jogos
 
Web 2.0 e AJAX - Parte 3 / 3
Web 2.0 e AJAX - Parte 3 / 3Web 2.0 e AJAX - Parte 3 / 3
Web 2.0 e AJAX - Parte 3 / 3
 
Tendências de Search Egines - Microsoft
Tendências de Search Egines - MicrosoftTendências de Search Egines - Microsoft
Tendências de Search Egines - Microsoft
 

Web 2.0 e AJAX - Parte 2 / 3

  • 1. Apresentação Empresário e Analista de Sistemas BLOG: www.davidruiz.eti.br SITE: www.zaptrade.com.br COMUNIDADE: www.gamedev.com.br/cpbr2008/ CONTATO: wupsbr@gmail.com
  • 2. Agenda Quarta-Feira ( 13/02 ) às 16h * Entenda o XMLHttpRequest; * API DOM (Document Object Model); * AJAX Toolkits e Frameworks; - ExtJS; - MOOTOOLS; - EXEMPLOS DE UTILIZAÇÃO. * Desenvolvimento de Aplicação WEB 2.0. - INÍCIO DO PROJETO.
  • 3. Agenda Quinta-Feira ( 14/02 ) às 16h * Desenvolvimento de Aplicação WEB 2.0; - FINALIZAÇÃO DO PROJETO. * Conclusão.
  • 4. Refrescando a memória Características da WEB 2.0: • WEB COMO PLATAFORMA; • COLABORAÇÃO / INTELIGÊNCIA COLETIVA; • CONTEÚDO DINÂMICO / RSS ( Really Simple Syndication ); • FASE quot;BETAquot; CONTÍNUO; • CONTEÚDO DINÂMICO; • MASHUPS / INTEGRAÇÃO COM SERVIÇOS EXISTENTES; • CLOUD COMPUTING.
  • 5. Refrescando a memória AJAX permite trabalhar com modelo assíncrono:
  • 6. Refrescando a memória Veja como aplicar o AJAX em seus projetos: • VALIDAÇÃO EM TEMPO REAL; Ex: Verificar o nível de segurança da senha informada. • AUTOCOMPLETAR; Ex: Ao digitar o CEP o mesmo preenche automaticamente o endereço, bairro e etc. • OPERAÇÕES MESTRE-DETALHE; Ex: Seleciona o ESTADO o mesmo retorna as CIDADES correspondentes. • COMPONENTES DE INTERFACE AVANÇADOS (WIDGETS); Ex: Árvores, menus, barra de progresso. • NOTIFICAÇÕES PROVENIENTES DO SERVIDOR. Ex: Notificação de um novo e-mail.
  • 7. XMLHttpRequest : Características Objeto em JavaScript que fornece a comunicação assíncrona com o servidor. • Objeto JavaScript; • Adotado pelos navegadores modernos; * Primeira implementação nativa no Mozilla 1.0 (2002) • A World Wide Web Consortium publicou uma especificação como “Working Draft” em 5 de abril de 2006; • No Internet Explorer é um controle ActiveX chamado MSXML; • O IE7 suporta o objeto XMLHttpRequest de forma nativa.
  • 8. XMLHttpRequest : Características Principais características: • Comunica-se com o servidor utilizando requisições HTTP comuns: GET/POST; • Permite comunicação assíncrona; • Funciona em background; • Não interrompe a operação do usuário; • O tipo da resposta (ContentType) pode ser: • text/xml • text/plain • text/json • text/javascript
  • 9. XMLHttpRequest : Métodos Método: Descrição: open(method, URL, asyncFlag, Abre e prepara uma requisição HTTP identificada username, password) pelo método e URL. asynchFlag indica se a comunicação deve ser assíncrona ou não. setRequestHeader(label, value) Associa um valor a um cabeçalho HTTP antes de fazer a requisição. send(postdata) Executa a requisição HTTP. getAllResponseHeaders() Retorna uma lista de todos os cabeçalhos HTTP da resposta. getResponseHeader(label) Retorna o cabeçalho HTTP associado ao label. abort() Interrompe uma requisição que está sendo processada.
  • 10. XMLHttpRequest : Propriedades Propriedade: Descrição: onreadystatechange Informa a função JavaScript que deve ser chamada a cada mudança de estado. readystate Estado atual da requisição, pode ser: 0 = não iniciada 1 = iniciando conexão 2 = conexão estabelecida 3 = em atividade (algum dado foi recebido) 4 = completa status Status HTTP recebido do servidor: 200 = OK 403 = Forbidden 500 = Internal Error
  • 11. XMLHttpRequest : Propriedades Propriedade: Descrição: responseText Representação textual (string) dos dados enviados pelo servidor. responseXML Representação do documento XML enviado pelo servidor. statusText Representação textual (string) do status HTTP recebido do servidor (OK, Not Found, etc).
  • 12. XMLHttpRequest : Exemplo Prático Exibindo o contéudo de uma página utilizando AJAX: ( EXEMPLO 1 ) var url = 'index.html'; try { // Firefox, Opera 8.0+, Safari, IE7 request = new XMLHttpRequest(); } catch (e) { // Internet Explorer try { // Internet Explorer < 7 request = new ActiveXObject(quot;Msxml2.XMLHTTPquot;); } catch (e) { try { // Internet Explorer < 7 request = new ActiveXObject(quot;Microsoft.XMLHTTPquot;); } catch (e) { alert(quot;Seu browser não suporta AJAX!quot;); } } }
  • 13. XMLHttpRequest : Exemplo Prático Exibindo o contéudo de uma página utilizando AJAX: ( EXEMPLO 1 ) function processReqChange () { // codigo 4 para 'status complete' if (request.readyState == 4 && request.status == 200) { var s = 'Status: t' + request.status + 'n'; s += 'StatusText: t' + request.statusText + 'n'; s += 'ResponseText: t' + request.responseText; alert(s); } } var url = 'index.html'; var request = new XMLHttpRequest(); request.onreadystatechange = processReqChange; request.open(quot;GETquot;, url, true); request.send(quot;quot;);
  • 14. API DOM (Document Object Model) API DOM: •API DOM (Document Object Model); •Os navegadores mantém uma representação dos documentos que estão sendo exibidos; •Disponível pelo objeto JavaScript document; •A API DOM permite que código JavaScript altere a árvore DOM programaticamente; • Exemplos: • Adicionar uma nova linha a uma tabela; • Alterar o conteúdo de uma DIV; • Alterar o estilo CSS de um elemento.
  • 15. AJAX Toolkits e Frameworks Tipos de soluções disponíveis hoje: • Bibliotecas JavaScript (lado do cliente); • Frameworks de chamada remota via Proxy; • Componentes JSF com comportamento AJAX; • Wrappers; • Tradutor Java para JavaScript; • Frameworks com extensão para AJAX.
  • 16. AJAX Toolkits e Frameworks Bibliotecas JavaScript (lado do cliente): • Pode ser utilizada com qualquer tecnologia do lado do servidor; • Podem ser combinadas com outras bibliotecas; • Cuida de incompatibilidades de browsers; • Utiliza IFrame oculto se necessário; • Captura eventos de navegação como os botões avançar e voltar; • Componentes de interface avançados (widgets); • API JavaScript mais fácil de usar para controle de eventos, erros, etc.; • Ex: Dojo Toolkit, Rico, Script.aculo.us.
  • 17. AJAX Toolkits e Frameworks Frameworks de chamada remota via Proxy: •Similar ao modelo de comunicação RPC; Arquitetura baseada em stubs e skeletons; •O framework gera o stub do cliente (proxy) para chamadas ao código do servidor; •Faz o marshalling de todos os parâmetros; •Ex: Direct Web Remoting (DWR), JSONRPC; •DWR 2.0 irá suportar AJAX Reverso; Chamada JavaScript a partir do código Java;
  • 18. AJAX Toolkits e Frameworks Componentes JSF com comportamento AJAX: Esconde toda a complexidade da programação AJAX; • O autor não precisa saber JavaScript; • Componentes JSF são reutilizáveis; • Ex: ajax4jsf, ICEfaces, DynaFaces.
  • 19. AJAX Toolkits e Frameworks Wrappers: • Atualmente existem vários toolkits com diferentes componentes e sintaxes de uso; • Empacota (wrap) os componentes visuais em custom tags (JSP) ou componentes JSF; • Tenta consolidar as diferentes bibliotecas JavaScript (lado do cliente): Depende de bibliotecas como o Dojo, DHTML Goodies, Script.aculo.us. •Ex: jMarki
  • 20. AJAX Toolkits e Frameworks Tradutor Java para JavaScript: • Desenvolve a aplicação AJAX usando apenas código Java; •Quando a aplicação é implantada, converte código Java para JavaScript; •“Hosted Mode” – permite depuração do código; •Ex: Google Web Toolkit (GWT).
  • 21. AJAX Toolkits e Frameworks Frameworks com extensão para AJAX: • Alguns Frameworks de desenvolvimento de aplicação para Web já estão trazendo o comportamento nativo ao AJAX: •Ex: Ruby on Rails, Echo2, Shale
  • 22. ExtJS e Mootools Características: • Frameworks são quase sempre extremamente leves: Mootools < 30Kb completo. • Modular e orientado a objetos; • Produção de animações; Exemplos: http://extjs.com/deploy/dev/examples/ http://demos.mootools.net/
  • 23. ATÉ AMANHÃ! BLOG: www.davidruiz.eti.br SITE: www.zaptrade.com.br COMUNIDADE: www.gamedev.com.br/cpbr2008/ CONTATO: wupsbr@gmail.com