[SOLVED ]MERN Stack app, not creating new database entry

JavaScript
1

EDIT: I solved this, it was simple, but still a little mind boggling. I’m sure I’ll get better. all I had to do was change req.body to req.body.resource.

I sent the object in as a prop, and in the apiCall, that prop is named resource. So tat sent an object to the back end and within the object was resource: {original object here}

My code needs some refactoring, but at least it’s functioning!

=========================

I’ve done a couple tutorial MERN stack apps via the Web Developers Bootcamp by Colt Steele, and I can’t figure out what my error is here.

What;s happening: I can add/edit a new resource in my NewResourceForm component, and hit the save button, and a new entry is created in my database, but the entry is blank, containing just creation date, an ID and blank question & reference fields (these are defined in the model as arrays of objects…the get created as blankarrays). Noe of the other data is in the new entry.

Full repo here:
https://github.com/AdventureBear/emquick

More explanation and code here:

I have created a form to add a new resource in my app, and for testing purposes, have prepopulated it via state for that Component. When it’s working, I’ll refactor that easily (actually just comment out the prepopulation).

So far via console . logs, I can verify that I have an object created that matches my Resource model.

Here is the model Schema for reference:

//MODEL Resource
const mongoose = require('mongoose')

var resourceSchema = new mongoose.Schema({
  name: String,
  friendly: String,
  description: String,
  type: String,
  field: String,
  condition: String,
  created: { type: Date, default: Date.now },
  updated: { type: Date, default: Date.now },
  references: [{
    name: String,
    title: String,
    author: String,
    url: String,
    additional: String,
    accessed: { type: Date, default: Date.now } }],
  questions: [{
    title: String,
    description: String,
    options: [{
      value: Number,
      description: String,
      shortDescription: String
    }]
  }],
  pagebody: String,
})

const Resource = mongoose.model("Resource", resourceSchema)
module.exports = Resource

I"m using an API call to send this to my backend server.
Here is where the API is called (and you can see I go through all the object keys to make sure it matches)

  async addResource() {
    console.log(Object.keys(this.state))

    let newResource = await apiCalls.createResource(this.state)
    this.setState({todos: [...this.state.resources, newResource ]})
  }

Here is the actual apiCalls.createResource function:

export async function createResource(resource){
  const postURL = API_URL
  return  fetch(postURL, {
    method: 'post',
    headers: new Headers({
      'Content-Type': 'application/json',
    }),
    body: JSON.stringify({resource: resource})
  })
    .then(resp => {
      if (!resp.ok) {
        if (resp.status >= 400 && resp.status < 500) {
          return resp.json().then(data => {
            let err = {errorMessage: data.message}
            throw err
          })
        } else {
          let err = {errorMessage: 'Please try again later, the server is not responding'}
          throw err
        }
      }
      // console.log(resp.json())
      return resp.json()
    })
}

and here is my create route from the server side:

router.post('/', function(req,res){
  Resource.create(req.body)
    .then(function(newResource) {
      res.status(201).json(newResource)
    })
    .catch(function(err){
      res.send(err)
    })
})

THe new resource is created, but it’s blank in the database, despite seeing on both the browser side console and the server side console that I’m sending a resource object that matches the model.

:frowning: