Web2.0 e Ajax

55
Web2.0 e Ajax com Java por Paulo César M. Jeveaux

description

 

Transcript of Web2.0 e Ajax

Page 1: Web2.0 e Ajax

Web2.0 e Ajax com Java

por Paulo César M. Jeveaux

Page 2: Web2.0 e Ajax

Agenda

� Introdução

� Internet

� Web 1.0

� Web 2.0

� O que é Ajax?

� Ajax é Java?

� Por que usar Ajax?

� Problemas e Benefícios

� Frameworks Ajax

� JavaScript Utils

� Cases

� Usando Ajax com Java

31/07/2007

2

Web2.0 e Ajax com Java

Page 3: Web2.0 e Ajax

Paulo César M. Jeveaux

31/07/2007Web2.0 e Ajax com Java

3

� Javanês desde 2000;

� Mantenedor do Portal Java e do ESJUG� http://www.portaljava.com� https://esjug.dev.java.net

� Consultor Arquiteto Java EE;

� Palestrante nos principais eventos Java do país e participante de diversos grupos e comunidades de Java, Linux e Software Livre em geral.

Page 4: Web2.0 e Ajax

Uma velha novidade

Introdução

31/07/2007

4

Web2.0 e Ajax com Java

Page 5: Web2.0 e Ajax

Introdução

31/07/2007Web2.0 e Ajax com Java

5

� Desenvolvimento Web� Criação de interfaces (páginas) que dão acesso a funcionalidades dinâmicas (software) em um servidor acessível na Internet ou numa Intranet por meio de interação requisição � resposta.

Page 6: Web2.0 e Ajax

Introdução

31/07/2007Web2.0 e Ajax com Java

6

� Ajax não é nenhuma novidade, já existe hávarios anos e sempre foi uma técnica bastante conhecida por programadores JavaScript;

� Recentemente ganhou muita visibilidade e então a técnica foi batizada de Ajax;

� Sua base é composta por um componente chamado XMLHttpRequest, que foi criado pela Microsoft para o seu Outlook Web Access;

Page 7: Web2.0 e Ajax

A internet

31/07/2007

7

Web2.0 e Ajax com Java

Page 8: Web2.0 e Ajax

A internet

31/07/2007Web2.0 e Ajax com Java

8

� 1993: Lançamento do navegador Mosaic, implementando suporte ao protocolo HTTP e a processamento de páginas HTML;

� 1994: Início das linguagens para criação de conteúdo dinâmico para Web: Macromedia Coldfusion, PHP;

� 1995: Microsoft ASP;

� 1996: Java Servlets;

� 1999: JavaServer Pages (JSP);

� Hoje: Web 2.0 e Ajax;

Page 9: Web2.0 e Ajax

Web1.0

31/07/2007

9

Web2.0 e Ajax com Java

Page 10: Web2.0 e Ajax

Web 1.0

31/07/2007Web2.0 e Ajax com Java

10

� Formada basicamente por conteúdo editorial;

� Concentração de (poucas) informações relevantes e (muitas) informações não relevantes;

� Publicidade excessiva, não direcionada e incômoda;

� Falta de organização e dificuldade em encontrar o que realmente se deseja;

Page 11: Web2.0 e Ajax

Web 1.0

31/07/2007Web2.0 e Ajax com Java

11

Page 12: Web2.0 e Ajax

Web 1.0

31/07/2007Web2.0 e Ajax com Java

12

Page 13: Web2.0 e Ajax

Web 2.0

31/07/2007

13

Web2.0 e Ajax com Java

Page 14: Web2.0 e Ajax

Web 2.0

31/07/2007Web2.0 e Ajax com Java

14

Web 2.0 éAjax?

Page 15: Web2.0 e Ajax

Web 2.0

31/07/2007Web2.0 e Ajax com Java

15

NÃOWeb 2.0 não é Ajax

[10]

Page 16: Web2.0 e Ajax

Web 2.0

31/07/2007Web2.0 e Ajax com Java

16

� Formada por conteúdo editorial + conteúdo do usuário + conteúdo filtrado + organização;

� Foco em informações relevantes;

� Publicidade filtrada e direcionada;

� Conteúdo criado e organizado pelos usuários (A Web 2.0 Somos Nozes – Shoes [10]);

Page 17: Web2.0 e Ajax

Web 2.0

31/07/2007Web2.0 e Ajax com Java

17

� Web 2.0 é conteúdo de todas as fontes de informações durante o tempo todo e on-demand;

