Prerequisite

• Having an ApyHub account, make sure that you have created your account on ApyHub
• You should have an account on DronaHQ with Cloud Login.
• You should know how to configure the REST API connector. You can learn more about configuring REST API with various authentication methods from here.

Creating API Key and Utilizing ApyHub APIs

Featured APIs for App Development

OfficeSpot : Building the meeting room booking app with DronaHQ

Configuring REST API Connector: ApyHub

Fetching time zones via API

1
curl --request GET \\
2
  --url <https://api.apyhub.com/data/dictionary/timezone> \\
3
  --header 'Content-Type: application/json' \\
4
  --header 'apy-token: api-token-of-your-account'

Sending Request and Generating Invite via API

1
{
2

3
    "summary":"{{summaryVal}}",
4
    "description":"{{descriptionVal}}",
5
    "organizer_email":"{{organizerEmailVal}}",
6
    "attendees_emails":["{{attendeesEmailVal}}"],
7
    "location":"{{locVal}}",
8
    "time_zone": "{{timezoneVal}}",
9
   "start_time":"{{startTime}}",
10
    "end_time":"{{endTime}}",
11
    "meeting_date":"{{meetingDateVal}}"
12

13
}

Building Dynamic UI: Diverse Controls in DronaHQ

Adding Actions and Functionalities

Adding Time Zones

Adding Actions and Functionalities

• Initiate a request to the API, retrieving 'invite.ics' file data.
• Generate a URL for the obtained '.ics' data.
• Send invite using the URL via email connector.

1. Insert a JS Code action block to convert UINX time and date format from our controls (i,e., Date picker and Time picker) to HH:mm and DD-MM-YYYY format respectively. This can be done by using a simple JS code for transformation.
   1. Select the keywords of the control.
   2. Insert JS code, for example:

   1
   dt = moment(Number(date)).format('DD-MM-YYYY')
   2
   st = moment(Number(startTime)).format('HH:mm');
   3
   et = moment(Number(endTime)).format('HH:mm');
   4
   output = {
   5
   "date": dt,
   6
   "starttime": st,
   7
   "endtime": et
   8
   };

   
   :::info
   In the image/code presented above, moment.js is utilized, a pre-installed library within DronaHQ. This platform conveniently provides several pre-installed JavaScript libraries, simplifying JavaScript code creation. Additionally, users have the flexibility to
   import JS libraries.
   :::
   c. Upon clicking Continue, proceed to the next configuration section to save each output in distinct variables. Finally, click Finish.
2. Add Server-Side action of our inviteIcs API.
   1. Assign keywords for each dynamic variable used as parameters for the API request.
   2. We can now use the JavaScript output variables as keywords to pass date, start time, and end time for parameters.
   3. 
   4. Proceed by Continue, store the retrieved output (ics file data) in a variable and click Finish.
3. To create a URL out of the ics data, we will be using server-side action of AWS S3 – Upload File, This action allows for the transmission of the invite.ics data and facilitates the retrieval of its URL.
   1. Specify the bucket name and set the key as invite.ics.
   2. Select the obtained data from inviteIcsAPI using keywords for theFiles` section.
   3. Mention content type as: text/calendarto ensure proper handling of the calendar data.
      
   4. Continue and save the output URL in a variable, then click Finish.
4. Integrate the Gmail – Send Mail server-side action to execute the final step. This action aims to dispatch an email to all attendees containing event information, including a calendar invite.
   1. Provide the details.
   2. Select content type: Plain.
   3. Under Attachment(s) segment, put the keyword for the obtained URL from AWS S3 output.
      
   :::tip
   In the provided image, within the 'Message' section, a text message has been combined with keywords. This combination allows the event details from the control to be sent to attendees via email.
   :::

OfficeSpot Application – Preview and Working

With DronaHQ, you can head over to ‘Preview’ to see how your app is working, before you publish it to your end users.

1. Working with environments on DronaHQ,
2. Managing user permissions for apps as well as for connectors,
3. Creating public URLs for your apps and embed sharing option.

Join ApyHub now and start building at scale through APIs