Se você estiver começando o trabalho neste tutorial com o módulo 2 (sem fazer
o módulo 1 primeiro), precisará primeiro importar os recursos necessários.
Se você já concluiu o Módulo 1: Criando Páginas da Web com Conexões de Dados e tiver o Web site criado nesse módulo, não será
necessário concluir este exercício. Você pode começar a trabalhar no Exercício 2.2: Formatando uma Tabela de Dados.
Importando o Arquivo do Projeto de Amostra
As páginas da Web de base e o banco de dados de amostra para este tutorial estão incluídos
em um arquivo ZIP. Estas etapas instruem como abrir esse arquivo ZIP para poder
utilizar essas páginas e o banco de dados.Não é necessário extrair esse
arquivo se você já tiver concluído o módulo 1 deste tutorial.
- Na barra de menus, selecione File (Arquivo) > Import (Importar). A janela Importar é aberta.
- Em Select an import source (Selecionar uma origem de importação), clique em Project Interchange (Intercâmbio de Projeto).
- Clique em Next (Avançar). A janela Importar Conteúdo de Intercâmbio de Projeto é aberta.
- Próximo a From zip file (De arquivo zip), clique em Browse (Procurar) e navegue para o seguinte diretório: <installdir>/rwd/eclipse/plugins/com.ibm.etools.webtools.tutorial.doc/resources, em que
<installdir> é o seu diretório de instalação.
- Selecione module2.zip como o destino da importação e clique em Open (Abrir).
- Clique em Select All (Selecionar Tudo).
- Clique em Finish (Concluir). O assistente importa o projeto para o seu espaço de trabalho. Talvez você não o veja
imediatamente porque é necessário estar na Perspectiva Web para ver este projeto
corretamente.
Comutando para a Perspectiva Web
A Perspectiva Web é a perspectiva que será utilizada durante este tutorial.
Siga estas etapas para comutar para a Perspectiva Web:
- Na barra de menus, selecione Window (Janela) > Open (Abrir) Perspectiva > Outro. O diálogo Selecionar Perspectiva é aberto.
- Clique em Web.
- Clique em OK. Agora você está na Perspectiva da Web. Agora é possível ver o novo projeto e seus recursos na visualização Project Explorer:
Definindo o Servidor de Destino para o Projeto Dinâmico da Web
Este tutorial pode ser executado com o WebSphere Application Server v6.0 ou WebSphere Application Server v5.1. É possível escolher o servidor que você mais pretende utilizar ou o servidor que seus outros projetos utilizam. Este tutorial funcionará da mesma maneira independentemente do servidor escolhido, mas você deve utilizar o mesmo servidor durante todo o tutorial.
- Na visualização Explorador de Projetos, expanda Enterprise Applications (Aplicativos Corporativos).
- Clique com o botão direito do mouse em ClassifiedsTutorialEAR e, em seguida, clique em Properties (Propriedades) no menu pop-up.
A janela Propriedades é aberta.
- No lado esquerdo da janela Propriedades, clique em Server (Servidor).
- Na lista Target runtime (Tempo de Execução de Destino), escolha o servidor que será utilizado para este tutorial. Você pode escolher o WebSphere Application Server v6.0 ou WebSphere Application Server v5.1.
Importante: Lembre-se do servidor escolhido. Você precisará dessa informação em exercícios posteriores.
- Clique em OK.
Se o servidor que você deseja utilizar não estiver na lista Target runtime (Tempo de Execução de Destino) ou não existir nenhum servidor nessa lista, siga estas etapas para instalar um servidor:
- Feche o workbench.
- Execute o programa de instalação do Rational Software Development Platform.
- No menu de instalação, escolha a opção para instalar o servidor que você deseja utilizar.
- Quando o servidor estiver instalado, abra o workbench.
- Clique com o botão direito do mouse em ClassifiedsTutorialEAR e, em seguida, clique em Properties (Propriedades) no menu pop-up.
- No lado esquerdo da janela Propriedades, clique em Server (Servidor).
- Na lista Target runtime (Tempo de Execução de Destino), escolha o servidor que será utilizado para este tutorial. Você pode escolher o WebSphere Application Server v6.0 ou WebSphere Application Server v5.1.
- Clique em OK.
Configurando a Conexão com o Banco de Dados
O arquivo de Intercâmbio de Projeto que você acabou de importar inclui o banco de dados de amostra
necessário para este tutorial, junto com as páginas da Web relacionadas no
final deste exercício. Antes de poder utilizar esse banco de dados, é preciso conectar
as páginas da Web ao banco de dados, instruindo às páginas onde localizar o banco de dados
no computador. Siga estas etapas para conectar as páginas da Web ao banco de dados:
- Na visualização Explorador de Projetos, expanda Dynamic Web Projects (Projetos Dinâmicos da Web) > ClassifiedsTutorial > WebContent.
- Na pasta WebContent, dê um clique duplo no arquivo all_records.jsp. Essa página da Web é aberta no editor.
- Na visualização Dados da Página, dê um clique duplo em all_recordlist (Objeto de Dados do Serviço). A janela Configure SDO Record List (Configurar Lista de Registros de SDO) é aberta.
A visualização Dados da Página está normalmente no canto inferior esquerdo do workbench. Se você não conseguir localizar a visualização Dados da Página, clique em Window (Janela) > Show View (Mostrar Visualização) > Page Data (Dados da Página) e ela aparecerá.
- Na janela Configure SDO Record List (Configurar Lista de Registros de SDO), clique na guia Connections (Conexões).
- Clique em New (Novo).
A janela Nova Conexão será aberta.
- Clique em Create New DB Connection (Criar Nova Conexão com o BD). A janela Nova Conexão com o Banco de Dados será aberta.
- Selecione Choose a database manager and JDBC driver (Escolher um gerenciador de banco de dados e o driver JDBC) e, em seguida, clique em Next (Avançar).
- Clique no botão Browse (Procurar) no início da página. Este é o botão Browse (Procurar) próximo a Database location (Local do Banco de Dados). A janela Procurar Pasta é aberta
- Em Selecionar um diretório do banco de dados, navegue até o seguinte diretório: <pasta-espaço-trabalho>\ClassifiedsTutorial\WebContent\cloudscapesampledata\database, em que <pasta-espaço-trabalho> é o diretório que contém o espaço de trabalho no qual você está trabalhando atualmente.
- Clique na pasta database e, em seguida, clique em OK.
Não é necessário incluir um ID do usuário ou senha para acessar o banco de dados. A janela Nova Conexão com o Banco de Dados deve ser semelhante a esta:
- Clique em Finish (Concluir). Você retorna para a janela Nova Conexão.
- Na janela Nova Conexão, clique em Finish (Concluir). Você retornará para a janela Configure SDO Record List (Configurar Lista de Registros de SDO).
- Clique em Close (Fechar).
Sobre os Arquivos Utilizados neste Tutorial
Você pode agora navegar pelos arquivos no projeto da Web do tutorial. Para abrir um arquivo,
dê um clique duplo nele na visualização Project Explorer. Também é possível clicar
no ícone de .website-config
na visualização Project
Explorer para ver uma representação semelhante a um mapa de
como as páginas estão relacionadas.
A finalidade do site é exibir anúncios classificados como os de um jornal,
e cada arquivo tem uma função para ajudar a atingir esse objetivo. Embora existam muitos
recursos no projeto (tais como imagens, arquivos de código e arquivos de
configuração), os cinco arquivos a seguir, as páginas da Web reais no projeto,
são os mais importantes:
- all_records.jsp
Esta é a home page do site. Ela exibe todos os anúncios classificados no banco de dados.
- filtered_records.jsp
Esta página funciona como uma página de resultados de pesquisa, exibindo somente os
registros na categoria que o usuário escolher.
- new_record.jsp
Esta página cria um novo anúncio classificado.
- update_record.jsp
Esta página altera os detalhes sobre um anúncio no banco de dados ou o
exclui.
- template.jtpl
Este é o gabarito para as páginas do site. Inclui elementos como a
tabela e o banner "Bem-vindo aos Classificados" cinza que estão
em todas as páginas. Essa página também tem duas guias de navegação abaixo do banner cinza
que levam à home page e à página de novo anúncio classificado.
Agora você está pronto para iniciar o Exercício 2.2: Formatando uma Tabela de Dados.