How can I convert Google calendar events to date object for react-big-calendar

Question

So I want to use the week view for RBC. I keep getting TypeError: date[("get" + method)] is not a function

There are a few issue reports that all say that I need a date object and in fact, I can open the calendar when I use this example

var myEventsList = [{
 {
    'title': 'Meeting',
    'start': new Date(2017, 3, 12, 10, 30, 0, 0),
    'end': new Date(2017, 3, 12, 12, 30, 0, 0),
    desc: 'Pre-meeting meeting, to prepare for the meeting'
 },
   {
    'title': 'Lunch',
      'start':new Date(2017, 3, 12, 12, 0, 0, 0),
      'end': new Date(2017, 3, 12, 13, 0, 0, 0),
    desc: 'Power lunch'
  }]

So I know that I need to convert my start: 2019-05-14T12:00:00.000Z, to new Date( x,x,x,x,x)

I've tried doing this on the backend with a thing like this

      for (let i = 0; i < data.length; i++) {
          events.push({
          title: data[i].summary,
          start: new Date(data[i].start.dateTime),
          end: new Date(data[i].end.dateTime)

I've also tried moment(data[i].start.dateTime) along with a host of different google search suggestions with all kinds of .format(), .todate(), etc but I keep getting errors.

UPDATE :

I've also tried setting it up in my frontend with this bit

 const events=[]
 const makeDatobj = (data) =>{
   events.map(event => ({
    title : event.title,
     start : new Date(event.start)
   }));

which I hope to initialize with

    <BigCalendar
            ...
             localizer={localizer}
             events={events=>makedatobj(data)}
             step={70}
             timeslots={2}
             defaultView="week"
             ...
           />

But that gives me TypeError: data.map is not a function

which just reminds me that I don't know how .map() Works and I keep coming up against similar issues when I try to use it...I've tried a few other methods of parsing the incoming data with similar degrees of failure. I notice that when I try to process the incoming data, I inadvertently shut off my api request so I don't have any data to work with....I'm really making this way more difficult than it needs to be.

I just need a simple answer. How can I convert. start: 2019-05-14T12:00:00.000Z, to start: new date( x,x,x,x,x) ?

Answer 1

The Date constructor can also take a string as a parameter, so you can do:

start : new Date("2019-05-14T12:00:00.000Z")

So it sounds like your backend should be like this, returning the dates as strings:

for (let i = 0; i < data.length; i++) {
  events.push({
  title: data[i].summary,
  start: data[i].start.dateTime,
  end: data[i].end.dateTime
}

And your frontend code should be like this, converting them to Javascript Dates:

events.map(event => ({
  title : event.title,
  start : new Date(event.start)
}));