DEV Community

Gustavo Garcia Pereira
Gustavo Garcia Pereira

Posted on

Construindo um Blog Simples com Server.js: Uma Introdução Prática ao Desenvolvimento Web com Node.js

Neste tutorial, exploraremos como o server.js, um framework ágil e robusto para Node.js, pode ser utilizado para criar um blog simples mas funcional. Demonstraremos passo a passo como configurar o servidor, gerenciar rotas, e processar dados, tudo isso utilizando a elegância e a simplicidade que o server.js oferece. Este guia prático é ideal para desenvolvedores que buscam implementar rapidamente aplicações web, oferecendo uma excelente introdução às capacidades do server.js, desde a criação de interfaces até o manejo eficiente de requisições web.
documentation

Sobre o Projeto

O projeto apresentado é a construção de um pequeno blog utilizando o framework server.js. Este blog é capaz de listar postagens armazenadas e permitir a criação de novas postagens através de uma interface web simples. A estrutura do projeto inclui um servidor configurado com rotas específicas para exibir as postagens existentes e receber novas através de formulários web. Os posts são armazenados em uma lista em memória, simulando um banco de dados, o que facilita a demonstração e o desenvolvimento sem necessidade de configurações adicionais de banco de dados.

Funcionalidades do Projeto

O sistema do blog permite que usuários visualizem uma lista de postagens e acessem conteúdo específico clicando nos títulos listados na página inicial. Além disso, usuários podem adicionar novos posts através de uma interface simples que coleta título e conteúdo via método POST. Esta aplicação é ideal para demonstrar o funcionamento básico do server.js, incluindo o manuseio de rotas, recebimento e processamento de dados de formulários, e a renderização de páginas dinâmicas com templates Handlebars.

Sobre o server.js

Server.js é um framework leve e moderno para Node.js, projetado para simplificar a criação de servidores web e APIs. Ele abstrai muitas complexidades do gerenciamento direto de servidores HTTP, permitindo que os desenvolvedores configurem rapidamente rotas, middleware, e respostas. O server.js é construído sobre o Express, uma das bibliotecas mais populares para aplicações web em Node.js, fornecendo uma camada adicional de simplicidade e funcionalidades prontas para usar.

Características da Ferramenta

A ferramenta server.js oferece uma maneira simplificada de lidar com rotas HTTP, processamento de requisições e envio de respostas, incluindo suporte a JSON e redirecionamentos. Ela facilita a integração de middlewares e a utilização de templates para renderizar páginas web, além de permitir uma configuração detalhada através de opções diversas que controlam desde a segurança até a personalização completa do servidor. Isso torna o server.js uma escolha eficiente para desenvolvedores que buscam rapidez no desenvolvimento de aplicações web com Node.js.

Estrutura do Projeto

Primeiramente, certifique-se de ter o Node.js instalado e crie um novo diretório para o seu projeto. No diretório do projeto, crie um arquivo chamado index.js, que será o ponto de entrada do seu servidor.

Instalando Dependências

Você precisa instalar o pacote server.js antes de começar. Abra o terminal e execute:

npm install server
Enter fullscreen mode Exit fullscreen mode

Criando o Servidor

Aqui está o código para index.js que configura o servidor e as rotas:

const server = require('server');
const { get, post } = server.router;
const { render, json } = server.reply;

// Simulando um banco de dados simples em memória
let posts = [
  { id: 1, title: "Primeiro Post", content: "Este é o primeiro post do blog." }
];

// Rota para mostrar a lista de posts
server([
  get('/', ctx => render('index.hbs', { posts })),
  get('/post/:id', ctx => {
    const post = posts.find(p => p.id == ctx.params.id);
    return post ? render('post.hbs', { post }) : status(404);
  }),
  post('/', ctx => {
    const newPost = { id: posts.length + 1, title: ctx.data.title, content: ctx.data.content };
    posts.push(newPost);
    return redirect('/');
  })
]);

console.log('Servidor rodando na porta 3000...');
Enter fullscreen mode Exit fullscreen mode

Templates Handlebars

Você também precisará de alguns templates Handlebars para renderizar o HTML. Crie um diretório views e adicione os seguintes arquivos:

  • index.hbs: Para mostrar a lista de todos os posts.
  • post.hbs: Para mostrar um post específico.

Exemplo de index.hbs

<h1>Blog</h1>
<ul>
  {{#each posts}}
    <li><a href="/post/{{this.id}}">{{this.title}}</a></li>
  {{/each}}
</ul>
<a href="/new">Novo Post</a>
Enter fullscreen mode Exit fullscreen mode

Exemplo de post.hbs

<article>
  <h1>{{post.title}}</h1>
  <p>{{post.content}}</p>
</article>
<a href="/">Voltar</a>
Enter fullscreen mode Exit fullscreen mode

Rodando o Servidor

Agora que você tem seu servidor configurado e seus templates prontos, você pode iniciar o servidor com o Node.js:

node index.js
Enter fullscreen mode Exit fullscreen mode

Este exemplo básico demonstra como usar o server.js para construir um blog simples, com funcionalidades de visualização e criação de posts. As rotas lidam com as requisições GET e POST, enquanto os templates Handlebars apresentam os posts de forma agradável ao usuário.

Top comments (0)