Skip to content
/ blog Public

Teste Prático de Front-end (Desenvolver um Fron-end para uma API RESTful)

Notifications You must be signed in to change notification settings

Iann-rst/blog

Repository files navigation

Desenvolver um front-end para uma API RESTful

🎯 Objetivo

Desenvolver um front-end para uma API RESTful. A interface deve exibir os posts de um blog, e ao clicar em um post, os comentários associados.

Serviços disponíveis:

  • Listagem de posts;
  • Listagem de comentários de um post;
  • Listagem de usuários;
  • Detalhes de um usuário;

📖 Estratégia

  • Desenvolvi 3 páginas (Home, Posts e 404):
    • A Home é a responsável por listar os posts:
      • Lista os 10 primeiros posts e depois posso ir listando mais ao clicar no botão de "Carregar mais posts";
    • A outra página (Posts) ela lista todas as informações do posts que o usuário clicou:
      • Recebe o ID do posts via parâmetros de rota;
      • Busca na API as informações do autor e os comentários do post:
          comentários: api.get(`/posts/${id}/comments`)
          autor: api.get(`/users/${post.userId}`)
      • Depois que recebe as informações, faz a listagem do: título, conteúdo, autor e comentários do post;
    • A página 404 é para rotas não listadas no site;

🚀 Como executar

# Faça o clone do projeto
git clone https://github.com/Iann-rst/blog.git

# Acessar a pasta
cd blog

# Instalar as dependências
npm install

# Executar o projeto
npm run dev

📷 Screenshots

Página Home - Listagem dos posts

Página Publicação - Detalhes de um post específico

Página Not found - Error de página não encontrada

About

Teste Prático de Front-end (Desenvolver um Fron-end para uma API RESTful)

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published