Java Web Curso

CURSO DE JAVA PARA WEB
POR: FRANCISLON SILVA DE OLIVEIRA
07 de Junho de 2011
Objetivo
Este curso visa dar uma viso geral da tecnologia Java voltada para web, demonstrando de forma prtica como funciona as APIs de JSP e Servlets.
Agenda
Arquitetura Web Montagem de Ambiente Reviso HTML Servlets Java Server Pages
Mdulo 1
Arquitetura Web
Funcionamento
Arquitetura Web
HTTP/1.1 200 OK ... Camada Cliente Camada Servidor
Resposta
Requisio
GET /index.html HTTP/1.1 ...
Plataforma Web baseada em protocolo HTTP
Tecnologias
Arquitetura Web
Camada Cliente - HTML - CSS - Javascript
Camada Servidor - PHP - ASP - Ruby - Python - Perl - Java EE
Resposta
Requisio
Plataforma Web baseada em protocolo HTTP
Tecnologias Em nosso projeto
Arquitetura Web
Camada Cliente
- HTML - CSS - Javascript
Camada Servidor
JDBC
Resposta
SQL SERVER
Requisio
- JSP - Servlet JDBC ORACLE
Arquitetura Java EE
Arquitetura Web
Arquitetura Java EE
Arquitetura Web
Web Components
Mdulo 2
Montagem de ambiente
Ferramentas
1. 2.

Montagem de Ambiente
Editor: Eclipse WTP
Z:\TI\Publico\francislon\CursoJavaEE\eclipse-jee-indigo-win32.zip Z:\TI\Publico\francislon\CursoJavaEE\jboss-as-distribution-6.0.0.Final.zip
Servidor de Aplicaes: JBoss AS 6
3.
Gerenciamento, empacotamento e implantao de Cdigo Fonte: Maven

