How to use Netlify Forms in React JS

Поділитися
Вставка
  • Опубліковано 8 лют 2025

КОМЕНТАРІ • 34

  • @jord_n
    @jord_n 4 роки тому

    What a coincidence, I was just thinking about how I would get this done, and then I checked my subscriptions. Thanks a lot, this method so much easier than what I was otherwise going to do.

    • @haydn-co
      @haydn-co  4 роки тому

      You are so welcome! I'm really stoked it helped.

  • @anthonyradin7166
    @anthonyradin7166 3 роки тому

    Thank you. You've contributed to my education as a react developer. Sincerely, Tony Radin.

    • @haydn-co
      @haydn-co  3 роки тому

      Wow. That's so awesome! Happy to help.

  • @heatherherries9359
    @heatherherries9359 2 роки тому

    Thank you! Great informative info! Might think about making an add on with form validation. Thank you again!

  • @th0mas.p4ttz
    @th0mas.p4ttz 3 роки тому

    Awesome - just what I was looking for, thank you.

    • @haydn-co
      @haydn-co  3 роки тому

      Stoked! You're welcome.

  • @eltonsantos8804
    @eltonsantos8804 3 роки тому

    Hi Teacher! Its amazing, I've been learning a lot things with you! Congrats you are a good professional. Have a good day.

  • @guicaalmeida
    @guicaalmeida 3 роки тому

    Great, straightforward video. Thanks!

    • @haydn-co
      @haydn-co  3 роки тому

      Very welcome Guilherme.

  • @hamitaksln
    @hamitaksln 3 роки тому

    Great tutorial. Thanks.

    • @haydn-co
      @haydn-co  3 роки тому +1

      Thank you so much!

  • @hillaryvanotten712
    @hillaryvanotten712 2 роки тому

    This is great thank you!

    • @haydn-co
      @haydn-co  2 роки тому

      Netlify Forms rock.

  • @nikoman71326
    @nikoman71326 4 роки тому +6

    Thanks for the video. You don't mention anything about including static HTML form to index.html. It doesn't work without it. Netlify doesn't recognize the form without these lines. Please correct me if I am wrong

    • @haydn-co
      @haydn-co  4 роки тому +1

      I'll eventually do a static HTML video. But I was in a React phase. Yes, some things will different between React and Vanilla HTML with React Forms.

    • @SeeRjED
      @SeeRjED 3 роки тому +3

      ​@@haydn-co From what I found you do need to add a static (hidden) HTML version of the form in index.html (or any html file) for it to work with your React app.

    • @heatherherries9359
      @heatherherries9359 2 роки тому

      Yep tried it and it doesnt work. Back to the drawing board. Sigh.

  • @mikemoradi1084
    @mikemoradi1084 2 роки тому +3

    Good video, but it didn't work initially. I had to add a hidden html form in my index.html file like this. . Without it I would get a 404 error when submitted.

    • @haydn-co
      @haydn-co  2 роки тому

      Oh interesting. I keep the honeypot in by default. But it usually works without. That’s good to know.

  • @manueljarrin4582
    @manueljarrin4582 Рік тому

    Can you do an ajax form submission example using react?

  • @tjtechi4448
    @tjtechi4448 4 роки тому +1

    what about I don't want it to go to the Netlify website after submission.? Please can you show that?

    • @haydn-co
      @haydn-co  4 роки тому +1

      Yep! It’s in the works

    • @haydn-co
      @haydn-co  4 роки тому +2

      Check it out.
      ua-cam.com/video/TmXrJ2o10B0/v-deo.html

  • @prajwalpatankar600
    @prajwalpatankar600 3 роки тому +1

    My form isnt visible on netlify, and i get error 404 on submitting, can anyone help me out?

    • @haydn-co
      @haydn-co  3 роки тому +1

      Hmmm. Double check the URL structure. An error 404 (probably the most famous of all of the error numbers) is page not found. Double check it works on the dev side (I use gatsby so for me it's gatsby develop). If it doesn't work locally, it won't work on Netlify.
      You're gonna get this Prajawal. It's usually something small. I remember one time I used a dash (-) instead of an underscore (_) and spent an hour trying to figure out why my page wouldn't so up.

    • @prajwalpatankar600
      @prajwalpatankar600 3 роки тому +1

      After struggling for 10hrs, i realised that i had used routing in my App.js, and the component with the form was thus not recognised by netlify. I used react-snapshot and got it corrected. Thanks 🙏🙏

    • @haydn-co
      @haydn-co  3 роки тому

      @@prajwalpatankar600 it’s always the small things I tell ya.

  • @RakeshKumar-zj4hu
    @RakeshKumar-zj4hu 4 роки тому +1

    Is this react or Next with react? I'm getting a warning of onSubmit is a function and not a string. :(

    • @haydn-co
      @haydn-co  4 роки тому

      It’s React. I’m using Gatsby but it is just a react framework.

    • @RakeshKumar-zj4hu
      @RakeshKumar-zj4hu 4 роки тому

      and hence you did not see warning?

    • @haydn-co
      @haydn-co  4 роки тому

      Nope. My terminal came back success. I’m sorry you’re struggling.

    • @KHANSOFFICIAL
      @KHANSOFFICIAL 3 роки тому

      Any solutions for this