corner imagecorner image
FeaturesPluginsDocs & SupportCommunityPartners

Introdução ao Desenvolvimento de Aplicações Web

Este documento mostra os passos básicos do uso da IDE NetBeans 5.5 para desenvolver aplicações web. Este documento foi feito de maneira a guiá-lo o mais rápido possível. Para maiores informações sobre como trabalhar com a IDE NetBeans, veja a página de suporte e documentos no website do NetBeans.

Você irá criar, implantar e executar uma simples aplicação web. A aplicação usará uma página JSP (JavaServer Pages™) onde você deve informar o seu nome. Usará um componente JavaBeans™ para persistir o nome durante a sessão HTTP e repitirá o nome em outra página JSP.

Preparando um projeto de aplicação web

Antes de você começar a escrever algum código, terá que ter certeza de que todo o software necessário se encontra instalado e também que o projeto está definido corretamente.

Instalando o Software

Antes de você começar, você precisa instalar os seguintes softwares em seu computador:

Opcionalmente, você poderá fazer o download e usar o servidor de aplicações Sun Java System (SJS) (download), JBoss, ou WebLogic. Entretanto, o servidor web Tomcat, que já vem incluído na IDE, provê todo o suporte necessário para aplicações web "two-tier", assim como descrito neste guia. Um servidor de aplicações (tal como o SJS, JBoss, ou WebLogic) somente é necessário quando você for desenvolver aplicações empresariais (Java EE).

Registrando o servidor na IDE

O servidor web Tomcat fornecido juntamente com a IDE já está automaticamente registrado. Entretanto, antes de você poder implantar as aplicações no SJS, JBoss, ou WebLogic, você deve registrar uma instância local na IDE. Se você instalou a IDE NetBeans 5.5 + o servidor de aplicações SJS, uma instancia local dele estará registrada automaticamente. caso contrário, siga os passos a seguir:

  1. Escolha Ferramentas > Gerênciador de Servidores, a partir da janela principal.
  2. Clique em Adicionar Servidor. Selecione o servidor e dê um nome para a instância. Então clique em Próximo.
  3. Especifique as informações do servidor, a localização da instância local do servidor de aplicações, e o domínio em que deseja implantar as aplicações.

Criando um novo projeto de aplicação web

  1. Escolha Arquivo > Novo Projeto. Em Categorias, escolha Web. Em Projetos, escolha Aplicação Web e clique em Próximo.
  2. Em nome do Projeto, informe HelloWeb. Repare que o contexto é /HelloWeb.
  3. Altere a Localização do Projeto para qualquer diretório em seu computador. A partir de agora, este diretório será chamado como $PROJECTHOME.
  4. Selecione as recomendações que sua estrutura de código deverá seguir, isso é puramente uma preferência pessoal:
  5. Selecione o Servidor onde você irá implantar sua aplicação. Somente os servidores registrados com a IDE são listados.
  6. Deixe a caixa de seleção Definir como projeto Principal marcada. Clique em Finalizar.

    A IDE cria a pasta do projeto $PROJECTHOME/HelloWeb. A pasta do projeto contêm todos os seus códigos e metadados, assim como o script Ant de construção do projeto. O projeto HelloWeb está aberto na IDE. Você pode ver sua estrutura lógica na janela Projetos e sua estrutura de arquivos na janela Arquivos.

Criando e editando arquivos na aplicação web

Criar e editar arquivos é uma das funções mais importantes que a IDE disponibiliza. Afinal, provavelmente é nisso que você gastará a maior parte do seu dia. A IDE oferece uma grande quantidades de ferramentas que podem integrar o estilo pessoal de qualquer desenvolvedor, quer você queira codificar tudo manualmente ou queira que a IDE gere uma grande parte do código para você.

Criando um pacote Java e um arquivo Java

  1. Expanda o nó Pacotes de código-fonte. Note que no nó Pacotes de código-fonte há somente um nó pacote padrão vazio.
  2. Clique com o botão direito no nó Pacotes de código-fonte e escolha Novo > Classe Java. Digite NameHandler no campo Nome da Classe e digite org.me.hello no campo Pacote. Clique em Finalizar.
  3. No editor de código, declare um campo digitando a seguinte linha diretamente abaixo da declaração da classe:
        String name;
  4. Adicione a seguinte linha no método construtor nameHandler():
        name = null;

