Getting Started

Here are some tips for getting your app setup with Foundation.

YouTube video series. Some videos may be out dated.

Setup Guide:

1. Install your template and create your app

From within your Bubble account, go to the Foundation marketplace and install the template.

Once installed, click "Create an app" and select the Foundation template. Then name your app and click Get Started.

2. Bubble Setup Wizard & Plan

Using the wizard helps get a few important things out of the way immediately. All of this can easily be changed later, so don't worry.

1. Name your application and upload your favicon.

2. Select your app's default font. The majority of text in the app uses this font.

3. Update your primary color. Many buttons and highlighted areas of the app use the Primary color defined here. Update the other colors as needed during development.

4. All plugins required for the template are already installed. You can skip this step and finish the wizard.

5. Upgrade your Bubble hosting plan (depends on your requirements).

3. Open admin portal to finish setup

The admin portal is where many of your app's settings are managed, making it easy to update aspects of your app without logging into Bubble.

The template database comes with an existing dummy admin user. Navigate to your User database table and "Run As" [e-mail].

Once logged in as an app admin, you can access the admin portal by clicking your user profile picture in the top right of the page. The menu has an admin link that's only visible to admin users.

To create a new admin account, you will need to go through the existing Sign Up flow and add the App Admin role to your new user from the Bubble database. You can also manage User's roles from the Users tab in the admin portal.

For demo purposes, the admin portal is visible to the public but nothing can be changed unless you're logged into an App Admin user account.

There is a disabled workflow on the admin editor page that will redirect non-admin users to the index page. Just enabled it to block unauthorized access.

4. Configure app branding, navigation and other settings

Within the admin portal, you have access to a variety of tools to manage your app. These are explained in more detail in the Admin Portal section.

5. Setup API Keys

Some functionality requires external APIs to work. You'll need to add your own API keys to use them.

SendGrid - transactional emails

SendGrid Setup:

SendGrid is an email platform that's used to send users transactional emails like a Welcome email or notifications. A free SendGrid account will work for most situations.

You'll need to authenticate your app's domain in SendGrid by adding some DNS records in your domain registrar.

Once authenticated, get your API Key from SendGrid.

Bubble Setup:

Add your API Key to the "Email HTML (or MjML)" plugin:

OpenAI - chat bot

To enable the built-in chat bot, you'll need to get an API key from OpenAI.

Add your API Key in the API Connector plugin to the OpenAI API

Stripe - subscriptions and payments (PRO)

Stripe is used to capture and manage User subscriptions to your app. The template makes this process super easy to manage and update as needed.

To get started, you'll need a Stripe account and the API keys.

1. Add the keys in two places:

   1. API Connector > Stripe API

   2. Stripe plugin.

2. In the "Get Stripe Prices" API, add 'data.product' to the expand[] parameter. Example below.

3. Make sure the Stripe Plugin has Checkout v3 selected.

Make sure to use your development keys while building so you can make test payments.

---

API Connector Plugin > Stripe:

Update Expand Parameter:

Stripe Plugin:

Google - Single Sign On (PRO)

You'll need to get an App Secret and an API Key from Google Cloud Console to enable Google Sign On.

Here's a great video for more help:

https://www.youtube.com/watch?v=XuUkshWifok

Nice work! Now that your app's foundation is in place.