Skip to content
master
Switch branches/tags
Go to file
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
src
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

React Google Calendar Events List

Setting it up w/ your calendar

Pass the prop apiKey to your Google API Key, then set the prop calendarId to your desired calendar's ID (find this from calendar.google.com -> my calendars -> settings -> the calendar you want to map -> Calendar Address -> Calendar ID).

Example

https://codesandbox.io/s/xrwl1mk31z

import React from 'react';
import { render } from 'react-dom';
import Calendar from 'react-google-calendar-events-list';

render(
  <React.Fragment>
    <div>
      <h2>Function as children</h2>
      <Calendar
        calendarID="en.orthodox_christianity%23holiday%40group.v.calendar.google.com"
        apiKey="AIzaSyAunY2R4utMXaWe1uAxIRdcRsbUlI8yhL8"
      >
        {({ loading, events }) =>
          loading ? <div>loading</div> : <div>{JSON.stringify(events)}</div>
        }
      </Calendar>
    </div>
    <div>
      <h2>Default output</h2>
      <Calendar
        calendarID="en.orthodox_christianity%23holiday%40group.v.calendar.google.com"
        apiKey="AIzaSyAunY2R4utMXaWe1uAxIRdcRsbUlI8yhL8"
      />
    </div>
  </React.Fragment>,
  document.getElementById('root'),
);

About

A Reusable react component that pulls events from your google calendar.

Topics

Resources

License

Packages

No packages published