Gerando os métodos Getter e Setter

  1. Clique com o botão direito na palavra name na declaração do campo no início da classe e escolha Refatorar > Encapsular Campos. Clique em Próximo para executar o comando com as opções padrão.
  2. Clique em Refatorar. Os métodos getter e setter são gerados para o campo name e seu nível de acesso é trocado para private. Agora a classe Java deve ser similar a isso:
    package org.me.hello;
    
    /**
     *
     * @author marcos.junqueira
     */
    public class NameHandler {
    
        private String name;
    
        /** Creates a new instance of NameHandler */
        public NameHandler() {
            setName(null);
        }
    
        public String getName() {
            return name;
        }
    
        public void setName(String name) {
            this.name = name;
        }
    
    }

Editando o arquivo JSP padrão

  1. Expanda o nó do projeto HelloWeb e o nó Páginas Web. Note que a IDE tinha criado uma página JSP padrão para você, a index.jsp. Quando você criou o projeto, a IDE abriu o arquivo index.jsp no editor de códigos.
  2. Selecione o index.jsp na aba do editor de códigos. Agora o arquivo index.jsp está visível no editor de códigos.
  3. Na Paleta ao lado direito do editor de códigos, expanda Formulários HTML e arraste um item Formulário abaixo da tag <h1> no editor de códigos. A caixa de diálogo Inserir Formulário aparece:

    Palette

    Forneça os seguintes valores:

    • Ação: response.jsp
    • Método: GET
    • Nome: Name Input Form

    Clique em OK. O formulário é adicionado ao arquivo index.jsp.

  4. Arraste um item de Entrada de Texto exatamente antes da tag </form>.

    Forneça os seguintes valores:

    • Nome: name
    • Tipo: texto

    Clique em OK. A Entrada de texto é adicionada entre as tags <form>.

  5. Arraste um item Botão exatamente antes da tag </form>.

    Forneça os seguintes valores:

    • Rótulo: OK
    • Tipo: enviar

    Clique em OK. O Botãoo é adicionado entre as tags <form>.

  6. Digite Informe o seu nome: em frente da tag <input> e altere o texto entre as tags <h1> para Formulário de entrada.

    Agora as tags entre as tags <body> parecem com o seguinte:

  7. <h1>Formulário de entrada</h1>
    <form name="Name Input Form" action="response.jsp">
    Informe o seu nome:<input type="text" name="name" value="" />
    <input type="submit" value="OK" />
    </form>

Criando um arquivo JSP

  1. Expanda o nó do projeto HelloWeb e o nó Páginas Web.
  2. Clique com o botão direito no nó Páginas Web e escolha Novo > JSP, Nomeie o arquivo JSP como response, e clique em Finalizar.

    O novo arquivo response.jsp é aberto no editor de códigos.

  3. Na paleta ao lado direito do editor de códigos, expanda JSP e arraste um item Utilizar Bean logo abaixo da tag <body> no editor de códigos.

    Forneça os seguintes valores:

    • ID: mybean
    • Classe: org.me.hello.NameHandler
    • Escopo: session

    Clique em OK. A tag Utilizar Beans é adicionada abaixo da tag <body>.

  4. Adicione um item Obter Propriedade do Beans e um item Definir Propriedade do Bean da paleta. Então mude o código de modo que as tags entre as tags <body> se pareçam como a seguir:
  5. <jsp:useBean id="mybean" scope="session" class="org.me.hello.NameHandler" />
    <jsp:setProperty name="mybean" property="*" />

    <h1>Olá, <jsp:getProperty name="mybean" property="name" />!</h1>

Construindo e executando um projeto de aplicação web

A IDE usa um script Ant para construir e executar suas aplicações web. A IDE gera o script baseando-se nas opções que você fornece no assistente de Novo Projeto e na caixa de diálogo Propriedades do Projeto.

  1. Escolhar Executar > Executar Projeto Principal (F6).

    A IDE irá construir a aplicação web e implantá-la, usando o servidor que você especificou quando criou o projeto.

  2. Informe o seu nome na caixa de texto da sua página index.jsp:

    Palette

    Clique em OK. A página response.jsp deve abrir e cumprimentá-lo:

    Palette



Próximos passos

Para maiores informações sobre desenvolvimento de aplicações web na IDE NetBeans 5.5, veja os itens a seguir:

Para enviar comentários e sugestões, obter suporte e manter-se impormado das últimas novidades de desenvolvimento Java EE da IDE NetBeans, junte-se à lista de e-mail Para maiores informações sobre o que está por vir no desenvolvimento Java EE na IDE NetBeans, veja http://j2ee.netbeans.org/.

Bookmark this page

del.icio.us furl simpy slashdot technorati digg
Companion
Projects:
MySQL Database Server   GlassFish Community: an Open Source Application Server   Open Solaris  Open JDK: an Open SourceJDK   Mobile & Embedded Community     Sponsored by 
Sponsored by Sun Microsystems