## About:
npm install @citizendev/bubble-paginatorThis is a simple proof-of-concept to set up a viable development workflow to build a Bubble plugin element using Preact.js.
The aim is to allow plugin developers to break out of the limited Bubble plugin SDK.
Write up:
1. Clone this repository, run yarn to install dependencies.
2. Create a Bubble plugin. You can also fork this plugin to skip the next Bubble plugin setup steps.
1. Add this piece of code into the shared header of Bubble:
``
2. Add a new Bubble plugin element. Set the update function as below:
`
function(instance, properties, context) {
if (!instance.data.element) {
instance.data.element = document.createElement("custom-counter");
instance.canvas.append(instance.data.element);
}
instance.data.element.properties = properties;
}
3. Add the plugin into a test app, and set the DEV_SERVER_URL plugin key to be http://localhost:3000.yarn dev` on your machine.
4. Put the new Bubble element in your test app.
5. Run
6. Open test app.
- No hot reload right now. When you update the Preact code, you need to reload the browser tab again.
- Speed optimization is still in question.