Kit Iniciante de Aplicativo da Web NetBeans 4.0

Leitura recomenda pelo NetBeans!
Este aplicativo da Web é fortemente influenciado pelo excelente livro de Jayson falkner & Kevin R Jones: "Servlets and JSP the J2EE Web Tier."

Se estiver interessado no livro, poderá obtê-lo em
Amazon.com:
http://www.amazon.com/exec/obidos/ASIN/0321136497/102-1831065-4468902

Introdução

Este tutorial pretende guiá-lo através dos conceitos básicos de uso do NetBeans 4.0 para desenvolver um aplicativo da Web de controle de vista de modelo para que você o desenvolva mais. Iremos começar por projetar um objeto POJO como nosso modelo, um conjunto de arquivos de vistas e um controlador. Quando este código estiver terminado, iremos estender o projeto para usar o JDBC para interagir com o armazenador de dados MySQL subjacente.

Download de arquivos e código-fonte


Iniciando


Criando um aplicativo da Web

  1. Escolha Arquivo > Novo projeto. Em Categorias, selecione Web. Em Projetos, selecione aplicativo Web e clique em Próximo.
Wizard2
  1. Em Nome do projeto, insira Netbeans4Tutorial.

Wizard1
  1. Deixe selecionada a caixa de seleção Definir como projeto principal. Observe que o Caminho do contexto é /Netbeans4Tutorial.
  2. Observe que a especificação 2.4 do Servlet está descrita no painel Descrição, e isso é um requisito para nós, porque iremos fazer extenso uso da EL (linguagem de expressão) neste projeto.
  3. Clique em Terminar. O IDE cria a pasta de projeto $PROJECTHOME/Netbeans4Tutorial. A pasta do projeto contém todo o código-fonte e os metadados do projeto, como o script Ant do projeto. O projeto HelloWeb se abre no IDE. Você pode ver a estrutura lógica na janela Projetos e a estrutura de arquivos na janela Arquivos.

Criando nosso Modelo POJO


Criando o modelo

  1. Expanda o nó do projeto e o nó Pacotes de código-fonte. Observe que o nó Pacotes de código-fonte contém somente um nó de pacote padrão vazio.
  2. Clique com o botão direito do mouse no nó Pacotes de código-fonte e escolha Nova > Classe Java.
  3. Insira StarterModel na caixa de texto Nome da classe e insira org.netbeans.starttutorial.model na caixa combo Pacote.
  4. Clique em Terminar.
StarterModel

Adicionando campos e métodos

  1. Agora que o NetBeans gerou um definição de classe vazia para você, é hora de preencher a mesma com alguns nomes de campos.
  2. Digite ou copie estes nomes de campos para seu método.
  3. Clique com o botão direito do mouse nos nomes de campos e selecione Encapsular no menu Refatoração.
  4. private int id;
    private String authour;
    private String summary;
    private String story;
    private String topic;
    private java.sql.Timestamp date;
  5. Deveria se parecer com isso. enable all checkboxes, and press "next >"
encapsulate.jpg

A figura mostra a seleção de todos os campos para gerar os acessadores e mutadores para estes campos.

metodes.jpg


E, finalmente, adicione as declarações de importação e os métodos abaixo em sua classe starterModel para completá-la.
import java.util.ArrayList;
import java.util.List;




public List getpopulateStarterModelArray ()
{

List starterModelarray = new ArrayList ();
StarterModel s =
getModel (1, "Hello World ", "The First part of ", "the tutorial is ", "over",new java.util.Date ());


StarterModel st =
getModel (2, "now ", "it is ", "time to ", "add some more pages ",new java.util.Date ());

StarterModel stu =
getModel (3, "But first we have ", "to discuss", "what actually", "happened here dont you think",new java.util.Date ());

starterModelarray.add (s);
starterModelarray.add (st);
starterModelarray.add (stu);
return starterModelarray;
}

private StarterModel getModel (int a, String b,String c,String d,String e,java.util.Date f )
{
StarterModel sModel = new StarterModel ();
sModel.setId (a);
sModel.setAuthour (b);
sModel.setStory (c);
sModel.setTopic (d);
sModel.setSummary (e);
sModel.setDate (new java.sql.Timestamp (new java.util.Date ().getTime ()));
return sModel;
}

Criando o controlador


Renomeando um campo.

  1. Expanda o nó do projeto e o nó Pacotes de código-fonte. Observe que o nó Pacotes de código-fonte contém somente um nó de pacote padrão vazio.
  2. Clique com o botão direito do mouse no nó Pacotes de código-fonte e escolha Nova > Classe Java.
  3. Insira "FrontControllerFilter" na caixa de texto Nome da classe e insira org.netbeans.starttutorial.model na caixa combo Pacote.
  4. Clique em Terminar.

Gerando os métodos getter e setter

  1. A classe FrontControllerFilter está aqui listada para sua conveniência em copiá-la.
     package org.netbeans.starttutorial.controller;

    import java.io.*;

    import javax.servlet.*;
    import javax.servlet.http.*;
    import org.netbeans.starttutorial.interfaces.PageProcessImplementation;
  2. public class FrontControllerFilter implements Filter
    {
    protected FilterConfig config = null;

    public void init (FilterConfig filterConfig)
    {
    config = filterConfig;
    }

    public void doFilter ( ServletRequest req, ServletResponse res,
    FilterChain chain ) throws IOException, ServletException
    {
    if (!(req instanceof HttpServletRequest))
    {
    throw new ServletException ("Filter requires a HTTP request.");
    }


    HttpServletRequest request = (HttpServletRequest)req;
    HttpServletResponse response = (HttpServletResponse)res;
    String uri = request.getRequestURI ();


    int begin = uri.lastIndexOf ("/")+1;
    int end = uri.lastIndexOf (".");

    String name = "pageholder";
    if (begin < end)
    {
    name = uri.substring (begin, end);
    }

    boolean doFilter = true;

    // try to load and run an implicit MVC control component.
    try
    {
    Object o = Class.forName ("org.netbeans.starttutorial.viewimplementation."+name).newInstance ();
    if (!(o instanceof PageProcessImplementation))
    {
    throw new ServletException ("no interface");
    }

    PageProcessImplementation control = (PageProcessImplementation)o;
    doFilter = control.processPageRequest (request, response);
    }
    catch (ClassNotFoundException e)
    {
    System.out.print ("\nClassNotFoundException \n" + e);
    }
    catch (InstantiationException e)
    {
    System.out.print ("\nInstantiationException \n" + e);
    }
    catch (IllegalAccessException e)
    {
    System.out.print ("\nIllegalAccessException \n" + e);
    }

    if (doFilter)
    {
    chain.doFilter (request, response);
    }
    }

    public void destroy ()
    {
    }
    }

Observe que obtivemos aqui um erro de importação de declaração. Isso é porque nós não criamos ainda esta determinada interface, o que virá a seguir.
error


Crie uma nova classe Java com nome de pacote e nome de classe igual ao abaixo.
package org.netbeans.starttutorial.interfaces;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import javax.servlet.ServletException;


/**
* a public interfaqce for everyone to use
* todays task: See controller to figure out why we use this interface in the first plase
*/
public interface PageProcessImplementation
{
public boolean processPageRequest (HttpServletRequest request,HttpServletResponse response) throws ServletException, IOException;
}

Criando uma página de vista


