Complete Guide on How to Build Chrome Extensions and Website Widgets in Bubble

Idea
1

Hey bubblers, I’m the founder of Heyhi.io , (and https://replayhero.io, https://pain.land) which I fully built in Bubble!

I’m thinking to write an e-book/guide called
Complete Guide on How to Build Chrome Extensions and Website Widgets in Bubble
Basically I would explain (step-by-step) how I implemented Heyhi overcoming all the tech limitations that Bubble has when it comes to:

  • Loading a Bubble app in an iFrame embedded in a website with a script added in the HTML Header of the website;
  • Handling communication between an iFrame and a Bubble App;
  • Performing cross-origin REST Api calls from the Bubble app loaded within the iFrame;
  • Sending Javascript callbacks data to the Bubble app;
  • Managing cookies (cross-origin);
  • EXTRA access to a project with Reusable Components like: Payment module (with Stripe), Basic Admin Page, Basic responsive Landing Page;

Are you interested in this guide?
:white_check_mark: IF YES: what would you love to see in the book?
:x: IF NO: what’s the first tech challenge do you face while using Bubble?

[UPDATE] link to the course https://71lines.com

37 Likes
2

I would very much be interested.

I’ve been holding off on some projects because of the browsers crusade to remove cross origin cookies/ Iframe elements.

I keep seeing “jwt authentication” as the next progression. So my concern is building out these only to have Chrome push an update which kills it overnight. Is this related or do I have my wires crossed?

Additionally, my interests would be with the widgets like having a chat button more than the Chrome Extensions but I’m sure I would be open to looking into both at some point!

2 Likes
3

Yes. A few examples, plus best way to create embeddable forms (non-iframe).

1 Like
4

Thanks! What do you mean by “embeddable form”, can you give me an example?

5

:white_check_mark:

1 Like
6

an example of a simple chrome extension.
e.g. a copy of pin to pinterest which saves a site to your bubble database (e.g. a field type text underneath a thing called “websites” created everytime you press “pin to site”).

great initiative! @matteo

2 Likes
7

Thanks so much, that would be a great small project example!

2 Likes
8

Definitely interested in this. I had an idea for a similar application but just didn’t really know where to start.

1 Like
9

Interested

1 Like
10

Yeah, would be great to see :+1:

2 Likes
11

Hey @matteo,

A full breakdown on embedding iFrames to work in browser extensions and pages would be great! Especially managing the cookies. Safari is a nightmare!

I have achieved the necessary functionality in several applications but would be amazing to have a solid system to reference.

2 Likes
12

the limitations creating a chrome extension

1 Like
13

Would definitely be interested.

I didn’t know you could build a chrome extension using bubble. Would that mean you could also build a Shopify app/extension using bubble?

14

Definitely interested

2 Likes
15

Thanks! What do you mean by “embeddable form”, can you give me an example?

16

Creating Chrome extensions via WebDGap is fairly easy, but getting that extension to have access to the “browser data” (i.e. what is the currently open tab) would be amazing.

1 Like
18

+1 for a website widgets ebook
would love to ‘embed’ a Bubble widget in an external site

2 Likes
19

This guide seems very promising. Looking forward to see it! :grin:

1 Like
20

Very interested in the embeddable Bubble widget in an external site.

1 Like
21

I’d 100% buy this… why don’t you test the market and create a quick live event, or video explaining the basics and offer a discounted prepayment option to fund its creation.

1 Like