Desenvolvendo uma aplicação web de forma fácil e prática – 4ª parte

Para você que está chegando agora a este blog, saiba que estamos construindo uma aplicação web em uma seqüência de postagens (parte 1, parte 2 e parte 3) e, neste momento, construiremos o componente Web (veja arquitetura definida na parte 1) que irá “apresentar” o nosso sistema ao usuário.

Vá no menu Arquivo (File), Novo Projeto (New Project). Escolha a categoria Web e o tipo de projeto Aplicação Web (Web Application); clique no botão Avançar (Next). Dê o nome JavaBahiaWeb para o projeto, escolha a localização dele no seu computador e clique no botão Avançar (Next). Você agora terá que escolher o Servidor (Server) em que funcionará o sistema. Como o nosso sistema é simples, ele deverá funcionar em um container web simples como o Tomcat. Se não houver nenhum servidor listado nesta tela, você terá que adicioná-lo clicando no botão Adicionar (Add). No campo Caminho do Contexto (Context Path) escreva '/javabahia' (não esqueça da barra) e clique no botão Avançar (Next). Finalmente, marque o framework Visual Web JavaServer Faces, escreva no campo Pacote Java Padrão (Default Java Package) o valor 'javabahia.web' (não esqueça o ponto), e clique no botão Finalizar (Finish). O Netbeans abrirá para você o código da primeira página criada: Page1.jsp.

Clique com o botão direito do mouse no projeto recém criado, e escolha Propriedades (Properties). Selecione a categoria (categories) Bibliotecas (Libraries); clique no botão Adicionar Biblioteca (Add Library). Escolha a biblioteca que criamos na parte 2 (Hibernate) e clique em OK. Clique no botão Adicionar Projeto (Add Project), escolha o projeto JavaBahiaApp e clique no botão Adicionar JAR do Projeto(Add Project JAR Files). Por fim, clique no botão OK da janela de propriedades do projeto.

Neste post, iremos criar a tela de autenticação do usuário para acessar o sistema. Para isso, vamos renomear a página que foi automaticamente criada – Page1.jsp – para PageLogin.jsp. Clique com o botão direito do mouse em cima do arquivo Page1.jsp, clique em Refatorar (Refactor), depois em Renomear (Rename). Digite o novo nome no campo Novo Nome (New Name) e depois clique em Refatorar (Refactor).

Agora, crie a tela conforme a imagem abaixo, e configurando as propriedades dos componentes da tela de acordo com a tabela a seguir.


-------------------------------------------------------------------------------------
Tipo ! Id ! Propriedades ! Observações
GridPanel ! panelCampos ! {columns:2} ! ---
TextField ! txtLogin ! --- ! Coloque dentro de panelCampos.
Label ! lblLogin ! {for:txtLogin, text:Login} ! Coloque dentro de panelCampos.
PasswordField ! txtSenha ! --- ! Coloque dentro de panelCampos.
Label ! lblSenha ! {for:txtSenha, text:Senha} ! Coloque dentro de panelCampos.
GridPanel ! panelBotoes ! {columns:2} ! ---
Button ! btnAcessar ! {text:Acessar} ! Coloque dentro de panelBotoes.
Button ! btnLimpar ! {text:Limpar} ! Coloque dentro de panelBotoes.
MessageGroup ! grpMsg ! --- ! ---
-------------------------------------------------------------------------------------

Procure no pacote 'javabahia.web' a classe SessionBean1.java, e abra-a no editor de código do Netbeans. Digite, bem abaixo da seção Definição de Componentes Gerenciados (Managed Component Definitions), a seguinte linha:

private Usuario usuarioLogado;

Clique com o botão direito do mouse no código e clique em Corrigir Imports (Fix Imports) para o Netbeans fazer a importação da classe javabahia.entidade.Usuario. Clique novamente com o botão direito e escolha Refatorar (Refactor), Encapsular Campos (Encapsulate Fields). Marque para criar o get e o set, e clique em Refatorar (Refactor).

