quinta-feira, 23 de maio de 2013

Playground - Workspace com implementações de exemplo

Playground

Pessoal, estou preparando uma área no meu dropbox com diversos exemplos de utilização de frameworks, códigos java em geral e etc. Resumindo, é o meu workspace do ecplise para testes! Lá vocês podem entrar e baixar como um zip de cada projeto.

Dentro de cada projeto, na raiz, existe um arquivo chamando README.TXT indicando o que aquela aplicação faz e as tecnologias que utiliza.

Qualquer dúvida sobre alguma implementação, pode me mandar um email, ou comentário aqui, que respondo assim que possível.

IMPORTANTE: Alguns projetos não estão totalmente completos e nem são exemplos magníficos de implementação. São testes! O próprio nome diz "Playground".

Endereço: Playground

[]s

sexta-feira, 17 de maio de 2013

Como configurar o Maven para um projeto web (Mavenize web project)

Neste post vou mostrar como criar um projeto web com maven. Para isso será necessário adicionar o plugin do Maven (m2eclipse), caso ainda não tenha.
Para fazer isso vá na menu "help" e depois "install new software". Selecionar "All available sites" em "work with", esperar carregar e na caixa inferior, e depois buscar por "maven integration for Eclipse". A instalação de plugins pode ter que ser realizada de diferentes maneiras dependendo da versão do eclipse instalada.

Em seguida, vamos criar o novo projeto, selecionando "Maven Project" no Eclipse.
Clique em “skip archetype selection” e defina o group id como: org.mycompany.lightshop. O group id é similar ao pacote padrão/base da aplicação. O artifact id, que é considerado o nome do projeto, deve ser definido como: lightshop. Na opção "packaging" selecione "war".

O archetype é considerado um template para projetos do Maven. Existem diversos exemplos de archetypes para diferentes frameworks. 

Depois que o projeto foi criado, você verá uma estrutura de diretórios diferente da estrutura padrão de um projeto web dinâmico. Nesta nova estrutura teremos um arquivo chamado "pom.xml" na raiz do projeto. Com ele é possível configurar todo o projeto, como por exemplo: adicionar dependências, gerenciar o ciclo de deploy, gerenciar repositórios, configurar propriedades e etc.
Abra o "pom.xml". Na aba dependencies, adicionar as dependências necessárias para o projeto. Aqui vou apenas adicionar a dependência para a JSTL, como exemplo:



Após adicionar as dependências, vá nas propriedades do projeto e depois em "Project Facets".
Clique em "convert to facet form" para converter um projeto para a forma "facetada" (configuração em partes). 
Selecione "Dynamic Web Project", para transformá-lo em um projeto web, e em "further configuration avaiable..." para terminar a configuração web do projeto.
Em "content directory" coloque "src/main/webapp" que é a diretório padrão/base com que o Maven gerencia as páginas web e não mais "WebContent" como estávamos acostumados. Depois dê OK.

Selecione essa pasta (src/main/webapp), botão direito -> build path -> source -> use as source folder, para definí-la pasta como uma pasta que contém código-fonte.

Crie uma página index.jsp em na pasta webapp. Adicione o projeto ao servidor, inicie e teste!

[]s

quinta-feira, 16 de maio de 2013

Criando templates usando o web.xml e fragmentos de JSPs (JSPFs)

Neste tópico vou abordar uma outra maneira de criar templates sem usar bibliotecas externas. Iremos utilizar apenas o web.xml e fragmentos de JSPs (JSPFs).

Inicialmente irei criar uma página HTML completa com cabeçalho, corpo e rodapé. Vou chamar essa página de index.jsp, salvá-la no WebContent com o código a seguir:

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<link href="css/default.css" rel="stylesheet" type="text/css">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Página Principal</title>
</head>
<body>
    <div id="header">
        <h1>Título do web site</h1>
    </div>
    <div id="menu">
        <h2>Menu</h2>
        <ul>
            <li><a href="cadastrar.jsp">Cadastrar</a></li>
            <li><a href="listar.jsp">Listar</a></li>
        </ul>
    </div>
    <div id="content">
        <h1>Bem Vindo</h1>
    </div>
    <div id="footer">
        Informações do rodapé <br />copyright e etc.
    </div>
</body>
</html>

Vamos separar esse arquivo em 4. Um vai continuar se chamando index.jsp e criaremos outros três: header.jspf, menu.jspf e footer.jspf. Todos os arquivos criados devem ser copiados para uma nova pasta jspf dentro de WEB-INF.
O arquivo header.jspf deve conter apenas o código html correspondente ao início do arquivo index.jsp, ou seja:

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<link href="css/default.css" rel="stylesheet" type="text/css">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Template Web Site</title>
</head>
<body>
    <div id="header">
        <h1>Título do web site</h1>
    </div

Já o arquivo footer.jspf deverá corresponder ao código ao final da página index.html:

<div id="footer">
    Informações do rodapé <br />copyright e etc.
</div>
</body>
</html>

O arquivo que irá conter o menu, irá se chamar menu.jspf e terá somente o código:

<div id="menu">
    <h2>Menu</h2>
    <ul>
        <li><a href="cadastrar.jsp">Cadastrar</a></li>
        <li><a href="listarjsp">Listar</a></li>
    </ul>
</div>

No arquivo do header temos um link para um arquivo chamado "default.css". O código correspondente ao arquivo é:

@CHARSET "UTF-8";

html,body {
    margin: 0;
    padding: 0;
}

body {
    height: 100%;
    font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
}

#header {
    background: red;
    height: 120px;
    clear: both;
    text-align: center;
}

#footer {
    background: black;
    color: white;
    clear: both;
    text-align: center;
    padding: 10px;
}

#menu {
    padding: 10px;
    background: yellow;
    width: 120px;
    float: left;
    min-height: 400px;
}

#content {
    margin-left: 160px; /* menu width + 40 */
}

A página principal (aqui chamada de index.jsp) e qualquer outra página do projeto que você deseje que inclua o header, footer e menu, deve conter apenas a parte do corpo (<body>). Como exemplo segue o código para o index.jsp:

<div id="content">
    <h1>Bem Vindo</h1>
</div>

O código da index.jsp é correspondente ao código restante dos recortes de código executados posteriormente.

O web.xml que contém a configuração dos redirecionamentos do template para as páginas JSPFs deve ter o seguinte código:

<jsp-config>
    <jsp-property-group>
        <description>Configuracao do header, menu e footer do template</description>
        <url-pattern>*.jsp</url-pattern>
        <include-prelude>/WEB-INF/jspf/header.jspf</include-prelude>
        <include-prelude>/WEB-INF/jspf/menu.jspf</include-prelude>
<include-coda>/WEB-INF/jspf/footer.jspf</include-coda>
    </jsp-property-group>
</jsp-config>

A partir daí é só adicionar o projeto ao servidor e executar!

[]`s

Popular Posts

StackOverflow Profile


profile for andvicoso at Stack Overflow, Q&A for professional and enthusiast programmers