— 14 min read
Building Calendly Walkthrough: Integration with Google Calendar and Zoom
I use Calendly a lot in my day to day to book meetings that fit within my schedule, and as I continued to use it, I wanted to see if I could build the core functionality of the tool in Airkit. There were a few things I wanted to make sure we could do in Airkit, which is connect to both google calendar and zoom, be able to programmatically get all of the free slots on my calendar in 30 minute increments, and programmatically generate zoom links attached to calendar invites.
With that in mind, this tutorial will walk through the steps on how to build a Calendly clone, integrated with Google Calendar and Zoom. There is also a video of this build published on the Airkit YouTube Channel, so feel free to follow that tutorial as well. Let’s get building!
When a user visits the application, they will see a calendar with an availability list of 30 minute appointment slots where they can choose and confirm an appointment time of their choice.
Once the user selects the time slot. They will be presented with a form where they enter details about themselves (name and email address), add additional guests, and a message for the meeting. When they click on Schedule Event, Airkit will then create an appointment, send out meeting invitations to all participants along with a Zoom Meeting link.
You can check the application out here: https://app.airkit.com/calendly
To build along with this tutorial, you will need a few things to get started:
- Access to Airkit Studio
- A Google Developer account
- A Zoom Developer account
Creating APIs for the Google Calendar and Zoom Meetings
Let’s start with the Google Calendar API. One of the first things you will need to do to get started is create a project in the Google Developer Console. You will need to create a new project called Calendly Airkit and then select it. Next add the Google Calendar API.
After enabling the Google Calendar API, you will need to configure the Credentials with an OAuth client id.
Provide the OAuth consent screen with the appropriate information and then you will need configure any scopes which are necessary for the Google Calendar API to work with this newly established Project:
- Google Calendar API – /auth/calendar
- Google Calendar API – /auth/calendar.readonly
- Google Calendar API – /auth/calendar.events
Now are you able to create the OAuth Credential. You will need the redirect URI which can be found in this doc. Because my organization is in the US region, I use the below redirect URI.