Plugin M2Eclipse
Ferramentas
1. Para instalar o plugin M2Eclipse
1. Ir em Help > Install New Software
Ferramentas
1. Para instalar o plugin M2Eclipse
1. Ir em Help > Install New Software 2. No campo Work With digite o link (http://download.eclipse.org/technology/m2e/releases) e clique no boto Add colocando no campo Name um valor descritivo.
Reviso HTML
1. HTML uma linguagem de marcao, para escrever pginas web, formada por tags:
<html>
<head><title>Cabealho da pgina</title></head> <body> ... Pgina aqui... </body>

</html>
Reviso HTML - Tags

a p i b u ul ol li h1 h2 h3 h4 h5 h6 table tr img strong pre blockquote font dl dt dd center div
frameset frame link meta style abbr acronym address bdo cite q code ins del dfn kbd samp var base area tbody thead tfoot col colgroup caption form input textarea select option optgroup button label fieldset legend script noscript tt sub sup big small hr
em td hr Br
Mais informaes em: http://www.w3schools.com/tags/default.asp
Reviso HTML - Tags

a p i b u ul ol li h1 h2 h3 h4 h5 h6 table tr img strong pre blockquote font dl dt dd center div
frameset frame link meta style abbr acronym address bdo cite q code ins del dfn kbd samp var base area tbody thead tfoot col colgroup caption form input textarea select option optgroup button label fieldset legend script noscript tt sub sup big small hr
em td hr Br
Mais informaes em: http://www.w3schools.com/tags/default.asp
Reviso HTML - Acentos

® ° ± ² ³ ´
¼ ¾ × ÷ À Á Â
µ
½
Ã
ç
Mais informaes em: http://www.w3schools.com/tags/ref_entities.asp
Reviso HTML
Exerccio 1 (tempo estimado: 7 min )
Faa uma pgina html similar ao prximo slide:
Ferramentas
1. Descompactar o JBoss AS 6 em um diretrio de sua preferncia. 2. Criar uma varivel de ambiente no Windows com o nome JBOSS_HOME apontando para o diretrio descompactado.
Ferramentas
1. Para instalar o plugin JBossTools
1. Ir em Help > Install New Software 2. No campo Work With digite o link ( http://download.jboss.org/jbosstools/updates/development /indigo) clique no boto Add colocando no campo Name um valor descritivo.
Reviso Javascript
1. Linguagem de script no lado do cliente.
<script type="text/javascript"> function trataNome(){ var name = document.getElementById("name").value; if(name == ''){ alert("Campo nome vazio"); return false; }else{ return true; } } </script> ---------------------------------------------------------------------------------------------------<form onsubmit="return trataNome()">
Mais em: http://www.w3schools.com/js/default.asp
Reviso Javascript
No lugar do alert coloque: document.getElementById("erroNome").innerHTML="N&atildeo deixe o nome vazio."; E na onde tem o cdigo HTML do campo nome coloque: <label for="name">Nome: </label><input type="text" id="name" name="name" /><em id="erroNome"></em><br />
Reviso Javascript
if (condicao1){ //codigo } else if(condicao2){ //codigo }else{ //codigo } ------------------------------------------------------------------------------------------------------------------------switch(valor){ case 1: //codigo break; case 2: //codigo break; default: //codigo }
Reviso Javascript
for (variavel=inicial; variavel<=final; variavel=variavel+incremento){ //codigo } -------------------------------------------------------------------------------------------while (condicao){ //codigo } -------------------------------------------------------------------------------------------do{ //codigo } while (condicao);
Reviso HTML
Exerccio 2 (tempo estimado: 12 min )
Faa uma pgina em html que possui um formulrio para receber os seguintes dados:
Nome Email Data de nascimento Salrio Escolaridade (em combo)
Mostre uma mensagem Dados inseridos, se todos os campos estiverem preenchidos, aps pressionado o boto Enviar. Faa o tratamento dos campos utilizando Javascript.
Ferramentas
1. Para adicionar um novo servidor de aplicaes:
Ir em Windows > Show View > Servers
Ferramentas
1. Para adicionar um novo servidor de aplicaes:
Ir em Windows > Show View > Servers Clica com o boto direito na aba Servers e seleciona New > Server
Mdulo 3
Servlets
Viso Geral
Servlets
1. Servlet um objeto Java que recebe requisies (request) e produz algo (response), como uma pgina HTML dinamicamente gerada. 2. O comportamento das servlets foi definido na classe HttpServlet do pacote javax.servlet. 3. Para escrevermos uma servlet, criamos uma classe Java que estenda HttpServlet e sobrescreva um mtodo chamado service. Esse mtodo ser o responsvel por atender requisies e gerar as respostas adequadas. Sua assinatura: protected void service (HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException();
Viso Geral
Servlets
Servlet
ServletRequest
ServletResponse
GenericServlet
HttpServletRequest
HttpServletResponse
HttpServlet
Viso Geral Ciclo de Vida
Servlets
[ARGONAVIS]
Viso Geral Criar projeto no eclipse

1. File > New > Other
Servlets

1. Maven > Maven Project
Servlets
Servlets
Servlets
Servlets
Viso Geral Primeira Servlet
Servlets
Servlets
Servlets
Viso Geral web.xml
Servlets
Mais em http://download.oracle.com/docs/cd/E13222_01/wls/docs81/webapp/web_xml.html
Viso Geral - Exerccio

1. Exerccio 3 (tempo estimado : 3 min)
Modifique o index.jsp do projeto criado para mostrar o formulrio construdo no Exerccio 2.
Servlets
Recebendo Parmetros
1. No action do form fazemos:
<form action=servletName">
Servlets
2. Na Servlet fazemos:
String valorDoParametro = request.getParameter("nomeDoParametro");
Recebendo Parmetros Exerccio

Servlets
Faa o action do formulrio no index.jsp enviar a requisio para a servlet OiMundo. Imprima todos os parmetros recebidos pela servlet no browser. PS: necessrio importar a classe:
import java.io.PrintWriter;
Trabalhando com Banco de Dados

1. Instale o MySQL que est localizado em:
Z:\TI\Publico\francislon\CursoJavaEE\mysql-5.5.15-win32.msi
Servlets
2. Caso tenha dificuldade na instalao favor consultar o link:

http://www.sistemabasico.com.br/2011/06/30/instalando-omysql-5-5-8-no-windows-7/ Caso o comando no seja reconhecido, reinicie o computador
3. Abra o prompt de comando e digite: mysql
4. Crie um banco de dados chamado: projeto
Trabalhando com Banco de Dados Exerccio

Crie uma tabela chamada usuario no banco com as colunas:
Nome Email Data de Nascimento Salrio Escolaridade
Servlets
Servlets
Servlets
Aplicao Java
Interface JDBC
Interface Especfica
Banco de Dados

1. Criando uma conexo com o banco:
Servlets

Servlets
Adicione servlet OiMundo o cdigo para criar conexo com o banco projeto Mande rodar a aplicao no servidor PS: Importar as classes:
import java.sql.Connection; import java.sql.DriverManager; import java.sql.SQLException;
Servlets

1. Soluo:
Crie uma pasta dentro do diretrio WEB-INF chamada lib e adicione o arquivo
Z:\TI\Publico\francislon\CursoJavaEE\mysql-connector-java5.1.17-bin.jar
Servlets
Servlets

1. Inserindo um registro no banco de dados:
Servlets
2. PS: Importar a classe:

import java.sql.PreparedStatement;

Adicione servlet OiMundo o cdigo para criar conexo com o banco projeto e adicionar os dados recebidos como parmetros na tabela usuario Mande rodar a aplicao no servidor e veja se o registro foi inserido no banco
Servlets
Servlets
Servlets

1. Recuperando registros no banco de dados:
Servlets
2. PS: Importar a classe:

import java.sql.ResultSet;

Crie uma pgina com as opes:
Cadastrar Usurio Buscar Usurio
Servlets
Quando o usurio clicar em Cadastrar Usurio, mostre o formulrio de cadastro de usurio, que j est feito. Se clicar em Buscar Usurio, mostre um formulrio com a opo de busca por nome. Este ltimo formulrio dever chamar uma servlet que far a consulta no banco de dados buscando usurios com o nome digitado.
Servlets
Servlets
Servlets
Servlets
Servlets
Mtodos de envios de dados

1. Mtodo GET
Padro protected void doGet(HttpServletRequest req, HttpServletResponse resp) protected void doPost(HttpServletRequest req, HttpServletResponse resp)
Servlets
2. Mtodo POST
Tratando Erros em Servlets

1. s vezes acontecem erros inesperados, ou excees, que nem sempre o servidor trata da melhor forma possvel.
Servlets

Servlets
Crie uma pgina para tratar erro do tipo 404 (Page Not Found) Crie uma pgina para tratar excees Modifique o web.xml para exibir as pginas criadas quando acontecer as anormalidades associadas
Mdulo 4
JavaServer Pages
Viso Geral
1. uma pgina html com extenso JSP. 2. Voc pode colocar cdigo Java dentro dela utilizando os scriptlets:
<% String texto = Olaá JSP!!!; out.println(texto);
JSP
%>
Viso Geral
JSP
Viso Geral
JSP
Viso Geral
JSP
Viso Geral
JSP
Viso Geral
Camada de Negcios Camada de Apresentao HTML JSP JAVA Servlets e Classes de Negcios
JSP
Viso Geral
1. Baixo acoplamento 2. Melhor manuteno 3. Maior reutilizao
JSP
Viso Geral
1. Padro DAO
JSP
Ngocios
Beans
BeansDAO
Banco de Dados
Viso Geral
JSP
Viso Geral
JSP
Viso Geral
JSP
Viso Geral
JSP
Viso Geral
JSP
Viso Geral
JSP
Viso Geral
JSP
Viso Geral Exerccio

Modifique a Servlet BuscaUsuario, deixando-a apenas com cdigo Java Utilize a classe UsuarioDAO para auxiliar com o processamento
JSP
Viso Geral
JSP
Viso Geral
JSP
Expression Language
1. Nem sempre precisamos criar uma Servlet para interceptar nossa requisio 2. Utilizada principalmente para visualizao de dados vindos de outro JSP 3. Utilizamos a sintaxe
${param.nomeDoParametro}
JSP
Para parmetros de requisio

Para chamada de mtodos get de objetos
${objeto.atributo}
Expression Language
JSP
Expression Language
JSP
Expression Language Exerccio

Crie uma pgina JSP, o qual possui um formulrio com os campos: nome, sobrenome, email e telefone, que vai enviar a requisio para outra pgina JSP. Esta ltima imprimir os valores recebidos utilizando Expression Language.
JSP

JSP
Crie uma classe Estado com os atributos nome e sigla; crie seus setters e getters Crie uma classe ListaEstados, o qual possui um mtodo getEstados que retornar um List<Estado>

Imprima os dados dos estados em uma pgina JSP
JSP
Taglibs
1. Baseada em bibliotecas de tags prontas que auxiliam na construo de pginas JSP 2. Utilizadas para diminuir quantidade de cdigo Java nos JSPs
JSP
Taglibs
1. Para instanciar um POJO(Plain Old Java Object), um Javabean com construtor pblico e getters e setters, fazemos:
<jsp:useBean id=objeto" class="br.com.axxiom.Classe"/>
JSP
2. Para imprimir os dados desse objeto utilizamos sintaxe de Expression Language:

1. ${objeto.atributo}
Taglibs
1. A JSTL(JavaServer Pages Standard Tag Library) uma implementao de taglibs da Oracle 2. Para utiliz-la precisamos baixar a api e colocar na pasta WEB-INF\lib
Z:\TI\Publico\francislon\CursoJavaEE\jstl-api-1.2.jar Z:\TI\Publico\francislon\CursoJavaEE\jstl-impl-1.2.jar
JSP
3. Temos de colocar o cabealho:

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
Taglibs
1. foreach
JSP
Taglibs Exerccio
Refaa o exerccio 13 utilizando JSTL
JSP
Taglibs Outras tags

1. forTokens
1. <c:forTokens var="i" delims="," items="2,3,4,5"> <c:out value="${i}"/>; </c:forTokens >
JSP
2. if 1. <c:if test="${i % 2 == 0}"> <c:out value="${i}"/>; </c:if>
Taglibs Outras tags

1. choose
1. <c:choose> <c:when test="${i % 2 == 0}">${i} (par)</c:when> <c:otherwise>${i} (impar)</c:otherwise> </c:choose>if
JSP
2. set
1. <c:set scope="request" var=titulo" value=Minha pagina"/>
Exerccio Final
Curso de JavaEE
Faa um sistema de cadastro simples de biblioteca. O formulrio de cadastro deve possuir: Nome do Livro ISBN Autor O cadastro possuir duas funcionalidades: Insero de novos livros no sistema Busca de livros cadastrados: Busca por Nome Busca por ISBN Busca por Autor
Exerccio Final
Curso de JavaEE
1. Crie um projeto novo de nome ultralibrary 2. O formulrio precisa ser validado 3. No momento da busca o usuario ter apenas um radioButton para selecionar o tipo de busca e um campo de texto para fazer a busca 4. O retorno da busca dever vir em uma tabela 5. Evite o uso de cdigo Java em pginas JSPs e de html em Servlets
Perguntas
Obrigado!
Francislon Silva
francislon.oliveira@axxiom.com.br

Java Web Curso

Transféré par

Informations du document

Titre original

Copyright

Formats disponibles

Partager ce document

Partager ou intégrer le document

Options de partage

Avez-vous trouvé ce document utile ?

Ce contenu est-il inapproprié ?

Droits d'auteur :

Formats disponibles

Java Web Curso

Transféré par

Droits d'auteur :

Formats disponibles

CURSO DE JAVA PARA WEB

POR: FRANCISLON SILVA DE OLIVEIRA

HTTP/1.1 200 OK ... Camada Cliente Camada Servidor

GET /index.html HTTP/1.1 ...

Plataforma Web baseada em protocolo HTTP

Camada Cliente - HTML - CSS - Javascript

Camada Servidor - PHP - ASP - Ruby - Python - Perl - Java EE

Plataforma Web baseada em protocolo HTTP

Tecnologias Em nosso projeto

- JSP - Servlet JDBC ORACLE

Servidor de Aplicaes: JBoss AS 6

Gerenciamento, empacotamento e implantao de Cdigo Fonte: Maven

<head><title>Cabealho da pgina</title></head> <body> ... Pgina aqui... </body>

Reviso HTML - Tags

Mais informaes em: http://www.w3schools.com/tags/default.asp

Reviso HTML - Tags

Mais informaes em: http://www.w3schools.com/tags/default.asp

Reviso HTML - Acentos

Mais informaes em: http://www.w3schools.com/tags/ref_entities.asp

Mais em: http://www.w3schools.com/js/default.asp

Mais em: http://www.w3schools.com/js/default.asp

Viso Geral Ciclo de Vida

Viso Geral Criar projeto no eclipse

Viso Geral Criar projeto no eclipse

Viso Geral Criar projeto no eclipse

Viso Geral Criar projeto no eclipse

Viso Geral Criar projeto no eclipse

Viso Geral Primeira Servlet

Viso Geral Primeira Servlet

Viso Geral Primeira Servlet

Viso Geral web.xml

Viso Geral - Exerccio

Recebendo Parmetros Exerccio

Trabalhando com Banco de Dados

2. Caso tenha dificuldade na instalao favor consultar o link:

3. Abra o prompt de comando e digite: mysql

4. Crie um banco de dados chamado: projeto

Trabalhando com Banco de Dados Exerccio

Trabalhando com Banco de Dados Exerccio

Trabalhando com Banco de Dados

Trabalhando com Banco de Dados

Trabalhando com Banco de Dados Exerccio

Trabalhando com Banco de Dados Exerccio

Trabalhando com Banco de Dados Exerccio

Trabalhando com Banco de Dados Exerccio

Trabalhando com Banco de Dados

2. PS: Importar a classe:

Trabalhando com Banco de Dados Exerccio

Trabalhando com Banco de Dados Exerccio

Trabalhando com Banco de Dados Exerccio

Trabalhando com Banco de Dados

2. PS: Importar a classe:

Trabalhando com Banco de Dados Exerccio

Trabalhando com Banco de Dados Exerccio

Trabalhando com Banco de Dados Exerccio

Trabalhando com Banco de Dados Exerccio

Trabalhando com Banco de Dados Exerccio

Trabalhando com Banco de Dados Exerccio

Mtodos de envios de dados

Tratando Erros em Servlets

Trabalhando com Banco de Dados Exerccio

Viso Geral Exerccio

Para parmetros de requisio