aceleradora-TW / aceleradora-TW/descarte-certo

[Melhoria] Remover os warnings

未關閉
#157 0 則留言 0 個 reaction 已指派 3 人 已被 @estevandh 認領 在 GitHub 檢視
Front-End
主要語言
JavaScript
星號
15
分支
6
PR 合併指標
30 天內沒有已合併 PR

描述

- **IMPORTANTE**: após a implementação desse card, deve se adicionar ao passo de desenvolvimento e QA a monitoração de novos warnings. Ou seja, durante o desenvolvimento dos futuros cards, os pares devem sempre analisar se sua implementação criou um novo warning, se sim, o par deve resolver os warnings produzidos. E ja em QA, não publicar em produção implementações que contem novos warnings

## Descrição
Atualmente temos uma série de warnings na nossa aplicação frontend que precisam ser removidos.

Quando inicializamos a aplicação pelo terminal conseguimos ver todos eles:
![Screen Shot 2021-06-12 at 06 04 42](https://user-images.githubusercontent.com/359991/121771418-a36ddc00-cb45-11eb-9177-317222e97974.png)

E no navegador, inspecionando também conseguimos ver outros que não aparecem no terminal:
![Screen Shot 2021-06-12 at 06 08 13](https://user-images.githubusercontent.com/359991/121771429-bb456000-cb45-11eb-97c6-31fe57759c52.png)

A ideia por trás dessa tarefa é ensinar como manter o projeto limpo de erros e warnings seguindo as boas práticas do framework (react).

## Nota técnica
- Para desenvolver essa card será necessário entender a mensagem de warning:
1) Saber aonde se encontra o warning
2) Entender a sugestão de conserto dada pela warning

Exemplo:
Essa é uma mensagem de warning que aparece no terminal:
![Screen Shot 2021-06-12 at 06 23 02](https://user-images.githubusercontent.com/359991/121771593-aa491e80-cb46-11eb-954e-06a0e669b56b.png)

ONDE "**./src/components/NavBar/index.js**" é o caminho para encontrar o **ARQUIVO**
E "**Line 10:36:**" diz a **LINHA** onde se encontra o warning, no caso, é a linha 10
E "**img elements must have an alt prop, either with meaningful text, or an empty string for decorative images**" diz qual a solução que pode ser feita para solucionar o problema.

- Nesse caso a mensagem de solução explica que o elemento **IMG** deve ter uma propriedade "alt", essa propriedade geralmente recebe uma descrição breve da imagem **alt="Logotipo 5marias"**
- Resolução: ```Logo 5marias```
- Então, agora aprendemos que todas as imagens criadas com a tag devem ter por obrigação uma propriedade "alt".
- O impacto dessa solução está na acessibilidade, assim, tornamos nossa aplicação mais amigável para pessoas que utilizam leitores de tela.

## Critério de aceitação

- [ ] Não devem aparecer warnings no terminal
- [ ] Não devem aparecer warnings no navegador
- [ ] E também não devem aparecer mensagens de "console.log" no navegador

## Como testar

- [ ] Acessar a página das 5marias em ambiente QA
- [ ] Abrir o inspecionar, na aba "**Console**"
- [ ] Verificar que nenhuma mensagem de warning ou console.log seja exibida

貢獻指南

這個儲存庫沒有索引到貢獻指南

評估

這個 Issue 還沒有評估資料。

把新 issue 寄到你的電子郵件信箱

精選適合新手參與的 GitHub issue 摘要。