Agora, procure no pacote 'javabahia.web' a classe RequestBean1.java, e abra-a no editor de código do Netbeans. Digite, bem abaixo da seção Definição de Componentes Gerenciados (Managed Component Definitions), a seguinte linha:

private Usuario usuario;

Clique com o botão direito do mouse no código e clique em Corrigir Imports (Fix Imports) para o Netbeans fazer a importação da classe javabahia.entidade.Usuario. Clique novamente com o botão direito e escolha Refatorar (Refactor), Encapsular Campos (Encapsulate Fields). Marque para criar o get e o set, e clique em Refatorar (Refactor).

Digite, dentro do método init(), bem abaixo da seção Inicialização de Componentes Gerenciados (Managed Component Initialization), a seguinte linha:

setUsuario(new Usuario());

Volte à página PageLogin.jsp, com o editor visual aberto (design). Clique com o botão direito do mouse em cima do campo de texto txtLogin, e clique em Associar a Dado (Bind To Data). Clique na aba Associar a um Objeto (Bind to an Object), e selecione a propriedade login do objeto Usuario que está dentro do objeto RequestBean1. Clique em OK para finalizar a associação.

Clique com o botão direito do mouse em cima do campo de texto txtSenha, e clique em Associar a Dado (Bind To Data). Clique na aba Associar a um Objeto (Bind to an Object), e selecione a propriedade senha do objeto Usuario que está dentro do objeto RequestBean1. Clique em OK para finalizar a associação.

Clique com o botão direito do mouse em cima do projeto JavaBahiaWeb, e selecione Novo (New), Página JSF da Web Visual (Visual Web JSF Page). Digite PagePrincipal no campo Nome do Arquivo (File Name) e clique em Finalizar (Finish). Abra o arquivo faces-config.xml na seção Arquivos de Configuração (Configuration Files) e o Netbeans lhe exibirá as páginas até o momento criadas. Clique em cima de btnAcessar, dentro de PageLogin.jsp, e arraste o mouse até PagePrincipal.jsp, soltando-o. Clique em cima da linha desenhada para selecioná-la, pressione as teclas Control+R, e renomeie case1 para acessoLiberado, conforme mostra a figura abaixo.

Falta ainda criar o evento que será disparado quando o usuário clicar no botão para entrar no sistema. Clique com o botão direito do mouse em cima do botão btnAcessar e clique em Manipulador do Evento da Ação (Edit Action Event Handler). O Netbeans abrirá automaticamente o editor de código, posicionando o cursor dentro de um método recém-criado. Esse método executará o que deverá ser feito para processar a ação do usuário. Digite o seguinte código:

public String btnAcessar_action() {
JavaBahiaFacade facade = new JavaBahiaFacade();
Usuario uReq = getRequestBean1().getUsuario();
Usuario usuario = facade.obterUsuarioPorLoginSenha(uReq.getLogin(), uReq.getSenha()); if (usuario != null) {
getSessionBean1().setUsuarioLogado(usuario);
} else {
error("Não foi possível encontrar o usuário a partir do login/senha informado(s).");
}
return "acessoLiberado";
}

Volte ao editor visual da página PageLogin.jsp (clique no botão Design no topo da janela de código), clique com o botão direito do mouse em cima do botão btnLimpar e clique em Manipulador do Evento da Ação (Edit Action Event Handler). Digite o seguinte código:

public String btnLimpar_action() {
getRequestBean1().setUsuario(new Usuario());
return null;
}

Antes de acessarmos a nossa aplicação, teremos que inserir um registro na tabela Usuario do banco de dados.

INSERT INTO usuario VALUES('teste','teste','Usuário de Teste','teste@javabahia.dev.java.net');

Para os usuários mais avançados, já podem executar esse código, usando o Tomcat, e testar a autenticação. Aos usuários iniciantes, tenham um pouco de calma pois está chegando o grande final. No próximo post, mostrarei como executar esse código e terminaremos de construir nossa aplicação, criando as telas de interface para as entidades Empresa e Contrato. Até lá!