PrimeFaces: Criando um sistema de leilão de veículos em Java

Veja neste artigo quais são as novidades do PrimeFaces 5 e aprenda a desenvolver um sistema de leilão de veículos em Java com o framework Primefaces.

Fique por dentro
A plataforma Java EE 7 tem obtido grande sucesso entre os desenvolvedores. Por este motivo, aprender a utilizar os recursos fornecidos por diversos frameworks derivados das especificações desta é extremamente aconselhado para quem deseja trabalhar com aplicações web. Neste artigo veremos quatro dos frameworks que compõem essa plataforma (JPA 2.1, CDI 1.1, JSF 2.2 e EJB 3.2) e os combinaremos com o recém-lançado PrimeFaces 5 para a elaboração de telas com componentes modernos e visualmente agradáveis durante a implementação de um pequeno sistema de leilão de veículos.

Atualmente, se uma equipe de desenvolvimento de sistemas receber a missão de implementar uma nova aplicação web em Java, existe uma grande possibilidade do responsável pela definição da arquitetura optar pelo JSF como o framework MVC do projeto. É claro que a decisão levará em conta vários fatores, mas se esta for realmente a escolha, certamente a preferência será motivada por questões como a popularidade da biblioteca e o fato de ela pertencer à especificação Java EE.

A decisão pelo JavaServer Faces, entretanto, não é a única a ser tomada antes de iniciar a implementação. No que diz respeito à elaboração da camada de visão, é provável que alguma biblioteca de interface rica como RichFaces, ICEfaces ou PrimeFaces também seja adicionada ao projeto. Esta constatação existe por conta de algumas limitações do JSF, como:

Neste contexto, frameworks RIA, como os comentados anteriormente, surgiram logo após o lançamento das versões iniciais do JSF e trouxeram algumas vantagens, como uma experiência visual mais agradável para o usuário, a possibilidade de executar processamento assíncrono, diminuição no tráfego de rede – uma vez que a client engine pode efetuar processamento no lado do cliente –, redução da complexidade da aplicação, entre outras.

Para conhecermos de forma mais aprofundada um destes frameworks, este artigo explorará o PrimeFaces 5, lançado recentemente pela PrimeTek e que tem se firmado como a biblioteca RIA para JSF mais popular do mercado. Como veremos, novos componentes foram lançados nesta versão, além de várias melhorias terem sido implementadas em tags já existentes. A mais significativa delas talvez tenha sido a remodelagem do PrimeFaces Push, que agora está baseado no Atmosphere, considerado o framework para desenvolvimento assíncrono mais popular do Java. Entre as vantagens da nova implementação do Push estão o desenvolvimento dos sistemas baseado no uso de anotações, suporte a WebSockets e até mesmo integração com serviços em nuvem.

Dito isso, nesta primeira parte do artigo iremos conhecer os principais recursos do PrimeFaces através do início do desenvolvimento de um pequeno sistema de venda de veículos na modalidade leilão, no qual o usuário pode também dar sua opinião sobre os modelos de carros cadastrados.

O PrimeFaces 5

Em 2008, a PrimeTek, empresa de origem turca, especializada em desenvolvimento ágil, treinamento e consultoria Java EE, lançou no mercado uma biblioteca de componentes RIA chamada PrimeFaces. O framework foi criado pelo consultor Ҫağatay Ҫivici, autor/revisor de vários livros envolvendo desenvolvimento Java Web e JSF, e membro do JavaServer Faces Expert Group e do projeto Apache MyFaces. Contando com uma comunidade bastante ativa, o projeto possui código aberto e uma página de demonstração de dar inveja aos concorrentes.

Embora a maior parte dos desenvolvedores utilize a versão gratuita da biblioteca, existem ainda dois planos de suporte diferenciados:

Na versão 5.0, lançada recentemente, o framework apresentou algumas novidades, a saber:

No que diz respeito a componentes já existentes, também houve melhorias. Algumas delas são:

Criando a aplicação

Como exemplo, criaremos um pequeno sistema de venda de veículos para demonstrar os principais componentes e recursos do PrimeFaces 5. Além do framework RIA, a arquitetura do nosso sistema terá ainda a injeção de dependências feita pelo CDI 1.1, o acesso ao banco se dará através da JPA 2.1, a camada de negócio envolverá EJB 3.2, o papel de controller caberá ao JSF 2.2, e o Facelets será utilizado para geração de templates na aplicação, evitando que dupliquemos código em nossas páginas.

