React.js: nothing happens when I submit a form

Support
,
2

Hi @NineInjections, welcome to the Netlify Support Forums and thanks for the post.

Your HTML should be updated to the below.

<!doctype html>
<html lang="fr">
<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <meta http-equiv="x-ua-compatible" content="ie=edge" />
  <meta name="description" content="Bienvenue sur le portfolio de Séverine Cuenot" />
  <title>Le Portfolio de Nine</title>
  <link rel="icon" href="/favicon.ico" />
  <script defer="defer" src="/js/runtime.05b258ceef994868bf45.js"></script>
  <script defer="defer" src="/js/537.616d0dae112b4c344996.js"></script>
  <script defer="defer" src="/js/main.910868745965f78aee82.js"></script>
  <link href="/css/main.css" rel="stylesheet" />
</head>
<body>
  <div id="root"></div>
</body>
</html>

Also your Form Component should be edited to the code below.

import './style.scss';

function ContactForm() {
  return (
    <form name="contact" method="POST" data-netlify="true">

        <label htmlFor="name">Name</label> <br />
        <input type="text" id="name" name="name" required />
    
        <label htmlFor="email">Email</label> <br />
        <input type="email" id="email" name="email" required />
      
        <label htmlFor="message">Message</label> <br />
        <textarea id="message" name="message" required />
    
        <input type="submit" value="Submit message" />
  
    </form>
  );
}

export default ContactForm;

Redeploy after the changes and let me know the outcome.

If you are still having difficulties you can checkout the support guide regarding Netlify Forms in the link below.

Thanks.