Validações de Forms no React com YUP + Exibição de Erros ao Usuário - Tips N' Tricks #11

Поделиться
HTML-код
  • Опубликовано: 2 фев 2025

Комментарии • 29

  • @netopaiva5564
    @netopaiva5564 Год назад +1

    Bacana o tutorial, bem explicado.
    Valeu!

    • @Huriel
      @Huriel  Год назад +1

      Obrigado Neto!! Fico muito contente em ajudar dessa forma :D

  • @guilherme-rocha
    @guilherme-rocha 4 месяца назад

    Valeu demais! Ajudou muito, estou usando um formulário pra envio de e-mail com o Resend e hospedando o back-end no Vercel. Aí faltava essa parte de validações, inserir máscara no input de telefone e enviar arquivo pelo form. Agora só falta esse último item, obrigado pelas dicas!

  • @joaopedrobragaporto1476
    @joaopedrobragaporto1476 Год назад +1

    Fala Huriel, tudo certo?! Q aula meu amigo, q aula... Parabéns!

    • @Huriel
      @Huriel  Год назад +1

      Obrigado João!! Que bom que gostou mano 🤩

  • @paulocavalheirodeveloper1213
    @paulocavalheirodeveloper1213 2 года назад +1

    Eu estou usando Formik + Yup, não me dei bem com React hook form.

    • @Huriel
      @Huriel  2 года назад

      Formik não cheguei a usar muito... Parece ser interessante

  • @dinatoo
    @dinatoo 2 года назад +2

    Conteúdo muito bom, me ajudou bastante!

    • @Huriel
      @Huriel  2 года назад

      Que ótimo!! Valeu 😊

  • @DanielRios549
    @DanielRios549 2 года назад +1

    Eu to tentando criar um componente pra abstrair essa etapa de validação no front, to usando Yup pra validação mas preferi usar com o Formik, mas tipo, o Formik precisa do initialValue pra cada um dos inputs, e o React tem o defaultValue pros inputs, o que eu quero fazer é pegar esse defaultValue dos inputs e passar para o initialValue do Formik, automaticamente com base na quantidade de inputs, como que eu faço um loop por cada um dos inputs sem usar o querySelector que o React não recomenda?

    • @Huriel
      @Huriel  2 года назад

      Opa Daniel!! Pode tentar fazer com um map no return, já vi casos em que isso funciona... Depende se seu front tá estruturado de uma forma que isso seja possível

    • @DanielRios549
      @DanielRios549 2 года назад

      @@Huriel Eu consegui fazer usando React.Children passando o props.children, mas ficou estranho, no React DevTools ele mostra o initialValues com os valores, mas na prática eles começam vazios.
      A idéia é abstrair a lógica o Formik pra não precisa ficar fazendo tudo em todo formulário, ai eu passo só os inputs como children e o schema do Yup pra validação, tá funcionando muito bem menos quando tem valores iniciais, vou tentar corrigir isso.

  • @gustadev276
    @gustadev276 2 года назад +1

    Segundo dia seguido com você me ajudando, que canal bom!

    • @Huriel
      @Huriel  2 года назад

      Nicee Gustavo! Que bom que to conseguindo ajudar, e espero ajudar mais e mais dias!! Abraço :D

  • @alexandrefreitasmiguel5052
    @alexandrefreitasmiguel5052 2 года назад +1

    Cara, vc é foda de mais Huriel, didática incrível, melhor do que muitos cursos, tem me ajudado muito com meu trampo essa playlist!

    • @Huriel
      @Huriel  2 года назад +1

      Poxa, obrigado Alexandre!! Fico felizão demais por ajudar man, espero continuar ajudando bastante ae!! Abraço

  • @timoteopiano2792
    @timoteopiano2792 3 года назад +1

    No .matches( ) não preciso colocar os required( ) depois?

    • @Huriel
      @Huriel  3 года назад

      Não necessariamente mano, mas se quiser, pode fazer sim!

  • @VictorZatti
    @VictorZatti 3 года назад +1

    🔥🔥🔥🔥

  • @carlosoliveira7357
    @carlosoliveira7357 3 года назад +1

    O form ou yup ele tem alguma mask para os types ?

    • @Huriel
      @Huriel  3 года назад

      Opa! Tu quer dizer sobre a validação? Isso seria com o YUP mesmo

  • @ramonbosi1638
    @ramonbosi1638 2 года назад +1

    Fala Huriel, primeiramente video excelente e didática incrível, a forma como apresenta o assunto é fenomenal
    Eu gostaria de saber qual seria uma boa prática sobre onde a validação dos dados tem que ocorrer, no frontend que nesse caso seria usando React ou no backend ?

    • @Huriel
      @Huriel  2 года назад

      Opa Ramon!! Sobre isso, a validação tem que estar nos 2 lugares, tanto no Backend quanto no Frontend. Existem certas validações que o Front não consegue fazer sozinho, como por exemplo, verificar se o e-mail, ou CPF já está sendo usado, e aí precisamos do Backend trabalhando pra isso... Mas todas as validações que o Front consegue fazer sem o Back, devem ser feitas, e de maneira dobrada no Backend também!

  • @app2028
    @app2028 3 года назад +1

    Muito bom! você tem video atual de login
    Coloca a opção de ser membro faço questão de contribuir todo mês seus cuidados são ótimos

    • @Huriel
      @Huriel  3 года назад

      Agradeço o feedback mano! Sobre a opção de ser membro, ainda não tá disponível pra mim hahahah
      Falta um caminho ainda pra isso, mas obrigadão de verdade pela intenção!!

  • @lucasmgsilva98
    @lucasmgsilva98 3 года назад +1

    Que SO é esse?

    • @Huriel
      @Huriel  3 года назад

      Eae! Cara, utilizo o Kubuntu (Ubuntu + KDE), com interface personalizada inspirada no tema Nordic.

  • @kosmedsuporte
    @kosmedsuporte 2 года назад +1

    E aí, mano ! Conteúdo sensacional !!
    Qual o nome desse dock que tá usando ?

    • @Huriel
      @Huriel  2 года назад

      Eaee!! Obrigado mano! A Dock do Linux?? É a Latte Dock