Password Generator app

Community feedback

• 

  P

  Carlos Samuel•350

  @Crtykwod

  Posted 4 months ago

  Opa Leonardo, beleza? O projeto ficou ótimo, parabéns!!

  Ainda assim existem algumas coisinhas que podem melhorar. Por exemplo, no github, você upou todos os arquivos, até o README.md que pede explicitamente para ser apagado sksksk:
  Once you've added your information to the template, delete this file and rename the README-template.md file to README.md. That will make it show up as your repository's README file.
  Você pode simplesmente excluir esses arquivos, não polua seu repositório com um monte de arquivos inúteis, isso vai acabar te complicando caso você queria voltar algum dia para esse projetos. Ah, também é um ótima ideia adicionar o seu .gitignore ao .gitignore.

  Agora falando do código:

  Fiz um pull request no seu git com todas as mudanças, pois achei bem interessante que você não utilizou <input type:range> para o slider, não sei se você não sabia sobre ele, mas evitaria um estresse.

  - Melhorias no Slider

  O slider passou por melhorias significativas:

  • Cálculo da posição: Agora, a largura do "thumb" (bolinha do slider) é considerada ao calcular a posição, evitando que ultrapasse os limites do contêiner.
  • Uso de transform: translateX: Utilizar transform ao invés de left resulta em um movimento mais suave e eficiente do slider.
  • Introdução de maxValue: A adição de um valor máximo controlado no slider garante uma experiência mais precisa e evita números mágicos.

  Essas mudanças tornam a interação com o slider mais fluida e previsível.

  - Lógica do updateStrengthIndicator

  Na versão inicial da função updateStrengthIndicator, a lógica estava utilizando uma série de condições if/else para calcular a força da senha, o que tornava o código muito verboso e difícil de manter. O fluxo de verificação da força da senha era repetitivo e com muitos pontos de decisão, o que gerava redundância e aumentava a complexidade.

  Mudanças feitas:

  • Eliminação de if/else repetitivos: A estrutura original usava vários if/else para verificar diferentes condições de comprimento de senha e caracteres selecionados. Isso resultava em um código longo e difícil de entender. Eu substituí essa estrutura por uma lógica mais simples que usa Array.from() e find() para determinar de forma concisa o nível de força da senha.

  • Uso de Array.from() e find(): Ao invés de usar várias verificações com if, agora a lógica usa o método find() para localizar o primeiro limiar de comprimento de senha que se aplica. Esse método percorre os limiares e encontra o primeiro valor em que o comprimento da senha se encaixa, tornando a busca mais eficiente e legível.

  • Redução do código: A implementação ficou mais compacta e legível, removendo a necessidade de múltiplas verificações manuais. Usando o find(), o código agora realiza a busca do limiar de forma mais direta, sem precisar de múltiplas comparações if.

  - Modularização da lógica de geração de senha

  Uma das principais mudanças foi a modularização da lógica de geração de senha, o que tornou o código mais organizado e reutilizável. Antes, a lógica de geração de senha estava toda concentrada dentro da função generatePassword(), o que tornava o código difícil de entender e manter, além de ser menos flexível.

  Mudanças feitas:

  • Funções auxiliares: A lógica foi dividida em várias funções menores e específicas, como getSelectedCharacters(), createPassword(), e displayPassword(). Cada função tem uma responsabilidade única, o que facilita a compreensão do código e sua manutenção no futuro.

    • getSelectedCharacters(): Agora é responsável apenas por retornar os caracteres selecionados com base nas caixas de seleção, sem se preocupar com a geração ou exibição da senha.
    • createPassword(): Esta função agora é responsável exclusivamente por gerar a senha aleatória, com base no comprimento e no conjunto de caracteres fornecido.
    • displayPassword(): Esta função é encarregada de exibir a senha gerada na interface, mantendo a lógica de exibição separada da lógica de geração.

  • Vantagens da modularização:

    • Legibilidade: O código ficou muito mais claro. Agora, cada parte do código tem uma função bem definida e não há sobrecarga de responsabilidade em uma única função.
    • Reutilização: Funções como createPassword() e getSelectedCharacters() podem ser reutilizadas em outras partes do código ou até em outros projetos, sem a necessidade de duplicação de código.
    • Facilidade de manutenção: Como a lógica foi dividida em partes menores, qualquer alteração futura no processo de geração de senha, por exemplo, pode ser feita de forma isolada, sem afetar outras partes do código.

  Por fim:

  de - Lógica do updateStrengthIndicator é tudo gerado pelo gpt, fiquei com baita preguiça de escrever, já são 02:00, então caso suja qualquer dúvida, pode me chamar no Discord: crty.

  Caso você queira tentar fazer essas mudanças por si só, rejeito o PR e bom trabalho, o código inicial estava ótimo, essas são apenas algumas pequenas mudanças que propiciam um código mais limpo e mais legível.

  Good coding! \o/

  01

  Marked as helpful