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 摘要。