A MELHOR FORMA de Criar FORMULÁRIOS no REACT | React Hook Form

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

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

  • @eduardofagundesferreira8891
    @eduardofagundesferreira8891 Год назад +2

    Cara!!! Parabéns! Queria ter te encontrado quando comecei com Hook Form... parabéns mesmo. Show!

  • @brunoarrm
    @brunoarrm 11 месяцев назад

    Estou precisando muito usar essa biblioteca e não estava entendendo nada. Neste vídeo ficou bem mais claro, vou lá testar. Muito obrigado irmão, sou grato por poder te seguir a partir de agora.

  • @edwardsilva1863
    @edwardsilva1863 Год назад

    Video abençoado para estudante fazendo projeto com form

  • @raphael.portela
    @raphael.portela 10 месяцев назад

    há situações em que o controller é necessario como forms que possuem selects com dados vindos de alguma API e maior complexidade, eu nao vi nenhum video no youtube aborando isso, mas muito bom conteudo, valeu por disponibilizar o repo.

  • @bck_cs2
    @bck_cs2 Год назад

    Obrigado pelo conteúdo, deu pra aprender bem o básico. Pretendo ler a documentação dessa lib, pra dar uma expandida no conhecimento.

  • @leonardomaciel5960
    @leonardomaciel5960 2 месяца назад

    é isso, você salvou minha vida 👍Obrigado.

  • @moisescruz3144
    @moisescruz3144 3 месяца назад

    Show. Conteúdo TOP. Agregou muito ao meu entendimento sobre essa lib.
    👏🏼👏🏼👏🏼🚀🚀🚀

  • @samucatnb12
    @samucatnb12 Год назад

    Felipe parabéns fenomenal sua explicação, valeu pelo video, já me tornei um seguidor seu com esse video

  • @harrisonhakinensouza
    @harrisonhakinensouza 4 месяца назад

    Ótimo vídeo, parabéns pelo conteúdo.

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

    conheci teu canal agora e achei muito dahora essas dicas que você deu! Existe uma propriedade do formhooks que é o error delay, ele faz com que espere o usuário digitar para depois mostrar o erro, assim evitando que fique mostrando o erro enquanto o usuário está digitando como no caso de 21:30.
    When set to true (default) and the user submits a form that fails the validation, it will set focus on the first field with an error.
    Note: only registered fields with a ref will work. Custom registered inputs do not apply. For example: register('test') // doesn't work
    Note: the focus order is based on the register order.
    delayError: number

  • @DanielCordeiroOficial
    @DanielCordeiroOficial 11 месяцев назад

    Olá Felipe, tudo bem com você e sua família? Espero que sim.
    Gostaria de lhe parabenizar pela aula de React Hook Form (mesmo a 1 ano, me ajudou a simplificar a forma de usa-lo)
    Porém o que procuro (e talvez consiga me ajudar) é se consigo simplificar ainda mais colocando o TextInput e toda a 'estrutura' do React Hook Form em um component

  • @GisellyRock
    @GisellyRock 9 месяцев назад

    excelente aula, voce é muito bom!

  • @rubenslima7475
    @rubenslima7475 Год назад

    Cara que inscrivel essa lib, vou usar agr msm.

  • @luccassantos7492
    @luccassantos7492 5 месяцев назад

    Obrigado pelo vídeo, professor!

  • @fernandoitalo9507
    @fernandoitalo9507 Год назад

    Video fantástico, parabéns!

  • @alexalves3293
    @alexalves3293 22 дня назад

    Tem algum vídeo que vc ensine a usar mascaramento dos inputs nesse form? Se houver, pode mandar o link? caso contrário, poderia gravar um vídeo?

  • @allandouglas2726
    @allandouglas2726 6 месяцев назад

    Explicação espetacular! parabens!

  • @thaisleikap
    @thaisleikap Год назад

    Muuuuiito bom! Obrigada por compartilhar! Ajudou demais...❤

  • @MJRkarate
    @MJRkarate 2 месяца назад

    Muito boa a didática! Parabéns
    Tem vantagem em usar o zod?

  • @Antonio-nn2kq
    @Antonio-nn2kq 9 месяцев назад

    Melhor vídeo aula!!!

  • @jonatanalmeida7837
    @jonatanalmeida7837 10 месяцев назад

    Não precisa especificar o type do erro para montar a mensagem, basta apenas digitar errors.message e definir o texto do erro depois de required por exemplo (required: "Campo obrigatório")

  • @luan-dev
    @luan-dev 11 месяцев назад

    Muito boa a aula, a mais organizada com repositório inicial que achei no youtube, fiquei apenas com uma dúvida, reparei a falta de "for" e "id" ligando os inputs e labels, isso não seria ruim para acessibilidade? Qual solução seria melhor?

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

    Vídeo FANTÁSTICO ! Obg pelos ensinamentos, estava completamento travado nas validações e obtive rios de conhecimento aqui, continua com os conteúdos, didática excelente!

  • @jonassouza9772
    @jonassouza9772 Год назад

    muito bom o conteudo e facil de intender

  • @diogomattioli
    @diogomattioli Год назад

    Excelente trabalho!

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

    Sensacional! Parabéns pela vídeo aula.

  • @Joao.Gabriel7
    @Joao.Gabriel7 Год назад

    Valeu demais pelo vídeo cara, ajudou demais a entender a lib, abraço!

  • @ranielferreiradesantana2097
    @ranielferreiradesantana2097 7 дней назад

    Muito TOP!

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

    Muito bom!

  • @thiagomartins7339
    @thiagomartins7339 Год назад

    Cara sensacional, muito grato pelo conteúdo

  • @Diego-yx8sv
    @Diego-yx8sv 10 месяцев назад

    Mas e se eu precisar usar o hook form em custom components? eu tenho meu próprio componente de input e de form, eu vou definir o register dentro do componente de input ou dentro do componente de form ou dentro do.jsx em que eu utilizo o form e o input?

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

    Obrigado pelos conteúdos mano! É valioso demais!

  • @leogomes5469
    @leogomes5469 Год назад

    Legal conhecer outras formas, mas acho mais fácil usar o required nativo do HTML e uma regex para validação, fica menos código e bem legível

  • @gabrielmoura3815
    @gabrielmoura3815 Год назад

    Sensacional!

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

    ótimo video brow, nice

  • @ma120288
    @ma120288 Год назад

    Ótimo vídeo 👏👏

  • @henriquef00
    @henriquef00 Год назад +2

    "Foco." Mais rápido que a propaganda da jequiti

  • @toffanettodev
    @toffanettodev Год назад

    Parabéns pela didática no vídeo, ótimo tema. Gosto de usar react hook form tbm, mas tem um caso chato de lidar que é qnd vc tem campos relacionados que precisa validar como por exemplo campo de confirmação de senha ou confirmação de e-mail. Como vc lida com esses casos?

  • @LeandroCorso
    @LeandroCorso 3 месяца назад

    Validar com RHF ou Zod?

  • @GeoLimiar
    @GeoLimiar 10 месяцев назад

    Curti , valeu ai

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

    Obrigado pelo super vídeo, d++++++++++++++++

  • @Lima-Js
    @Lima-Js Год назад

    opa man salve
    qual terminal você está usando?

  • @felipemiotto5409
    @felipemiotto5409 Год назад

    Muito bom, Felipe, Obrigado!
    Inscrição/like/comentário -> feito

  • @danielcampillo9679
    @danielcampillo9679 9 месяцев назад

    como faço p o cadastro ir no meu db?

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

    Mim tirar uma dúvida a personalização erro tem ser com este método validate, do import react-hook-form. OU posso criar outro nome mais significativo.
    E-mail
    validator.isEmail(value),
    })}
    />
    {errors?.email?.type === "required" && (
    Email is required!
    )}
    {errors?.email?.type === "validate" && (
    Email is invalided
    )}

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

      pra criar validações customizadas você precisa usar a validate mesmo. o que você pode fazer é criar várias validações dentro do validate, mas com nomes diferentes. por exemplo:
      validate: {
      positive: v => parseInt(v) > 0,
      lessThanTen: v => parseInt(v) < 10,
      checkUrl: async () => await fetch(),
      }

  • @ReginaldoSAM
    @ReginaldoSAM Год назад

    Top!👌

  • @icaroalbar
    @icaroalbar Год назад

    Porque eu não faço a validação usando o React Hook Forms combinado com a biblioteca Zod?

  • @danilofersilvaa
    @danilofersilvaa Год назад

    Estou usando o useForm, porém quando adiciono uma regra(tipo required) ele começa a dar um erro que é esse: "Warning: input: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. "
    E a pagina da refresh e sai os avisos de erro, alguém sabe o que posso fazer nesse caso?

  • @andrenascimento838
    @andrenascimento838 6 месяцев назад

    Usava formik, mas depois desse vídeo, é só react hook form

  • @jesusvick
    @jesusvick Год назад

    qual biblioteca para validar o CPF!?

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

    man eu sei fazer coisas basicas com javascript (to do list, calculator), vc acha que eu devo praticar mais meu javascript ou eu invisto logo pra começar react e focar em desenvolver msm em react ? (levando em consideraçao que as empresas podem mt react, como vc sabe.)

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

      estuda react ja, qndo ver uma coisa de JS q vc n sabe ai vc estuda, é assim durante toda a carreira, n tem como aprender 100% do pre requisito antes

    • @dicasparadevs
      @dicasparadevs  2 года назад +3

      Igor, torno das palavras do @Felippe as minhas! Comece a estudar React, e se você se deparar com algum tópico de JS que você não sabe/não lembra, você volta e o revisa.
      Isso, claro, se você já estiver confortável com a base e os fundamentos principais do JS (que é tudo que eu ensino aqui no meu canal, no meu curso sobre ele). Beleza?

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

      Vlwww demais manos, eu peguei bem a base de js em um curso na udemy e fiz uns projetos pelo yt (aki desse canal tbm) e vou começar react então. Tmj

  • @cloudsss83
    @cloudsss83 Год назад

    ensina a gente a fazer isso ai sem biblioteca, pq pra esse tipo de coisa, a maioria das empresas nao veem com bons olhos. adicionar uma dependencia no projeto pode aumentar a chance de bugs, quebra devido atualizacao, seguranca e outros...

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

    Você devia ter criado um formulario de enviar PIX