Desenvolvimento WEB II Ajax – Utilização de Frameworks Javascript Professora: Kelly de Paula...

Desenvolvimento WEB IIAjax – Utilização de Frameworks Javascript

Professora: Kelly de Paula Cunha

Revisão Framework

O que é um Framework?

• Um framework captura a funcionalidade comum a várias aplicações

• As aplicações devem ter algo razoavelmente grande em comum: pertencem a um mesmo domínio de problema

Revisão Framework

Revisão Framework

"Um framework provê uma solução para uma família de problemas semelhantes, ...Usando um conjunto de classes e interfaces que mostra como decompor a família de problemas, ...E como objetos dessas classes colaboram para cumprir suas responsabilidades, ...O conjunto de classes deve ser flexível e extensível para permitir a construção de várias aplicações com pouco esforço, especificando apenas as particularidades de cada aplicação"

Revisão Framework

Um framework é uma aplicação quase completa, mas com pedaços faltando.

– Ao receber um framework, seu trabalho consiste em prover os pedaços que são específicos para sua aplicação

Utilizando Frameworks AJAX

• A utilização de Ajax sem o uso de frameworks é complicada na construção e depuração da aplicação.

• Pensando nisso, muitos desenvolvedores começaram a se unir e desenvolver boas práticas no desenvolvimento de JavaScript com foco em AJAX.

• Além do envio e recebimento via AJAX já configurados, esses frameworks também possuem tratamento de erros com relação ao uso do JavaScript.

Exemplo de Frameworks AJAX

Dojo Toolkit – biblioteca escrita em JavaScript desenhada para desenvolvimento rápido e fácil de aplicações Web baseadas somente em JavaScript ou totalmente Ajax, independente de plataforma servidora.

Exemplo de Frameworks AJAX

Dojo Toolkit – características:

- Código aberto- Modular- Sintaxe simplificada- Funções para chamada AJAX- Componentes gráficos- Efeitos visuais- Validações

Exemplo de Frameworks AJAX

Dojo Toolkit – informações adicionais:

Onde baixar?http://dojotoolkit.org/download/

Como utilizar?http://www.devmedia.com.br/apresentando-o-dojo-toolkit/25465

Exemplo de Frameworks AJAX

jQuery – pode ser utilizada para:

• Adicionarmos efeitos visuais e animações;• Acessarmos e manipularmos o DOM;• Carregarmos componentes Ajax;• Provermos interatividade;• Fazer alteração de conteúdo;• Simplificarmos tarefas JavaScript.

Exemplo de Frameworks AJAX

jQuery –

cada navegador possui seu próprio conjunto de características de implementação que ainda pode dificultar mais ainda, de acordo com a variação de plataforma e sistema operacional onde esteja executando. Já com a jQuery, nossa programação é única e transparente.

Exemplo de Frameworks AJAX

jQuery – informações adicionais:

Onde baixar? http://jquery.com/

Como utilizar? http://www.devmedia.com.br/introducao-a-jquery/27299

Exemplo de Frameworks AJAX

- DWR – acrônimo para Direct Web Remoting. É um framework Ajax desenvolvido para aplicações escritas em Java.

- Tem como principal característica a integração com as classes Java de dentro do próprio JavaScript.

Exemplo de Frameworks AJAX

DWR - características:

- Open Source- Contém boas práticas de programação- Pouca documentação- Uso somente em aplicações JAVA

Exemplo de Frameworks AJAX

DWR – informações adicionais:

Onde baixar? http://directwebremoting.org/dwr/downloads/

Como utilizar? http://www.devmedia.com.br/dwr-directed-web-remoting-parte-i-i/3284

Exemplo de Frameworks AJAX

JSF - JavaServer Faces é um framework de interface de usuário (IU) para aplicações Java Web.

Foi projetado para facilitar significativamente a trabalhosa tarefa de escrever e manter os aplicações que são executadas em um servidor de aplicações Java e compilar as IUs de volta a um cliente de destino.

Exemplo de Frameworks AJAX

JSF é uma tecnologia que incorpora características de:

• um framework MVC para WEB• um modelo de interfaces gráficas baseado em eventos.

Por basear-se no padrão de projeto MVC, uma de suas melhores vantagens é a clara separação entre a visualização e regras de negócio (modelo).

