Compilar um aplicativo Web no Eclipse

Concluído

O Eclipse fornece modelos de projeto para a criação de projetos da Web estáticos e dinâmicos. Projetos Web estáticos incluem arquivos que contêm código JavaScript do lado do cliente e HTML. Projetos da Web dinâmicos normalmente incluem arquivos que contêm JSP (Páginas de Servidor Java), que são executados no servidor. O Serviço de Aplicativo do Azure é compatível com projetos Web estáticos e dinâmicos.

Nesta unidade, você aprenderá as noções básicas de como usar o Eclipse para criar projetos da Web dinâmicos. Na próxima unidade, você concluirá um exercício em que criará um projeto Web dinâmico, que poderá ser implantado como um aplicativo Web do Azure.

Como criar aplicativos Web dinâmicos

Para criar um aplicativo Web dinâmico, no menu Arquivo no Eclipse, selecione Novo e, em seguida, selecione Projeto Web Dinâmico.

Screenshot of the New menu in Eclipse. The user has selected the Dynamic Web Project command.

O assistente Projeto Web Dinâmico solicita os detalhes básicos do projeto. O único item obrigatório é o nome do projeto. O assistente fornece valores padrão para todas as outras propriedades e detalhes de configuração. No entanto, você deve verificar o runtime de destino para determinar a funcionalidade que será usada em seu aplicativo Web. Na captura de tela a seguir, o usuário selecionou o servidor Apache Tomcat v8.0. Esse servidor é útil para testar e depurar localmente. Você pode implantar o aplicativo Web no Azure depois de testá-lo.

Screenshot of the Dynamic Web Project wizard in Eclipse.

Como criar páginas da Web estáticas e dinâmicas

Depois de criar um aplicativo Web dinâmico, você adiciona recursos ao projeto, como arquivos HTML, arquivos JSP e folhas de estilo CSS, usando a janela Explorador de Projeto. Por exemplo, para adicionar uma nova página JSP ao projeto, clique com o botão direito do mouse no nome do projeto na janela Explorador de Projeto, selecione Novo e, em seguida, selecione Arquivo JSP.

Screenshot of Eclipse. The user is creating a new JSP file for the dynamic web project.

O Eclipse gera o código clichê básico para uma página da Web. Você pode usar o editor de HTML para criar a marcação HTML que define a parte principal da sua página da Web. Para ajudá-lo, o editor inclui prompts de estilo IntelliSense e preenchimento de código.

Screenshot of the HTML editor in Eclipse, showing IntelliSense-style prompts.

Uma página da Web dinâmica contém uma combinação de marcação HTML e código Java. Você adiciona código Java a uma página da Web usando marcas JSP. Por exemplo, as etapas a seguir descrevem como e quando você pode usar essas marcas:

  • Para importar bibliotecas Java, você usaria a diretiva <%@ page ... %>. No exemplo a seguir, a biblioteca java.util é importada adicionando a diretiva ao início da página:

    <%@ page import ="java.util.*" %>
    
  • Para declarar variáveis estáticas, você usa um par de marcas <%! e %> e pode inicializar as variáveis ao mesmo tempo. Por exemplo, no trecho de código a seguir, contador é uma variável de inteiro e moedas é um conjunto que contém os detalhes de cada moeda disponível na biblioteca java.util.

    <%! int counter;
        Set<Currency> currencies = Currency.getAvailableCurrencies(); %>
    

    Observe que os valores dessas variáveis estáticas são inicializados apenas uma vez e preservados entre as invocações do aplicativo Web.

  • Para adicionar o código de procedimento, inclua seu código em um par de marcas <% e %>. O código de procedimento pode ser disposto em torno da marcação HTML regular. Por exemplo, no trecho de código a seguir, o loop for itera pelo conteúdo do conjunto de moedas e gera um parágrafo HTML durante cada iteração. A variável contador mantém o controle do número de iterações feitas e "NNN" é um espaço reservado temporário que será substituído no próximo trecho de código:

    <% counter = 1;
       for(Currency currency : currencies){ %>
        <p>Currency is NNN </p>
    <%  counter++;
      } %>
    
  • Para exibir os resultados de uma função ou expressão Java, você pode usar um par de marcas de expressão <%= e %>. Por exemplo, o trecho de código a seguir substitui o espaço reservado "NNN" no trecho de código anterior por uma declaração de cadeia de caracteres da moeda:

    <% counter = 1;
       for(Currency currency : currencies){ %>
       <p>Currency is <%= currency.toString() %> </p>
    <%   counter++;
      } %>
    <p> There are <%= counter %> currencies available.</p>
    

A página JSP a seguir mostra um exemplo completo, que recupera uma lista de moedas usando o método Currency.getAvailableCurrencies da biblioteca java.util. O código gera a marcação HTML que exibe as moedas como um conjunto de parágrafos HTML, com um resumo no final que conta o número de moedas exibidas:

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import ="java.util.*" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Currency Lister</title>
</head>
<body>
  <%! int counter;
      Set<Currency> currencies = Currency.getAvailableCurrencies(); %>
  
  <% counter = 1;
   for(Currency currency : currencies){ %>
        <p>Currency is <%= currency.toString() %> </p>
  <%    counter++;
    } %>
  <p> There are <%= counter %> currencies available.</p>

</body>
</html>

A saída gerada por esse código é mostrada na próxima seção.

Como testar um aplicativo Web localmente

Para testar um aplicativo Web, no menu Executar, selecione Executar ou selecione o botão Executar na barra de ferramentas. Você será solicitado a usar o servidor para executar o aplicativo Web. O padrão é o mesmo que o runtime do servidor que você especificou ao criar o projeto.

Screenshot of the Run On Server window in Eclipse. The user has selected the local Tomcat server.

Selecione Concluir para iniciar o aplicativo Web. Se o servidor estiver parado no momento, ele será iniciado. Em seguida, o aplicativo Web será executado e os resultados aparecerão em uma janela do navegador no Eclipse. Os resultados devem ser semelhantes à ilustração a seguir:

Screenshot of the static web app running in the browser window in Eclipse.