Edite o arquivo de paginas JavaServer padrão e crie o código por detrás da classe.

  1. Expanda o nó do projeto e o nó Páginas da Web. Observe que o IDE criou um página JavaServer padrão, index.jsp, por você. Nós não iremos usar esta página.
  2. Clique com o botão direito do mouse no nó Páginas da Web e escolha Novo > JSP.
  3. Insira "pageholder" na caixa de texto Nome do arquivo JSP, e insira view no campo Pasta.
  4. Clique em Terminar.
  5. pageholder
  6. Cole ou digite inn para que o arquivo pageholder.jsp se pareça com isso.

    <%@page contentType="text/html"%>
    <%@page pageEncoding="UTF-8"%>

    <%--
    A diretiva taglib abaixo importa a biblioteca JSTL. Caso cancele seu comentário,
    também é necessário adicionar a biblioteca JSTL ao projeto. Nas propriedades do projeto
    Escolha Build -> Compilando código-fonte e use o botão Adicionar biblioteca... para adicionar
    a biblioteca JSTL 1.1.
    --%>

    <%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>


    <html>
    <body>
    <c:forEach var="starterModel" begin="0" items="${arrayofstarterobjects}">
    <c:out value="${starterModel.id}" />
    <br>
    <c:out value="${starterModel.authour}" />
    <c:out value="${starterModel.story}" />
    <c:out value="${starterModel.summary}" />
    <c:out value="${starterModel.topic}" />
    <p>
    </c:forEach>

    Vamos imprimir a data de hoje em:
    <c:forEach var="starterModel" begin="0" end ="0" items="${arrayofstarterobjects}">
    ${starterModel.date}
    </c:forEach>
    </body>
    </html>

  1. Expanda o nó do projeto e o nó Pacotes de código-fonte.
  2. Clique com o botão direito do mouse no nó Páginas da Web e escolha Novo > JSP.
  3. Insira "pageholder" na caixa de texto Nome do arquivo JSP, e insira view no campo Pasta.
  4. Clique em Terminar.

  5. pageholder.jpg
  6. package org.netbeans.starttutorial.viewimplementation;

    import java.io.IOException;
    import javax.servlet.ServletContext;
    import javax.servlet.ServletException;
    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;
    import org.netbeans.starttutorial.controller.*;
    import org.netbeans.starttutorial.model.*;
    import org.netbeans.starttutorial.interfaces.PageProcessImplementation;


    /**
    *
    * @author
    */
    public class pageholder implements PageProcessImplementation
    {
    public boolean processPageRequest (HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException
    {
    ServletContext sc = request.getSession ().getServletContext ();
    try
    {
    StarterModel starterModel = new StarterModel ();

    request.setAttribute ("arrayofstarterobjects", starterModel.getpopulateStarterModelArray ());
    }
    catch(Exception e)
    {
    System.out.print ("Exception in class pageholder");
    }
    return true;
    }
    }

Alterações no arquivo web.xml.

  1. Expanda o nó do projeto e o nó Web-INF.
  2. Clique duas vezes no arquivo web.xml para trazê-lo para o editor.
  3. Cole ou digite inn para que o arquivo web.xml se pareça com isso.
  4.      <?xml version="1.0" encoding="UTF-8"?>
    <web-app xmlns="http://java.sun.com/xml/ns/j2ee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd" version="2.4">
    <filter>
    <filter-name>ControlFilter</filter-name>
    <filter-class>org.netbeans.starttutorial.controller.FrontControllerFilter</filter-class>
    </filter>
    <filter-mapping>
    <filter-name>ControlFilter</filter-name>
    <url-pattern>/view/*</url-pattern>
    </filter-mapping>
    <session-config>
    <session-timeout>30</session-timeout>
    </session-config>
    <welcome-file-list>
    <welcome-file>
    index.html
    </welcome-file>
    <welcome-file>
    index.htm
    </welcome-file>
    <welcome-file>
    view/pageholder.jsp
    </welcome-file>
    </welcome-file-list>
    </web-app>

Compilando e executando o projeto


Adicionando as bibliotecas necessárias.

  • Clique com o botão direito do mouse no nó do projeto e escolha Propriedades.
  • Selecione Build | Compilando código-fonte.
  • Clique em Adicionar biblioteca.
  • Selecione JSTL 1.1 e clique em Adicionar biblioteca.
  • Clique em OK.

  • libs.jpg

Compilando um projeto

  • Escolha Build > Compilar projeto principal (F11). O projeto é compilado.

Executando o projeto principal

  • Selecione Executar > Executar projeto principal (F6) no menu Executar. Clique duas vezes na barra de títulos da janela Saída para maximizá-la para poder ver toda a saída. Observe que o Ant primeiro compila o Netbeans4Tutorial.war, e a seguir compila o Netbeans4Tutorial usando-o. Finalmente, ele implementa o aplicativo Web usando nosso servidor padrão. Clique duas vezes na barra de título da janela Saída para minimizá-la.
  • Selecione a janela Arquivos e expanda o nó de projeto HelloWeb. Os arquivos da classe compilada estão na pasta build. O arquivo WAR compilado está na pasta dist.
  • Pressione F6 para executar o programa novamente. Nada novo precisará ser compilado, mas o programa será executado.

  • run

PARTE 2 - ADICIONANDO UM BANCO DE DADOS


Criando um banco/armazenador/de dados

  1. Você precisa instalar o banco de dados MySQL, caso já não o tenha feito.
  2. Assegure que você tenha baixado o conector mysql jdbc mais recente de: http://dev.mysql.com/downloads/connector/j/3.1.html
  3. Inicie o mysql.
  4. Abra a aba Executável no NetBeans e expanda o nó Bancos de dados e Drivers.
  5. Clique com o botão direito do mouse e selecione Adicionar driver.
  6. Localize seu arquivo mysql_connector.jar e selecione Adicionar.
  7. Termine ao pressionar OK.
  8. Agora, selecione o nó mysql recém criado, e clique com o botão direito do mouse e escolha Conectar usando.
  9. Escolha a conexão mysql que acaba de ser criada.
  10. Insira jdbc:mysql://localhost/ como o URL do banco de dados e forneça seu nome de usuário para o banco de dados, como apropriado. Pressione OK.
  11. Clique com o botão direito do mouse no nó jdbc:mysql/localhost e selecione Executar comando, e insira este comando CREATE DATABASE nbstarterkit e execute-o. Você agora criou seu próprio pequeno banco de dados.
  12. Agora desconecte e exclua o nó mysql.
  13. Repita as etapas 8 a 10, mas use este URL: jdbc:mysql://localhost/nbstarterkit
  14. Execute este comando para criar uma tabela: CREATE TABLE `content` (
      `id` int(11) NOT NULL auto_increment,
      `author` varchar(50) default NULL,
      `summary` text,
      `story` text,
      `topic` varchar(50) default NULL,
      `date` datetime default NULL,
      PRIMARY KEY  (`id`)
    ) TYPE=MyISAM;
  15. e esse para preeenchê-la

    INSERT INTO `content` (`id`,`author`,`summary`,`story`,`topic`,`date`) VALUES ("1","Jan John Jullion-Ceccarelli","This guide is designed to help you transition your applications and IDE settings from NetBeans IDE 3.6 to NetBeans IDE 4.0, and to show you how to be even more productive with the new NetBeans IDE projects system.","This guide is designed to help you transition your applications and IDE settings from NetBeans IDE 3.6 to NetBeans IDE 4.0, and to show you how to be even more productive with the new NetBeans IDE projects system.","NEWS","2005-01-30 21:39:39");

Executando o projeto completo ativado para JDBC

  1. Assegure que o MySQL está instalado e em execução.
  2. Adicione o mysql-connector.jar em seu projeto.
  3. Selecione Executar > Executar projeto principal (F6) no menu Executar. Clique duas vezes na barra de títulos da janela Saída para maximizá-la para poder ver toda a saída. Observe que o Ant primeiro compila o Netbeans4Tutorial.war, e a seguir compila o Netbeans4Tutorial usando-o. Finalmente, ele implementa o aplicativo Web usando nosso servidor padrão. Clique duas vezes na barra de título da janela Saída para minimizá-la.
  4. Selecione a janela Arquivos e expanda o nó de projeto HelloWeb. Os arquivos da classe compilada estão na pasta build. O arquivo WAR compilado está na pasta dist.
  5. Pressione F6 para executar o programa novamente. Nada novo precisará ser compilado, mas o programa será executado.
final.jpg