/ProtestWeb-Avanade

ProtestFrontEnd

Primary LanguageJavaScript

Protesto Web

FrontEnd

Pagina de login

Pagina de protestos

🎉 Passo a passo para subir a aplicação front-end:

Entre na pasta Frontend e execute os comandos abaixo:

  • Instalando pacotes: npm install ou yarn
  • Iniciando o react: npm start ou yarn start

BackEnd

🎉 Passo a passo para subir a aplicação back-end:

Entre na pasta Backend e execute os comandos abaixo:

  • Instalando pacotes: npm install ou yarn
  • Iniciando o node: npm run dev ou yarn dev

Estrutura de Requisições da API

➜ Descurtir (dislike)

  • Rota: /protest/dislike/{param}
    • Parâmetro: Protest ID
      • Método: PUT

Exemplo utilizando browser fetch

fetch("/protest/dislike/1", { method: "PUT" })
  .then((response) => response.json())
  .then((data) => console.log(data));

➜ Curtir (like)

  • Rota: /protest/dislike/{param}
    • Parâmetro: Protest ID
      • Método: PUT

Exemplo utilizando browser fetch

fetch("/protest/like/1", { method: "PUT" })
  .then((response) => response.json())
  .then((data) => console.log(data));

➜ Cadastrar Novo Protesto

  • Rota: /protest
    • Corpo (JSON): 
      {
}
      • Método: POST

Exemplo utilizando browser fetch

fetch('/protest,
  {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
    },
    body: JSON.stringify(
      { user: 'Nome de Usuário',  message: 'Mensagem do Protesto' }
    ),
  }
)
  .then(response => response.json())
  .then(data => console.log(data));

➜ Deletar Protesto

  • Rota: /protest/{param}
    • Parâmetro: Protest ID
      • Método: DELETE

Exemplo utilizando browser fetch

fetch("/protest/like/1", { method: "DELETE" })
  .then((response) => response.json())
  .then((data) => console.log(data));

➜ Visualizar Todos os Protestos

  • Rota: /protest
    • Parâmetro: Nenhum
      • Método: GET

Exemplo utilizando browser fetch

fetch("/protest")
  .then((response) => response.json())
  .then((data) => console.log(data));

➜ Visualizar Protesto por ID

  • Rota: /protest/{param}
    • Parâmetro: Protest ID
      • Método: GET

Exemplo utilizando browser fetch

fetch("/protest/1")
  .then((response) => response.json())
  .then((data) => console.log(data));