Introdução ao desenvolvimento de aplicações Web
Este documento oferece os conceitos básicos sobre o uso do NetBeans IDE no desenvolvimento de aplicações Web. Ele demonstra como criar uma aplicação Web simples, implantá-la em um servidor e exibir sua apresentação em um navegador. O aplicativo usa uma página JavaServer Pages™ (JSP) para solicitar que você insira o seu nome. Em seguida, usa um componente JavaBeans™ para manter o nome durante a sessão HTTP e repete o nome em outra segunda página JSP.
Conteúdo
Para seguir este tutorial, você precisa dos seguintes recursos e softwares.
Observações:
- A instalação Web e Java EE permite que você instale opcionalmente o servidor da aplicação GlassFish 2.1 e o contêiner do servlet Apache Tomcat 6.0.x. Você deve instalar um desses para poder trabalhar neste tutorial.
- Para tirar vantagem dos recursos Java EE 5 do NetBeans , use um servidor da aplicação que seja totalmente compatível com a especificação Java EE 5, tal como o servidor da aplicação GlassFish 2.1 UR2. Se você estiver usando um servidor diferente, consulte as Notas de versão e as Perguntas freqüentes para saber problemas conhecidos e soluções alternativas. Para obter informações detalhadas sobre os servidores suportados e a plataforma Java EE, consulte as Notas de versão.
- Se você precisar comparar seu projeto com uma solução que funciona, baixe o aplicativo de amostra.
Configurando um projeto de aplicação Web
- Escolha Arquivo > Novo projeto (Ctrl-Shift-N) no menu principal. Em Categorias, selecione Java Web. Em Projetos, selecione Aplicação Web e clique em Próximo.
- Na Etapa 2, indique HelloWeb na caixa de texto Nome do projeto.
- Especifique a Localização do projeto para qualquer diretório no computador. Para fins deste tutorial, esse diretório é chamado de $PROJECTHOME.
- (Opcional) Selecione a caixa de verificação Usar pasta dedicada para armazenamento de bibliotecas e especifique o local da pasta de bibliotecas. Consulte Compartilhando bibliotecas do projeto para obter mais informações sobre esta opção.
- Clique em Próximo. O painel Servidor e configuração se abre. Selecione a versão de Java EE que você deseja usar com seu aplicativo.
- Selecione o servidor no qual deseja implantar a aplicação. Somente os servidores registrados com o IDE estão listados. Observe que o Caminho de contexto (i.e., no servidor) se torna /HelloWeb, que está baseado no nome dado ao projeto na etapa anterior.
- Clique em Próximo. No painel Frameworks, clique em Terminar para criar o projeto.
O IDE cria a pasta do projeto $PROJECTHOME/HelloWeb. A pasta do projeto contém todas as fontes e metadados do projeto, como o script de construção Ant do projeto. O projeto HelloWeb se abre no IDE. A página de boas vindas, index.jsp, se abre no editor de código-fonte na janela principal. Você pode ver a estrutura de arquivos do projeto na janela Arquivos (Ctrl-2), e sua estrutura lógica na janela Projetos (Ctrl-1):
Criando e editando arquivos de origem de aplicações Web
A criação e edição de arquivos de origem é a função mais importante do IDE. Afinal de contas, é isto o que você faz na maior parte do tempo. O IDE fornece uma ampla variedade de ferramentas que podem complementar o estilo pessoal de qualquer desenvolvedor, tanto se você preferir codificar tudo manualmente quanto se quiser que o IDE gere grandes trechos de código para você.
Criando um pacote Java e um arquivo de origem Java
- Na janela Projetos, expanda o nó Pacotes de códigos-fonte. Observe que o nó Pacotes de fontes contém somente um nó de pacote padrão vazio.
- Clique com o botão direito do mouse no nó Pacotes de fontes e escolha Novo > Classe Java. Indique NameHandler na caixa de texto Nome da classe e digite org.mypackage.hello na lista suspensa Pacote. Clique em Terminar. Observe que o novo arquivo NameHandler.java se abre no editor de código-fonte.
- No Editor de código-fonte, declare uma variável String digitando a linha seguinte diretamente abaixo da declaração da classe.
String name;
- Adicione o construtor seguinte à classe
public NameHandler()
- Adicione a linha seguinte no construtor NameHandler():
name = null;
Gerando os métodos "getter" e "setter"
- Clique com o botão direito do mouse no campo name no editor de código-fonte e escolha Refatorar > Encapsular campos. A caixa de diálogo Encapsular campos se abre, listando o campo name. Observe que a Visibilidade do campo é definida por padrão como privada, e a Visibilidade do assessor como pública, indicando que o modificador de acesso da declaração da variável da classe será especificado como privado, enquanto os métodos getter e setter serão gerados com os modificadores public e private, respectivamente.
- Clique em Refatorar. Os métodos getter e setter são gerados para o campo name. O modificador da variável de classe é definido como private enquanto os métodos getter e setter são gerados com modificadores públicos. A classe Java agora deveria ser semelhante a.
package org.mypackage.hello;
/**
*
* @author nbuser
*/
public class NameHandler {
private String name;
/** Creates a new instance of NameHandler */
public NameHandler() {
name = null;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
}
Editando o arquivo JavaServer Pages padrão
- Focalize novamente o arquivo index.jsp, clicando em sua aba exibida na parte superior do editor de código-fonte.
Na Paleta (Ctrl-Shift-8) localizada à direita do editor de código-fonte, expanda Formulários HTML e arraste um item Formulário para um ponto após as marcas <h1> no editor de código-fonte.
A caixa de diálogo Inserir formulário é exibida.
- Especifique os seguintes valores:
- Ação: response.jsp
- Método: GET
- Nome: Formulário de entrada de nome
Clique em OK. Um formulário HTML é adicionado ao arquivo index.jsp.
- Arraste um item Entrada de texto para um ponto antes da marca </form>, em seguida, especifique os seguintes valores:
Clique em OK. Uma marca HTML <input> é adicionada entre as marcas <form>.
- Arraste um item Botão para antes da marca </form>. Especifique os seguintes valores:
Clique em OK. Um botão HTML é adicionado entre as marcas <form>.
- Digite Indique seu nome: antes da primeira marca <input>, em seguida, altere o texto padrão Hello World! entre as marcas <h1> para Entry Form.
- Clique com o botão direito do mouse no Editor de código-fonte e escolha Formatar (Alt-Shift-F) para aprimorar o formato do seu código. Seu arquivo index.jsp agora deve parecer semelhante ao seguinte:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSP Page</title>
</head>
<body>
<h1>Entry Form</h1>
<form name="Name Input Form" action="response.jsp">
Enter your name:
<input type="text" name="name" />
<input type="submit" value="OK" />
</form>
</body>
</html>
Criando um arquivo JavaServer Pages
- Na janela Projetos, clique com o botão direito do mouse no nó do projeto HelloWeb e escolha Novo > JSP. O assistente para Novo arquivo JSF se abre. Chame o arquivo de response e clique em Terminar. Observe que um nó do arquivo response.jsp é exibido na janela Projetos abaixo de index.jsp, e o novo arquivo ser abre no editor de código-fonte.
-
Na Paleta à direita do editor de código-fonte, expanda JSP e arraste um item Usar bean para baixo da marca <body> no editor de código-fonte. A caixa de diálogo Inserir usar bean aparece. Especifique os valores mostrados na figura seguinte.
- ID: mybean
- Classe: org.mypackage.hello.NameHandler
- Escopo: sessão
Clique em OK. Observe que a marca <jsp:useBean> é adicionada abaixo da marca <body>.
- Arraste um item Definir propriedade do bean da paleta para um ponto antes da marca <h1> e clique em OK. Na marca <jsp:setProperty> que aparece, exclua o atributo value vazio e edite da seguinte forma. Exclua o atributo value = "" se o IDE o tiver criado! Do contrário, ele substitui o valor de name indicado em index.jsp.
<jsp:setProperty name="mybean" property="name" />
Como indicado na documentação de <jsp:setProperty>, você pode definir um valor de propriedade de várias formas. Nesse caso, a entrada do usuário que vem de index.jsp se torna um par nome/valor que é passado para o objeto request. Quando você define uma propriedade usando a marca <jsp:setProperty>, pode especificar o valor de acordo com o nome de uma propriedade contida no objeto request. Portanto, definindo property como name, você pode recuperar o valor especificado pela entrada do usuário.
- Altere o texto entre as marcas <h1> de forma que ele tenha a seguinte aparência:
<h1>Hello, !</h1>
- Arraste um item Obter propriedade do bean da Paleta e solte-o depois da vírgula entre as marcas <h1>. Especifique os valores seguintes na caixa de diálogo Inserir obter bean:
- Nome do bean: mybean
- Nome da propriedade: name
Clique em OK. Observe que a marca <jsp:getProperty> agora está adicionada entre as marcas <h1>.
- Clique com o botão direito do mouse no Editor de código-fonte e escolha Formatar (Alt-Shift-F) para aprimorar o formato do seu código. As marcas <body> do seu arquivo response.jsp agora deve parecer semelhante ao seguinte:
<body>
<jsp:useBean id="mybean" scope="session" class="org.mypackage.hello.NameHandler" />
<jsp:setProperty name="mybean" property="name" />
<h1>Hello, <jsp:getProperty name="mybean" property="name" />!</h1>
</body>
Executando um projeto de aplicação Web
O IDE utiliza um script de construção Ant para construir e executar aplicações Web. O IDE gera o script de construção baseado nas opções que você especifica no assistente para Novo projeto, assim como aquelas da caixa de diálogo Propriedades do projeto (na janela Projetos, escolha Propriedades no menu do botão direito do mouse do nó do projeto).
Na janela Projetos, clique com o botão direito do mouse no nó do projeto HelloWeb e escolha Executar (F6).
Observação: Por padrão, o projeto foi criado com o recurso Compilar ao salvar ativado, assim, não é necessário compilar o código primeiro para executar a aplicação no IDE. Para obter mais informações sobre o recurso Compilar ao salvar, consulte a seção Compilar ao salvar no guia Criando, importando e configurando projetos Java.
A página index.jsp se abre no navegador padrão
Indique seu nome na caixa de texto e clique em OK. A página response.jsp é exibida, dando uma simples saudação.
Solução de problemas
Construímos e executamos o projeto. Quando clico no botão OK do index.jsp, é exibida uma página de erro indicando que response.jsp não está disponível.
Você está usando o JDK versão 5 ou superior? Escolha Ajuda > Sobre no menu principal para verificar a versão do JDK que o IDE está usando. Você está usando Tomcat versão 5.x ou superior? Escolha Ferramentas > Servidores no menu principal. Selecione o servidor que o projeto usa e observe a entrada de Tipo de servidor próxima da parte superior da caixa de diálogo. Você também pode tentar baixar o projeto de amostra e compará-lo com seu próprio.
Construí e executei o projeto, mas não aparece nenhum nome, aparece somente "Hello, !"
A sua marca <jsp:setProperty> contém um atributo value = ""? Isso substitui o valor que você indicou no formulário index.jsp por uma string vazia. Exclua o atributo value.
Consulte também
Isso conclui o tutorial Introdução ao desenvolvimento de aplicações Web. Este documento demonstrou como criar uma aplicação Web simples usando o NetBeans IDE, implante-a em um servidor e veja a sua apresentação em um navegador. Ele também mostrou como usar JavaServer Pages e JavaBeans em sua aplicação para coletar, manter e relatar dados do usuário.
Para obter mais informações relacionadas e avançadas sobre o desenvolvimento de aplicações Web no NetBeans IDE , consulte os seguintes recursos:
