[Relatório de Orçamentos] Login: Salvar Token no LocalStorage

narukaioh commented 3 years ago

Descrição

Para o desenvolvimento do login, o frontend precisa estabelecer alguns passos, um deles é salvar o token que está sendo enviado pelo backend no localStorage do navegador, então:

como programadora eu quero que, ao digitar meu email e senha e efetuar login, quero que seja salvo no localStorage o meu token de acesso que é enviado pela resposta da API.

O passo a passo desse card é:

1) Criar uma função que faça uma request POST para o endpoint "/login" enviando email e senha 1.1) a dupla deve entender como utilizar o axios ou fetch para resolver esse primeiro passo 2) salvar a resposta da API no localStorage 2.1) a dupla deve entender como utilizar o localStorage para resolver esse segundo passo

em caso de dúvidas o kickoff pode ser feito com a Ju

Notas técnicas

Endpoint fake: /login (Vamos utilizar esse endereço fake por enquanto)
Usando localStorage no react
Vendo localStorage na prática

Critérios de aceitação

[x] Deve ser criado um item no localStorage de nome "token-descarte-certo"
[x] Ao item deve ser atrelado a informação do token do usuário

Como testar

[ ] Acessar: url do ambiente de QA
[ ] Abrir a aba de inspecionar nessa página (F12 ou clicar com botão direito e escolher a opção inspecionar)
[ ] Procurar a opção de login
[ ] Digitar qualquer email e senha no formulário e clicar no botão para efetuar o login
[ ] Na aba de inspecionar, procurar a opção "Application" ou "Aplicação)
[ ] Então logo verá uma seta ao lado da opção lateral "Local Storage", clique nela e escolha a primeira opção que aparecer
[ ] Procure pela palavra "token-descarte-certo" na primeira coluna de nome "KEY"
[ ] Na mesma linha, na coluna "VALUE", verifique se ela não está vazia.

narukaioh commented 3 years ago

Preciso que coloquem a label "front-end" nesse card e que tambem adicionem o link do ambiente de QA no primeiro passo do tópico "como testar"

nanifool commented 3 years ago

Preciso que coloquem a label "front-end" nesse card e que tambem adicionem o link do ambiente de QA no primeiro passo do tópico "como testar"

Pronto

aceleradora-TW / descarte-certo