title: Posting to .NET Core WebAPI with ReactJS frontend and fetch api
body: <p>I am learning how to build a .NET Core web api so I decided to try a simple POST request to the backend with fetch() in the frontend. </p>
  
  <p>Front-end</p>
  
  <pre><code>const Form = () =&gt; {
    const submission = {
      contactNumber: "123153214",
      name: "JJ Lin",
      group: 5,
      tableId: 3,
      isAccompanied: true,
    };
  
    const handleSubmit = async (event) =&gt; {
      event.preventDefault();
      fetch("https://localhost:5001/api/guest-submission", {
        method: "POST",
        mode: "no-cors",
        headers: {
          "Content-Type": "application/json",
        },
        body: JSON.stringify(submission),
      })
        .then((response) =&gt; {
          if (response.status !== 200) {
            console.log("not ok" + response.status);
          }
        })
        .catch((err) =&gt; {
          console.log(err);
        });
    };
  
    return &lt;button onClick={handleSubmit}&gt;Click here to submit&lt;/button&gt;;
  };
  </code></pre>
  
  <p>On the backend, I have a guest class:</p>
  
  <pre><code>    public class Guest
      {
          public string ContactNumber { get; set; }
          public string Name { get; set; }
          public Group Group { get; set; }
          public int TableId { get; set; }
          public bool IsAccompanied { get; set; }
      }
  
  </code></pre>
  
  <p>With my controller as such: </p>
  
  <pre><code>[HttpPost]
          public ActionResult SubmitGuest([FromBody]Guest guestInput)
          {
  
              var guest = new Guest
              {
                  ContactNumber = guestInput.ContactNumber,
                  Name = guestInput.Name,
                  Group = guestInput.Group,
                  TableId = guestInput.TableId,
                  IsAccompanied = guestInput.IsAccompanied
              };
              Console.WriteLine(guest.Name);
  
              return Ok();
          }
  
  </code></pre>
  
  <p>Using Postman worked for me. But using the react frontend I built, I kept receiving a 415 error.</p>
  
  <p>Can someone enlighten me pls? Thanks for your help!!!</p>