Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feedback #1

Open
leonardolessa opened this issue Jun 23, 2022 · 0 comments
Open

Feedback #1

leonardolessa opened this issue Jun 23, 2022 · 0 comments

Comments

@leonardolessa
Copy link

Fala JV, blz?

Vou te dar um feedback aqui da HOX, não necessariamente são coisas erradas, só detalhes que eu faria diferente, ok?

Código:

  1. Teus componentes específicos das telas poderiam ficar separados numa pasta components na própria pasta da página, por exemplo: pages/LoginPage/components/LoginForm. Assim tu poderia deixar tua pasta components do src só pra componentes gerais do projeto, ia escalar mais bacana :)
  2. Teus componentes poderiam ter uma responsabilidade mais definida (e quanto menos, melhor), quando criar os componentes pensar "qual a responsabilidade dele?" Por exemplo: o LoginForm pra mim faz mais sentido ter só a responsabilidade de validar o form e retornar os dados pro componente pai, assim ele fica independente do teu controle de estado e integração com o backend, mesmo que tu tivesse alguma mudança na lógica assincrona ou do estado, teu componente não sofreria nenhuma manutenção. Ficaria algo mais assim: . Inclusive caso tu queira fazer testes unitários nele, tu teria um controle maior de input e output dessas informações.
  3. Sempre usar uma lib pra validação de forms, react-hook-form é relativamente simples e bacana, depois explico melhor sobre a experiência.
  4. Eu notei que tu tentou utilizar algumas ferramentas pra fazer o gerenciamento das chamadas assincronas, vi que em algum momento tu colocou o redux-thunk e removeu e também utilizou o thunk do toolkit do @reduxjs, confesso que nunca usei esse do toolkit e não sei como ele é integrado ali, mas aparentemente não está sendo usado corretamente porque tua lógica assincrona continua na view, acredito que o redux-thunk seria mais simples. Aqui utilizamos muito os sagas, eles ficam bem independentes e ficam reativos às actions pra fazer alguma lógica assincrona e retornar o resultado, dá uma estudada sobre.
  5. Pequeno detalhe: o tailwind tá nas dependencias de desenvolvimento

Implementação:

  1. Tentar não usar as validações default do HTML5 e nem confiar muito nos componentes visuais, tá sendo possível digitar manualmente datas que não poderiam ser inputadas ali, como a data de validade anterior a fabricação. Como falei ali, deixar a validação pra alguma lib ou implementar manualmente fica mais seguro.
  2. Teu projeto ficou bem bonito visualmente, mas poderia ser responsivo só com alguns ajustes minimos, os tamanhos ainda estouram em telas menores, só deixar ele mais fluído sem muitos tamanhos fixos.
  3. Usar máscara ali pros valores seria uma experiência melhor.
  4. O lance de editar ali ficou show de bola, só faltou ele não ficar mudando o tamanho da tabela ali pra ficar menos bruto, acho que o input do nome estava forçando a tabela a aumentar o tamanho.

Acho que é isso, vou te mandar um e-mail pra mantermos contato.
Abraço.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant