React Google API - reactjs

Question

I am new to React and RN. I have looked into every single solution here but I did not find a solution for my case. I am trying to pull google calendar events from calendar v3 api. I have tried two ways, so far. I don't know which one is correct but I did not get a correct result for any of them. Firstly, I have tried to send a request to the https://www.googleapis.com/calendar/v3/calendars/${CALENDAR_ID}/events?key=${API_KEY}( I don't know if the key parameter is needed. I think we should delete key parameter in front of the api key.I did it like that because otherwise it was giving an error as global not found).
This is calendar.js
const CALENDAR_ID = 'public#qeqw'
const API_KEY = 'key'
let url = `https://www.googleapis.com/calendar/v3/calendars/${CALENDAR_ID}/events?key=${API_KEY}`
export function getEvents (callback) {
request
.get(url)
.end((err, resp) => {
if (!err) {
const events = []
JSON.parse(resp.text).items.map((event) => {
events.push({
start: event.start.date || event.start.dateTime,
end: event.end.date || event.end.dateTime,
title: event.summary,
})
})
callback(events)
}
})
}
This is app.js
import React from 'react'
import { render } from 'react-dom'
import { getEvents } from './gcal'
import { View, Text,
StatusBar,Image,AppRegistry,ScrollView,StyleSheet,Platform,FlatList} from
'react-native'
class App extends React.Component {
constructor () {
super()
this.state = {
events: []
}
}
componentDidMount () {
getEvents((events) => {
this.setState({events})
})
}
render () {
return (
// React Components in JSX look like HTML tags
<View>
<Text>{this.state.events}</Text>
</View>
)
}
}
However, I got an error in the below. I don't know what I am doing wrong but it should be possible to send a request like that. My only concern is that if I need to get token by giving my client information by using OAuth2 authentication. Do I need to sign up and and get token to reach the API? If I need to do it, I have implemented to do it in node js by reading the sample here.https://developers.google.com/calendar/quickstart/nodejs but there are some node modules which I cannot use them in my React native application like fs, googleAuth, readline etc... Some of them can be done by using nodeify but others throw an error. So, I don't know what to do from now on. If someone can guide me how I would use google calendar api in react, I'd be appreciated. Thanks to the everyone who contributes here.
{
"error": {
"errors": [
{
"domain": "usageLimits",
"reason": "dailyLimitExceededUnreg",
"message": "Daily Limit for Unauthenticated Use Exceeded. Continued use requires signup.",
"extendedHelp": "https://code.google.com/apis/console"
}
],
"code": 403,
"message": "Daily Limit for Unauthenticated Use Exceeded. Continued use requires signup."
}
}

Answer 1

As the error message indicates, you are beyond your usage for that API.
You need to sign up in order to continue to use the API.
Once you sign up, you can use a library like Request-Promise in order to make the API request.
OR
You can search npm for a react component that interfaces with the Google Calendar API, such as this one

Answer 2

The error is caused from an silly mistake. The key parameter in the url should not be in parenthesizes. The reason it did not work is that the parameter key which is in front of the api key is in parenthesize. If you delete it, it works like a charm.