Getting Started
Whether you’re a seasoned developer or interested in trying out “vibe coding” (creating your own applications using emerging AI tools), we’re here to help! Let’s start by defining some basic terms… Admin API (Application Programming Interface): On Mighty, our Admin API lets you (as a Host) connect 3rd-party services to your Mighty Network, then push and pull information. Example: syncing your community’s member data with Salesforce or another CRM. Headless API: Our Headless API (currently invite-only) lets you create custom applications that your members can connect and interact with as themselves. Example: embedding a custom “personality quiz” for members to take, then share their results. Embeds (iframes): The way 3rd-party applications and websites can be embedded directly into your Mighty Network. When coupled with either API and our “authenticated iframes” feature, custom applications can now seamlessly integrate with your community. Note: For the most seamless iframe experience across all platforms, you’ll need to ensure that you’re on the following builds or later:- iOS: 8.274.80
- Android: 8.274.43
Lovable Library
There are many services that can help you on your vibe coding journey (including Replit, Netlify and more), but we’re big fans of Lovable, and have created a library of sample starter applications for you to easily “remix” and adjust for your own community. They’re all pre-configured to work with any Mighty Network, and you’ll simply need to add your community’s API keys and basic information when asked. Just create a Lovable account, then choose from one of our starter options to remix (make your own editable copy)..png?fit=max&auto=format&n=yttUQtD_2_BfVa1C&q=85&s=80717ee92c2e69f4e3e83df6955f16f8)
- Basic OAuth Sample (Headless API)
- Member Map Sample (Admin API)
- Leaderboard Sample (Admin API)
- Mini-Website Sample (Admin API)
- Survey Sample (Headless API)
- Personality Quiz Sample (Headless API)
- Habit Tracker Sample (Headless API)
Admin API Features
Admin API apps act as the host — no member sign-in, no OAuth app needed.- In Mighty, go to Admin > Integrations > Admin API and click New API Key. Give it a name specific to this feature (ie: Member Map) — use a separate key per Lovable app.
- On the same Admin API page, grab your Network ID.
- If the feature needs to target one specific Space, open that Space in a desktop browser and copy the number near the end of the URL — that’s the Space ID.
- In Lovable, remix the sample and fill in whatever it asks for (typically the API key + Network ID, sometimes Space ID).
- Publish the app in the upper right corner
- Embed it in Mighty: open a Page, Article, Lesson or anywhere you can embed
- If you see the checkbox at the bottom: “This embed uses a Mighty OAuth application” you don’t need to select it.
- Add your Lovable application’s full URL (ie: https://survey-trailheads.lovable.app)
- Once embedded, you can adjust the “title” and height to your liking.
- You can also decide if you’d like the embed to be narrow or wide (when viewed on desktop computers).
Headless API
For any of the Lovable sample projects that use the Headless API to allow your members to connect, you’ll first need to create a new OAuth Application in your community’s Admin area.Creating OAuth Applications
Go to Admin > Integrations > OAuth Applications Select “New OAuth Application”
- Application Name: Give the Application a name (ie: Hiking Tracker)
- Redirect URI: Temporarily paste in your Network’s URL (you’ll change this after you publish your feature)
- Decide what permissions you want the new feature to have.
- If this is for members, we recommend selecting all the “Member Scopes” checkboxes.
- Here’s an example of what to select if you were creating a Habit Tracker for your members.
- After you have created the OAuth Application, head back to Lovable
- It will ask you for these pieces of information:
- Client ID: Copy from the OAuth Application
- Client Secret: Copy from the OAuth Application
- Network ID: Go to Admin> Integrations > Admin API to find this
- Session Secret: Sometimes you will see this, you can add in the word “blank” or anything you’d like in that field, as these are generated automatically for members (or just tell Lovable that it’s not needed.
- Subdomain: You can find this in your Network url (ie: https://trailheads2025.mn.co/ would be trailheads2025)
- Session Secret: Add in your own strong, random, secret value here. You can generate one easily via Lovable Cloud → Secrets → Generate Secret.
- After remixing one of the templates and filling out the requested information, publish your Lovable application in the upper right corner.
-
Once published, you’ll see an (expected) error message about the Redirect URI not being valid. To fix this, ask Lovable to do the following:
To fix the Redirect URI error, please give me every possible Lovable preview URL I need to share back with Mighty (including preview URLs within popups) along with the redirect URI for the published application.
- Head back to your Network and edit your OAuth Application.
-
In the Redirect URI box, remove your Network url and add all of those provided URIs and save your changes.
- Your feature should now work across all platforms, including within the Lovable preview area so that you can easily iterate and adjust before republishing any additional changes you’d like to make.
- Note: that to work within the Lovable preview area, you’ll see a brief popup window when connecting, but this popup won’t be present when embedding your application into Mighty, or accessing it at its standalone URL.
- Finally, you will embed it in Mighty: open a Page, Article, Lesson or anywhere you can embed
- Add your Lovable application’s full URL (ie: https://survey-trailheads.lovable.app)
- Be sure to select the checkbox “This embed uses a Mighty OAuth application”
- Once embedded, you can adjust the “title” and height to your liking.
- You can also decide if you’d like the embed to be narrow or wide (when viewed on desktop computers).
Important Notes and Tips
- When creating a new OAuth Application, you can decide how much access (and for which roles) to offer, and we always suggest keeping it scoped as narrowly as possible (only ask for what your app will need). Additionally, keep the “Confidential client” option checked and the “Skip consent screen” unchecked (these are the defaults anyway) unless needed for your specific case.
- When customizing your application, always be sure to prompt Lovable to properly store secrets (like API keys/secrets) or sensitive information (it should never appear in the code, and Lovable will help you with this).
- Before publishing and launching, ask Lovable to do a security review on your project.
- We’ll continue adding and updating our sample projects, so please check back often!