Conteúdo


Desenvolva seu primeiro website Node.js, Parte 1

Quando meu filho de 9 anos pediu ajuda para gravar seu primeiro aplicativo, eu percebi que nós desenvolveríamos algumas páginas da web, exibindo algumas informações que armazenaríamos em um banco de dados. Havia muitos anos que eu não gravava códigos, mas seria tão difícil assim criar esse website simples?

Bem, depois de consultar vários websites e manuais de instrução — e instalar um monte de coisas que eu realmente não queria que lotassem meu computador — eu não podia acreditar como isso era difícil.

Assim, eu decidi experimentar o IBM IBM Cloud™ . Foi fácil colocar um aplicativo de amostra em execução, mas, depois, fiquei patinando em um monte de código que eu não entendia e instalando ainda mais coisas para o desenvolvimento de aplicativos — nada que eu pudesse apresentar a uma criança de 9 anos.

Minha adoração pelo IBM Cloud revelou-se no dia em que eu descobri o IDE da web no IBM DevOps Services. É possível editar um aplicativo no IDE, enviá-lo ao IBM Cloud e executar o aplicativo — tudo sem nenhuma instalação de software adicional. É claro, é possível usar o IBM Cloud com ambientes de desenvolvimento locais como o Eclipse e com a linha de comando do IBM Cloud. Mas apenas para começar e experimentar coisas novas, o IDE da web é uma escolha perfeita.

Ainda assim, para começar eu somente precisava criar uma página HTML e a web inicial do Node.js do IBM Cloud não inclui nada que se pareça com o bom e velho HTML. Para trabalhar com um banco de dados, o aplicativo ToDo de amostra do IBM Cloud era mais do que eu precisava.

Foi isso que inspirou este artigo de três partes, que começa com o mínimo e o conduz passo a passo no desenvolvimento de um website dinâmico com Node.js— tudo sem nenhuma instalação necessária. A primeira parte cobre o início de um servidor Node.js para manipulação de solicitação simples. Eu comecei com uma amostra Hello World clássica e incluí um contador do lado do servidor. Você criará uma cópia do aplicativo para seu próprio uso, implementará o aplicativo no IBM Cloud e, em seguida, fará algumas mudanças no código e verá seus efeitos.

O aplicativo Node.js atende solicitações de vários navegadores e mantém uma contagem de cada solicitação.

O aplicativo Node.js atende solicitações de vários navegadores e mantém uma contagem de cada solicitação:

Diagram of the application flow
Diagram of the application flow

Parte 2 inclui a estrutura do Express, a formatação de páginas HTML e a transmissão de dados a partir do servidor Node.js para exibição em uma página HTML. Parte 3 mostra como usar um banco de dados Redis para persistir os dados que o website exibe.

O que você precisará?

Conforme o prometido, não é necessário instalar nada. Você precisa de:

Execute o aplicativoObtenha o código

Etapa 1: Copie o aplicativo Node.js

  1. Efetue login no DevOps Services.
  2. No DevOps Services, clique no botão FORK PROJECT no menu para criar sua própria cópia do código. Forneça um nome exclusivo e clique no botão CREATE.
  3. Clique no botão EDIT CODE para começar a trabalhar com o aplicativo.

Etapa 2: Implemente o aplicativo manualmente

A implementação do DevOps Services no IBM Cloud usa o arquivo manifest.yml, que está configurado no seu projeto e não requer mudanças. No manifest.yml, a linha runtime: node08 solicita que o processo de implementação use o tempo de execução do Node.js do IBM Cloud. O valor de host:, ${random-word}, gera uma URL exclusiva para o aplicativo para assegurar que a implementação não entre em conflito com outras.

O DevOps Services fornece duas maneiras, manual e automática, de implementar um aplicativo no IBM Cloud. Você usará a implementação manual:

  1. No IDE do DevOps Services, clique no botão DEPLOY: Screen shot of the DEPLOY button in the IDE menu
    Screen shot of the DEPLOY button in the IDE menu
  2. Aguarde a conclusão da implementação. Um ponto verde sólido e (execução: normal) indicam que a implementação foi bem-sucedida: Screenshot of manual deployment information with green dot
    Screenshot of manual deployment information with green dot

    Se ocorrerem problemas de implementação, será possível visualizar os logs para solucionar os problemas.
  3. Clique no link NodeJS_Simple_1 para visualizar o aplicativo em execução em uma guia do navegador separada. Atualize a página do navegador e acompanhe o incremento do contador a cada atualização. (Dependendo do navegador, o contador poderá incrementar em mais de 1, inicialmente.)

Etapa 3: Gerencie seu aplicativo

É possível gerenciar suas implementações do IBM Cloud, incluindo iniciá-las e interrompê-las, a partir do DevOps Services:

  1. No DevOps Services, siga o link do painel do aplicativo para gerenciar o aplicativo no IBM Cloud: Screenshot of manual deployment info with stop button
    Screenshot of manual deployment info with stop button
  2. No painel do aplicativo do IBM Cloud, clique em Parar .
  3. Clique no botão início .
  4. Siga o link Rota para reabrir o aplicativo em uma guia separada. Observe que o contador está reconfigurado. Ele está reconfigurado porque o aplicativo é stateless e não persiste dados quando é reiniciado. (Parte 3 trata de persistência.)

Recursos de gerenciamento adicionais estão disponíveis na interface do painel do IBM Cloud.

Etapa 4: Modifique o aplicativo

  1. Retornando ao IDE do DevOps Services, clique em app.js para abrir o código Node.js do aplicativo.
  2. Na linha que diz res.write('Hello from Ruth\n');, altere Ruth para o seu nome.
  3. Implemente o aplicativo conforme o fez na Etapa 2 e abra o aplicativo no navegador. Observe que, agora, a página reflete o texto alterado.
  4. Retorne ao app.js no DevOps Services. Em var userCount = 0, inclua uma nova variável userbytwo e inicialize-a em 0.
  5. Abaixo da linha que incrementa userCount, inclua uma linha para incrementar userbytwo em 2:
    userbytwo = userbytwo + 2;
  6. Copie e cole a instrução de gravação para userCount e modifique-a para imprimir userbytwo:
    res.write('We can also count by two. We have had '+userbytwo+ visits!\n');

    Agora, a subseção do código app.js deverá ser semelhante a esta:
    var userCount = 0;
    var userbytwo = 0; /* added the var definition for new variable, userbytwo here */
    
    /**
     * This is the function that handles incoming requests
    **/
    var serverHandler = function(req,res) {
         userCount++;
         userbytwo = userbytwo + 2;  
         /* added the incrementing by two for your new variable, userbytwo here */    
         res.write('Hello from yourname\n');     /* edit this line to say your name */
         res.write('We have had '+userCount+' visits!\n');
         res.write('We can also count by two. We have had '+userbytwo+' visits!\n');
         res.end('Good Bye');
    };
  7. Implemente o aplicativo e use o link da URL para abri-lo.
  8. Confirme se o contador é incrementado em 2.

Conclusão da Parte 1

Nesta primeira parte, você trabalhou passo a passo para iniciar um servidor Node.js. Agora, você está pronto para passar para a Parte 2, na qual você incluirá um front-end da web com páginas estáticas e conteúdo dinâmico a partir do servidor. Parte 3 cobre o armazenamento dos dados do site em um banco de dados.


Recursos para download


Temas relacionados

static.content.url=http://www.ibm.com/developerworks/js/artrating/
SITE_ID=80
Zone=Cloud computing
ArticleID=981922
ArticleTitle=Desenvolva seu primeiro website Node.js, Parte 1
publish-date=04302015