� Web 2.0 é participação ativa do usuário;

� Web 2.0 é o SOA aplicado ao extremo;

� Web 2.0 é feita por usuários para usuários;

Page 18: Web2.0 e Ajax

Web 2.0

� Web 2.0 é feita [por – para] usuários;

� E quem organiza e mantém tudo isso?

31/07/2007

18

Web2.0 e Ajax com Java

Vovô viu a uva

Vovô tageou a uva

Page 19: Web2.0 e Ajax

Web 2.0

31/07/2007Web2.0 e Ajax com Java

19

Vovó

procura

a uva

Vovó acha uva

Page 20: Web2.0 e Ajax

O que é Ajax?

31/07/2007

20

Web2.0 e Ajax com Java

Page 21: Web2.0 e Ajax

O que é Ajax?

31/07/2007Web2.0 e Ajax com Java

21

� Apresentação baseada em padrões, usando XHTML e CSS;

� Exposição e interação dinâmica usando o DOM;

� Intercâmbio e manipulação de dados usando XML e XSLT;

� Recuperação assíncrona de dados usando o objeto XMLHttpRequest;

� E JavaScript unindo tudo isso em um único conjunto;

Page 22: Web2.0 e Ajax

O que é Ajax?

31/07/2007Web2.0 e Ajax com Java

22

� Ajax, ou Asynchronous JavaScript and XML(JavaScript Assíncrono e XML) é um termo que descreve uma técnica de desenvolvimento Web para a criação de aplicativos interativos;

� Document Object Model (DOM) manipulado através do JavaSript para mostrar e interagir dinamicamente com a informação apresentada;

Page 23: Web2.0 e Ajax

O que é Ajax?

31/07/2007Web2.0 e Ajax com Java

23

� “O Objeto XMLHttpRequest troca dados assincronamente com o servidor web, geralmente utilizando-se XML, HTML, texto puro e JSON(JavaScript Object Notation)”.[4]

Page 24: Web2.0 e Ajax

Ajax é Java?

31/07/2007

24

Web2.0 e Ajax com Java

Page 25: Web2.0 e Ajax

Ajax é Java?

31/07/2007Web2.0 e Ajax com Java

25

� Não!

� Ajax não é Java, Ajax é JavaScript, XHTML, DOM e XML rodando em browsers modernos;

� Ajax porém, encaixa-se perfeitamente com Java e com várias outras linguagens de programação como PHP, ASP, .Net, Python, Ruby, etc;

Page 26: Web2.0 e Ajax

Por que usar Ajax?

31/07/2007

26

Web2.0 e Ajax com Java

Page 27: Web2.0 e Ajax

Por que usar Ajax?

31/07/2007Web2.0 e Ajax com Java

27

� Forte crescimento de aplicações na web;

� Necessidade de passar aplicações tipicamente desktop para a web;

� Interface gráfica rica e impressionante;� Atualizar páginas web com novos dados sem o temível e terrível Refresh;

� Browser passa a fornecer uma aplicação, não mais apenas conteúdo;

Page 28: Web2.0 e Ajax

Por que não usávamos JavaScript?

31/07/2007Web2.0 e Ajax com Java

28

� Porque era visto apenas com uma linguagem de validação para formulários HTML Web;

� JavaScript Orientado a Objetos era pouco conhecido;

� Frameworks JavaScript eram menos conhecidos ainda e existiam em menor quantidade;

� Trabalhoso, difícil de depurar e sem um ambiente de desenvolvimento adequado;

Page 29: Web2.0 e Ajax

Por que usar JavaScript?

31/07/2007Web2.0 e Ajax com Java

29

� Forte apelo visual para aplicações web;

� Migrar aplicações desktop para a web;

� Muito além de validação de formulários;

� Disponibilidade de Editores, bibliotecas e depuradores de alta qualidade;

� Produtividade;

Page 30: Web2.0 e Ajax

Uso real de Ajax

31/07/2007Web2.0 e Ajax com Java

30

� Validação;� Com Ajax é possível manter as regras de validação apenas em um lugar (no servidor), evitando assim duplicação de dados e a não exposição das regras de negócio ao usuário mais curioso;

� Interface mais sofisticada;� Páginas feitas para rodar em um browser podem ser bastante sofisticadas por si próprias, mas perdem boa parte da elegância e praticidade quando a mesma precisa ser recarregada para buscar informações no servidor;

