How to add a custom domain to Bubble.io app: Step-by-Step Guide

Adding a Custom Domain to a Bubble.io App

 

In this guide, we'll walk you through the detailed and comprehensive steps to add a custom domain to your application on Bubble.io, a powerful no-code platform for building web applications. This process involves a combination of setting up your domain registrar and configuring Bubble.io to recognize and use your custom domain.

 

Prerequisites

 

• A Bubble.io account with an active project that you want to connect to a custom domain.
• Ownership of a domain name through a domain registrar (e.g., GoDaddy, Namecheap, Google Domains).
• Basic understanding of DNS settings such as CNAME and A records.
• Access to your domain registrar's account to update DNS records.

 

Understanding Domain Concepts

 

• Domain Name: A readable address used to access your application on the internet (e.g., example.com).
• DNS (Domain Name System): Translates domain names into IP addresses, allowing browsers to load internet resources.
• CNAME (Canonical Name Record): Maps your domain to another domain, often used for subdomains.
• A Record: Maps a domain name to an IP address, commonly used for the main domain.

 

Configuring Your Bubble.io App

 

• Log in to your Bubble.io account and navigate to your application's editor.
• On the left sidebar, click on the "Settings" tab, then select the "Domain/Email" section.
• In the "Custom Domain" field, enter your domain name (e.g., www.example.com).
• Click "Set domain" to save your settings.

 

Setting Up DNS Records at Your Domain Registrar

 

• Log in to your domain registrar account where your domain is registered.
• Navigate to the DNS management section for your domain.
• Add or modify the following DNS records:
  • A Record: Point the root domain (example.com) to Bubble's IP address. The current IP for Bubble will be provided in Bubble's settings.
  • CNAME Record: Point the subdomain (www.example.com) to app.bubble.io.
• Ensure there are no conflicting DNS records for the root or subdomain which might cause DNS resolution issues.

 

Verifying Domain Setup on Bubble.io

 

• Return to Bubble.io and remain in the "Domain/Email" section after setting the custom domain.
• Look for the verification status to ensure DNS changes have been correctly recognized.
• Verification can take up to 48 hours, although it usually completes much sooner.
• Once verified, your domain setup status should reflect completion with a confirmation message.

 

Testing Your Custom Domain

 

• After verification, ensure your application is correctly accessible through the custom domain.
• Enter the domain in a web browser (e.g., www.example.com) to test that it redirects to your Bubble.io app.
• Ensure SSL certificates are active for secure connections. Bubble.io should automatically configure SSL when your domain is verified.

 

Troubleshooting Common Issues

 

• If your domain isn't verifying, double-check DNS settings and ensure they match Bubble's instructions.
• Propagating DNS changes across the internet can take some time, so exercise patience if changes don't immediately reflect.
• Use online tools like DNS Checker to verify that your DNS records have propagated correctly worldwide.
• Contact Bubble.io support or your domain registrar for assistance if issues persist.

 

By following these detailed steps, you can successfully add a custom domain to your Bubble.io application. This enhances your app's professionalism and aids in brand recognition by having a dedicated web address. With these configurations, you'll ensure a smooth, secure, and reliable setup for your app's users.