O ambiente requerido para criar o sistema envolverá os softwares listados a seguir, que precisam estar instalados na máquina em que a implementação dos exemplos deste artigo será feita (se necessário, confira a seção Links no final do artigo para saber onde baixá-los):

Após estarmos com todos os softwares configurados na máquina, vamos criar o projeto Maven. Para isso, na view Project Explorer do Eclipse, clique com o botão direito, selecione New e clique em Other.

Na tela que surge, selecione Maven e depois clique em Maven Project. Marque a opção Create a simple Project (skip archetype selection) e clique em Next. Neste passo, informe no campo Group Id o valor “br.com.javamagazine”, no Artifact Id o valor “leilaojm”, no Packaging o valor “war” e no Name o valor “leilaojm”. Em seguida, clique em Finish.

Logo após, vamos configurar nosso projeto para utilizar o JSF 2.2 e informar alguns parâmetros adicionais para a aplicação rodar corretamente. Assim, clique com o botão direito em cima da raiz do projeto, e depois na opção Properties. Na tela que surge, clique em Project Facets. No item Dynamic Web Module, selecione a versão 3.1 para trabalharmos com a versão mais recente da API de Servlets. No item Java, selecione a opção 1.7 e marque o item abaixo, JavaServer Faces, selecionando posteriormente a versão 2.2 do framework. Mais abaixo, surgirá a mensagem Further configuration available informando que é preciso confirmar alguns parâmetros do JSF. Clique nela e informe as seguintes configurações para o funcionamento da aplicação: em JSF Implementation Library, deixe marcado Disable Library Configuration; no campo URL Mapping Patterns, clique em cima da opção existente (/faces/*) e depois no botão Remove. Feito isso, clique no botão Add e no popup que aparece, informe “*.xhtml”. Então, clique em OK na primeira tela, em OK na segunda e novamente em OK na terceira para confirmar as mudanças.

Embora tenhamos informado o uso da versão 3.1 da API de Servlets no item Project Facets, precisamos configurar este parâmetro no web.xml. Aproveitaremos a edição do arquivo para determinar qual é a página inicial do sistema. Para realizar estas alterações, abra o XML mencionado, que se encontra na pasta src/main/webapp/WEB-INF, e informe o código presente na Listagem 1.

01 <?xml version="1.0" encoding="UTF-8"?> 02 <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 03 xmlns="http://xmlns.jcp.org/xml/ns/javaee" 04 xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd" id="WebApp_ID" version="3.1"> 05 06 <display-name>leilaojm</display-name> 07 08 <welcome-file-list> 09 <welcome-file>index.xhtml</welcome-file> 10 </welcome-file-list> 11 12 <servlet> 13 <servlet-name>Faces Servlet</servlet-name> 14 <servlet-class>javax.faces.webapp.FacesServlet</servlet-class> 15 <load-on-startup>1</load-on-startup> 16 </servlet> 17 <servlet-mapping> 18 <servlet-name>Faces Servlet</servlet-name> 19 <url-pattern>*.xhtml</url-pattern> 20 </servlet-mapping> 21 </web-app>
Listagem 1. Código do arquivo web.xml

Modificando o pom.xml

Chegamos ao ponto em que é necessário configurar as bibliotecas utilizadas pelo projeto no arquivo pom.xml. Deste modo, abra o XML e selecione a aba pom.xml para editar o código fonte, que deve ficar semelhante ao da Listagem 2.

01 <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 02 xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"> 03 <modelVersion>4.0.0</modelVersion> 04 05 <groupId>br.com.javamagazine</groupId> 06 <artifactId>leilaojm</artifactId> 07 <version>0.0.1-SNAPSHOT</version> 08 <packaging>war</packaging> 09 10 <name>leilaojm</name> 11 12 <build> 13 <plugins> 14 <plugin> 15 <artifactId>maven-compiler-plugin</artifactId> 16 <version>2.0.2</version> 17 <configuration> 18 <source>1.7</source> 19 <target>1.7</target> 20 </configuration> 21 </plugin> 22 </plugins> 23 </build> 24 25 <dependencies> 26 <!-- Bibliotecas Java EE 7 que já estão no Wildfly, incluindo o JSF 2.2 --> 27 <dependency> 28 <groupId>javax</groupId> 29 <artifactId>javaee-api</artifactId> 30 <version>7.0</version> 31 <scope>provided</scope> 32 </dependency> 33 34 <dependency> 35 <groupId>org.primefaces</groupId> 36 <artifactId>primefaces</artifactId> 37 <version>5.0</version> 38 </dependency> 39 40 <dependency> 41 <groupId>org.apache.myfaces.tomahawk</groupId> 42 <artifactId>tomahawk21</artifactId> 43 <version>1.1.14</version> 44 </dependency> 45 </dependencies> 46 </project>
Listagem 2. Código do arquivo pom.xml

As principais configurações apresentadas são as seguintes:

Após modificar o pom.xml, vamos atualizar as dependências do Maven no sistema. Para realizar esse procedimento, clique com o botão direito em cima da raiz do projeto, selecione Maven e clique em Update Project. Na tela que surge, clique em OK e aguarde alguns segundos para que o Eclipse realize o processo.

Configurando o banco de dados e o datasource

Com o PostgreSQL rodando, crie uma base de dados chamada leilaojm e rode o script da Listagem 3 para gerar as tabelas e colocar algumas informações nelas com o objetivo de já termos como realizar algumas operações no sistema sem que precisemos cadastrar dados (as linhas com os inserts foram omitidas e podem ser encontradas no arquivo completo que está na pasta src/main/resources do código-fonte que você pode baixar).

CREATE SEQUENCE anuncio_id_seq INCREMENT BY 1; CREATE SEQUENCE avaliacao_id_seq INCREMENT BY 1; CREATE SEQUENCE imagem_anuncio_id_seq INCREMENT BY 1; CREATE SEQUENCE modelo_id_seq INCREMENT BY 1; CREATE TABLE "anuncio"( id INTEGER DEFAULT nextval('anuncio_id_seq') NOT NULL, id_modelo INTEGER NOT NULL, titulo VARCHAR(200) NULL, descricao TEXT NOT NULL, anomodelo INTEGER NOT NULL, anofabricacao INTEGER NOT NULL, uf CHAR(2) NULL, cidade VARCHAR(60) NULL, precofixo BOOL NOT NULL, valor DOUBLE PRECISION NULL, valorlanceatual DOUBLE PRECISION NULL, vendido BOOL NOT NULL, PRIMARY KEY (id)); CREATE TABLE "avaliacao"( id INTEGER DEFAULT nextval('avaliacao_id_seq') NOT NULL, id_modelo INTEGER NOT NULL, nome VARCHAR(100) NOT NULL, texto TEXT NOT NULL, PRIMARY KEY (id)); CREATE TABLE "imagem_anuncio"( id INTEGER DEFAULT nextval('imagem_anuncio_id_seq') NOT NULL, id_anuncio INTEGER NOT NULL, nome VARCHAR(45) NOT NULL, PRIMARY KEY (id)); CREATE TABLE "marca"( id INTEGER NOT NULL, nome VARCHAR(45) NOT NULL, imagem VARCHAR(20) NULL, PRIMARY KEY (id)); CREATE TABLE "modelo"( id INTEGER DEFAULT nextval('modelo_id_seq') NOT NULL, id_marca INTEGER NOT NULL, nome VARCHAR(30) NOT NULL, motorizacao VARCHAR(20) NULL, datalancamento DATE NULL, qtdpassageiros INTEGER NULL, linkvideo VARCHAR(120) NULL, PRIMARY KEY (id)); ALTER TABLE "anuncio" ADD CONSTRAINT anuncio_modelo_fk FOREIGN KEY (id_modelo) REFERENCES "modelo" (id); ALTER TABLE "avaliacao" ADD CONSTRAINT avaliacao_modelo_fk FOREIGN KEY (id_modelo) REFERENCES "modelo" (id); ALTER TABLE "imagem_anuncio" ADD CONSTRAINT imagem_anuncio_anuncio_fk FOREIGN KEY (id_anuncio) REFERENCES "anuncio" (id); ALTER TABLE "modelo" ADD CONSTRAINT modelo_marca_fk FOREIGN KEY (id_marca) REFERENCES "marca" (id); // inserts omitidos. Baixe o código-fonte do projeto e pegue o script completo na pasta src/main/resources."
[...] continue lendo...

Artigos relacionados