� Com Ajax, pode-se facilmente tornar a página mais natural, menos fria e impessoal, utilizando JavaScript para buscar no servidor a porção de dados que precisam ser modificados, como o texto da próxima página de um artigo, as informações complementares de um formulário, ou mesmo o processamento de alguma ação mais importantes, como salvar informações cadastrais; [4]

Page 31: Web2.0 e Ajax

Problemas e Benefícios

31/07/2007

31

Web2.0 e Ajax com Java

Page 32: Web2.0 e Ajax

Ganhos com o uso de Ajax

31/07/2007Web2.0 e Ajax com Java

32

� Resposta mais rápida;� Há muita concorrência na internet, uma resposta rápida pode ser o diferencial necessário para tornar um concorrente mais popular que o outro;

� Maior interatividade;� Páginas com mais recursos que antes estavam disponíveis apenas em aplicações desktop, fazem parte das aplicações com Ajax;

� Economia de banda;� É possível fazer chamadas ao servidor carregando apenas a porção da página que deseja-se atualizar. Poupando assim a banda do servidor e diminuindo os custos de hospedagem;

Page 33: Web2.0 e Ajax

Problemas em usar Ajax

31/07/2007Web2.0 e Ajax com Java

33

� Código fonte desprotegido (protegido apenas por Obfuscators);� Permite que programadores desavisados exponham métodos importantes por engano (exemplo do uso de * nas configurações do DWR);

� Parte da Lógica de Negócio visível;� Ajax adiciona complexidade na arquitetura da aplicação;� Regras de controle na camada cliente e uso massivo de Facades;� Não faz parte de nenhuma especificação oficial (ainda);� Debug difiícil;� Aplicação se torna frágil e passiva de erros do usuário, por exemplo: nada funciona se o browser estiver com JavaScriptdesabilitado;

Page 34: Web2.0 e Ajax

Frameworks Ajax

31/07/2007

34

Web2.0 e Ajax com Java

Page 35: Web2.0 e Ajax

Frameworks Ajax - Java

31/07/2007Web2.0 e Ajax com Java

35

� DWR – Direct Web Remoting - kit de desenvolvimento Ajax. Um dos mais populares para Java. Se integra com vários frameworks Java;

� Google Web Toolkit - kit de APIs e utilitários Ajaxpara o desenvolvimento de aplicações web;

� ZK – Framework para aplicações Ajax/XUL;

� ThinWire – Framework swing-like para aplicações Web/Ajax;

� OpenLaszlo – Framework para criação de aplicações RIA (Flash e Ajax);

Page 36: Web2.0 e Ajax

Frameworks Ajax

31/07/2007Web2.0 e Ajax com Java

36

� JSon

� JSon é apenas JavaScript, portanto, o seu código JavaScript poderá utiliza-lo facilmente. Porém, outras linguagens como PHP, PERL, Java, etc não conseguirão entendê-la, para usarmos o Json precisaremos de uma integração com a linguagem. JSon já integra facilmente com: ActionScript, C/C++, C#, Delphi, ColdFusion, Java, JavaScript, Objective CAML, Perl, PHP, Python, Ruby, e Lua;

Page 37: Web2.0 e Ajax

Frameworks Ajax

31/07/2007Web2.0 e Ajax com Java

37

� JSon-RPC-Java

� JSon-RPC-Java é uma implementação dinâmica do JSON-RPC em Java. Desta forma é possível executarcódigos Java no servidor através de chamadas via JavaScript no cliente;

� Para usar o JSon-RPC-Java é preciso um servidor de aplicações Java (Tomcat, Jboss, WebLogic, etc). Épossível executar métodos de um POJO, Actions (Struts, Webwork, JSF, etc) e métodos de negócio/serviço de EJBs;

Page 38: Web2.0 e Ajax

JavaScript Utils

31/07/2007

38

Web2.0 e Ajax com Java

Page 39: Web2.0 e Ajax

Bibliotecas JavaScript

31/07/2007Web2.0 e Ajax com Java

39

� Scriptaculous;

� Miraculous;

� Tacos;

� Rico;

� Prototype;

� JST;

Page 40: Web2.0 e Ajax

Cases

31/07/2007

40

Web2.0 e Ajax com Java

Page 41: Web2.0 e Ajax

Cases

31/07/2007Web2.0 e Ajax com Java

41

iGoogle

Page 42: Web2.0 e Ajax

Cases

31/07/2007Web2.0 e Ajax com Java

42

