title: React axios post error: "Request failed with status code 400"
body: <p>I am creating a front-end app in react with the back-end in <strong>django</strong> and using <strong>djangorestframework</strong>. Here I am working on plain form submission by calling an API endpoint. I am using <strong>axios</strong> to make the post request. I have put the axios method withing handleSubmit() method:</p>
  
  <pre><code>handleSubmit(event){
  event.preventDefault();
  
  const data = {
     first_name: this.state.first_name,
     last_name: this.state.last_name,
     dob: this.state.dob,
     sex: this.state.sex
   };
  
  axios.post('http://127.0.0.1:8000/profile/create/', data)
  .then(res =&gt; console.log(res))
  .catch(err =&gt; console.log(err));
  };
  </code></pre>
  
  <p>On the back-end i am using the <code>generics.CreateAPIView</code> view:</p>
  
  <pre><code>class CreateProfile(generics.CreateAPIView):
      serializer_class = ProfileSerializer
  </code></pre>
  
  <p>The url: <code>path('profile/create/', CreateProfile.as_view()),</code></p>
  
  <p>The models.py: </p>
  
  <pre><code>class Profile(models.Model):
      MALE = 'M'
      FEMALE = 'F'
      TRANS = 'T'
      NO_MENTION = 'NO'
      GENDER_CHOICES = [
          (MALE, 'Male'),
          (FEMALE, 'Female'),
          (TRANS, 'Trans'),
          (NO_MENTION, 'Rather not say')
      ]
      first_name = models.CharField(max_length=15)
      last_name = models.CharField(max_length=15)
      dob = models.DateField(auto_now=False)
      sex = models.CharField(max_length=15, choices=GENDER_CHOICES)
  </code></pre>
  
  <p>When I am submitting the form this error is showing in the console: <code>Error: "Request failed with status code 400"</code>.</p>
  
  <p>What am i doing wrong?</p>