5. Create and Manage Google API Keys

Integrating Google API keys into your application allows you to harness the power of Google services such as interactive maps, geolocation, and more. This guide walks you through creating a Google API key and configuring it for use in Bubble.io, ensuring your app delivers seamless, enhanced user experiences.

Why You Should Own Your Development Keys

Owning your API keys is essential for maintaining control, security, and flexibility over your project’s infrastructure. Here’s why:

• Control and Ownership

  Retaining ownership of your API keys ensures that you have full access to your project's core functionalities. If you switch development partners or bring development in-house, you maintain control over your project and can manage it independently without needing to recreate keys.

• Security and Accountability

  API keys grant access to important services and functionalities in your app. By keeping these keys under your control, you minimize the risk of unauthorized access or misuse. Sharing keys securely with trusted partners allows you to monitor their use and revoke access if necessary.

• Cost Management

  Owning your keys means you can oversee API usage and billing, giving you the ability to adjust usage settings to manage costs and avoid unexpected charges. This transparency is crucial for effective budget management.

• Long-Term Flexibility

  Your project’s development shouldn’t be tied to one provider. Owning your keys ensures that if you decide to change partners or transition to a different development team, you can do so seamlessly without any interruptions.

• Business Continuity

  Retaining control over your API keys provides stability and business continuity. You won’t be reliant on any third party to manage essential services, giving you peace of mind in case of unforeseen changes in your development setup.

Step 1: Set Up Your Google Developers Console Account

Having a Google account is essential for accessing and managing services on the Google Cloud Platform (GCP), enabling billing, and setting up API keys for integration with Bubble.io.

Note: If you don’t have a Google account, visit accounts.google.com/signup and follow the prompts to create one.

Instructions:

1. Visit the Google Cloud Console:

   • Go to Google Cloud Console and log in with your Gmail account.

   • You may be prompted to provide billing details, as enabling certain Google APIs requires an active billing account.

2. Create a New Project:

   • Click “Select a Project” at the top of the page, then choose “New Project”.

   • Name your project (e.g., “BubbleAppIntegration”) and click “Create”.

Step 2: Enable Billing for Your Project

Instructions:

1. Navigate to the Billing Section:

   • Go to the Billing section in the Google Cloud Console.

2. Set Up Billing:

   • If you don’t have billing set up, follow the prompts to add a payment method.

   • If billing is already enabled, your linked billing account will be displayed.

Note: Google’s free tier may be sufficient for initial testing and low-volume usage.

Pro Tip: Understanding Your API Costs

A common question is, “How much will these Google APIs cost me?” The good news is that Google Cloud Platform (GCP) offers a generous $200 monthly credit for many of its APIs, including those integrated into your application. For small-scale projects or during initial development and testing, this credit often covers most needs. However, once you exceed this allowance, costs shift to a pay-as-you-go structure. The pricing varies depending on the specific API and the number of requests made; for example, the Geocoding API charges $5 per 1,000 requests. To put this into perspective, accruing $20 in additional charges would mean making approximately 4,000 billable requests beyond the $200 credit. This equates to about 44,000 total monthly requests, with 40,000 covered by the free tier and 4,000 incurring charges.

Monitoring usage through the Google Cloud Console is crucial to stay within your budget and avoid unexpected costs. Setting up budget alerts can help you track consumption and make adjustments when needed.

Here’s an easy comparison: if you’re spending $20 a month on API requests, that’s roughly equivalent to what many people spend at Starbucks in a week. With Google’s $200 monthly credit, most applications won’t even come close to that threshold. But if you do, think of the added expense as an investment in the reliable, robust functionality of your app—an outlay as manageable as skipping a few lattes.

If your costs are significantly higher than $20 a month, it points to one of two scenarios: either 1) you have an incredibly successful product on your hands and it’s time to celebrate, or 2) something may be amiss, and it’s wise to consult with your development partner to ensure everything is functioning as intended.

Step 3: Check Permissions

Instructions:

1. Verify Project Permissions:

   • Visit the IAM & Admin section to ensure that your Gmail account is assigned either the Owner or Editor role. These roles are required for creating and managing API keys.

Step 4: Enable the Required APIs

Instructions:

1. Access the API Library:

   • Navigate to “APIs & Services” > “Library”.

2. Search for and Enable the Following APIs:

   • Geocoding API

   • Places API

   • Geolocation API

   • Maps JavaScript API

   • Time Zone API (required for timezone functionalities)

3. Enable Each API:

   • Click on each API in the library and select “Enable”.

Step 5: Create and Configure API Keys

Instructions:

1. Navigate to Credentials:

   • Go to “APIs & Services” > “Credentials”.

2. Create API Keys:

   • Click “+ Create Credentials” and choose “API Key”.

   • Create two keys: one for Client use and one for Server use.

   • Name the keys accordingly (e.g., “Client Key” and “Server Key”).

3. Secure the Client Key:

   • Click on the Client key and choose “HTTP referrers (web sites)” under “Application restrictions”.

   • Add your Bubble app’s URL (e.g., https://yourapp.bubbleapps.io/*).

   • If using a custom domain, add https://yourdomain.com/* as a restriction.

4. Secure the Server Key:

   • Click on the Server key and select “Restrict key” under “API restrictions”.

   • Restrict the key to the five enabled APIs:

     • Geocoding API

     • Places API

     • Geolocation API

     • Maps JavaScript API

     • Time Zone API

   • Save changes after applying the restrictions.

Step 6: Share the API Key Securely with Your Development Partner

Use a password manager with sharing capabilities or an encrypted communication channel to share your API keys securely with your development partner. This ensures that your keys remain protected and accessible only to authorized users.