GoogleSuggest

Page 43: Web2.0 e Ajax

Cases

31/07/2007Web2.0 e Ajax com Java

43

Google Maps

Page 44: Web2.0 e Ajax

Cases

31/07/2007Web2.0 e Ajax com Java

44

Gmail

Page 45: Web2.0 e Ajax

Cases

31/07/2007Web2.0 e Ajax com Java

45

Microsoft LiveStart

Page 46: Web2.0 e Ajax

46 Usando Ajax com Java

Web2.0 e Ajax com Java 31/07/2007

Page 47: Web2.0 e Ajax

Configurando JSon-RPC-Java

� Baixar o JSon-RPC-Java;� http://oss.metaparadigm.com/jsonrpc/

� Ter uma aplicação Web configurada parafuncionar em qualquer servidor de aplicações Java;

� Fazer o mapeamento do JSon no web.xml daaplicação;

� Usar =)

47

31/07/2007Web2.0 e Ajax com Java

Page 48: Web2.0 e Ajax

Configurando JSon-RPC-Java

<!-- Servlet JSON-RPC -->

<servlet>

<servlet-name>JSONRPCServlet</servlet-name>

<servlet-class>

com.metaparadigm.jsonrpc.JSONRPCServlet

</servlet-class>

</servlet>

<!-- Servlet Mapping JSON-RPC -->

<servlet-mapping>

<servlet-name>JSONRPCServlet</servlet-name>

<url-pattern>/JSON-RPC</url-pattern>

</servlet-mapping>

48

31/07/2007Web2.0 e Ajax com Java

Page 49: Web2.0 e Ajax

Usando JSon

� Criar uma classe com alguma operação que se desejaexecutar;

package com.jeveaux;

public class JSonExemplo {

public JSonExemplo() {

}

public int soma(int a, int b) {

return a+b;

}

}

49

31/07/2007Web2.0 e Ajax com Java

Page 50: Web2.0 e Ajax

Usando JSon

� Na página registra-se o objeto que é a ponte de comunicação do JavaScript com a aplicação Java;

<jsp:useBean id="JSONRPCBridge" scope="session"

class="com.metaparadigm.jsonrpc.JSONRPCBridge" />

� Usamos esse objeto para instanciar a classe quedesejamos usar;

<%JSONRPCBridge.registerObject("obj", new

com.jeveaux.JSonExemplo());%>

50

31/07/2007Web2.0 e Ajax com Java

Page 51: Web2.0 e Ajax

Usando JSon

� E por fim, fazemos a execução de um método na classeJava registrada no JSon através do JavaScript;

<script type="text/javascript" src="js/jsonrpc.js"></script>

<script type="text/javascript">

jsonrpc = new JSONRpcClient("JSON-RPC");

alert(jsonrpc.obj.soma(3, 5));

</script>

51

31/07/2007Web2.0 e Ajax com Java

Page 52: Web2.0 e Ajax

ESJUG, Participe

31/07/2007Web2.0 e Ajax com Java

52

� https://esjug.dev.java.net

Page 53: Web2.0 e Ajax

Referências

31/07/2007Web2.0 e Ajax com Java

53

� [1] JS templates - http://www.trimpath.com/project/wiki/

� [2] Ajax Patterns http://ajaxpatterns.org/wiki/index.php?title=Main_Page

� [3] Ajaxian – http://www.ajaxian.com

� [4] Revista Mundo Java, Dez 2005 (Rafael Steil)

� [5] Portal Java – http://www.portaljava.com

� [6] Effective Java - http://www.robsanheim.com/Ajax

� [7] Script.aculo.us - http://script.aculo.us

� [8] Mir.aculo.us - http://mir.aculo.us/

� [9] AJAX e DWR, 2006 (Franklin Samir)

� [10] A Web 2.0 Somos Nozes, 2007 (Phillip Calçado “Shoes”)

� [11] Wikipedia – http://wikipedia.org

� Esta apresentação usa a licensa Creative Commons de: Atribuição-Uso Não-Comercial-Compatilhamento

Page 54: Web2.0 e Ajax

That’s all folks!

31/07/2007Web2.0 e Ajax com Java

54

� Muito Obrigado a todos;

� Contatos:

� Paulo César M. Jeveaux (Jevô)

[email protected] / [email protected]

� www.portaljava.com / www.jeveaux.com

Page 55: Web2.0 e Ajax

Web2.0 e Ajax com Java

por Paulo César M. Jeveaux