Exemplo de Frameworks AJAX

A ideia do padrão MVC é dividir uma aplicação em três camadas: modelo, visualização e controle.

Exemplo de Frameworks AJAX

Padrão MVC:

- modelo: é responsável por representar os objetos de negócio, manter o estado da aplicação e fornecer ao controlador o acesso aos dados.

- visualização: representa a interface com o usuário, sendo responsável por definir a forma como os dados serão apresentados e encaminhar as ações dos usuários para o controlador.

- controle: responsável por fazer a ligação entre o modelo e a visualização, além de interpretar as ações do usuário e as traduzir para uma operação sobre o modelo, onde são realizadas mudanças e, então, gerar uma visualização apropriada.

Exemplo de Frameworks AJAX

Arquitetura JSF baseada no modelo MVC:

Exemplo de Frameworks AJAXNo JSF, o controle é composto por um servlet denominado FacesServlet, por arquivos de configuração e por um conjunto de manipuladores de ações e observadores de eventos.

Exemplo de Frameworks AJAXO FacesServlet é responsável por receber requisições da WEB, redirecioná-las para o modelo e então remeter uma resposta.

Os arquivos de configuração são responsáveis por realizar associações e mapeamentos de ações e pela definição de regras de navegação.

Os manipuladores de eventos são responsáveis por receber os dados vindos da camada de visualização, acessar o modelo, e então devolver o resultado para o FacesServlet.

Exemplo de Frameworks AJAXNo JSF, o modelo representa os objetos de negócio e executa uma lógica de negócio ao receber os dados vindos da camada de visualização.

Exemplo de Frameworks AJAXNo JSF, a visualização é composta por component trees (hierarquia de componentes UI), tornando possível unir um componente ao outro para formar interfaces mais complexas.

Exemplo de Frameworks AJAX

É possível criar uma página JavaServer Faces adicionando Ajax criando os seu próprios componentes ou usando bibliotecas já feitas.

Um dos mais populares frameworks JSF que estendem suas aplicações para utilizar AJAX é o Ajax4jsf.

Exemplo de Frameworks AJAXVantagens de se utilizar o Ajax4Jsf

- adiciona capacidade Ajax nas aplicações que utilizam JSF sem recorrer ao JavaScript

- Não exige grandes alterações para adicionar o Ajax

- Contém boa documentação

- Open Source

Exemplo de Frameworks AJAXDesvantagens de se utilizar o Ajax4Jsf

- Não é possível utiliza-lo em aplicações Java sem o uso de JSF

Exemplo de Frameworks AJAXInformações adicionais:

- Como baixar? http://labs.jboss.com/portal/jbossajax4jsf

- Como instalar?http://www.devmedia.com.br/conhecendo-o-ajax4jsf/5529

Referências

Gonçalves, Edson. Jsp, Servlet, Javaserver Faces, Hibernate, Ejb 3 Persistence E Ajax. Editora Ciência Moderna.

Pitanga, Talita. JavaServer Faces: A mais nova tecnologia Java para desenvolvimento WEB. Disponível em: http://www.guj.com.br/content/articles/jsf/jsf.pdf

Netbeans. Introdução ao JavaServer Faces. Disponível em: https://netbeans.org/kb/docs/web/jsf20-intro_pt_BR.html

AJAXAtividade 8 (Foi passado na ultima aula)

- Continue o desenvolvimento da aplicação Exemplo007(livro WEB TOTAL, pág.230)- Botão Incluir funcionando:

-> Busca automática do ID máximo cadastrado-> Inserção de novo cliente no BD

AJAXAtividade 9 (Foi passado na ultima aula)

- Crie uma planilha (no Microsoft Excel) com o nome: Controle_erros_ Exemplo007_seu_nome- Preencha a tabela com os erros que aparecerem durante o desenvolvimento do seu projeto

Local numero da linha problema soluçãoquem

solucionou

Controle 12 erro de sintaxe colocar parênteses eu

Banco de dados

configuração do MySQL

seguir tutorial estabelecendo conexão com banco de dados terceiros

AJAXAtividade 10

- Continue o desenvolvimento da aplicação Exemplo007(livro WEB TOTAL, pág.230)- Botão Consultar funcionando: