Mastering Code & Plugins In Bubble
Ever felt like you've hit Bubble's limits, knowing there's a solution?
We've all been there:
- You're using a plugin but it clashes with your design and can't be styled.
- You want a specific chart, but existing plugins lack features AND look ugly.
- You need to calculate some numbers, but doing it in a workflow performs too slow.
- Your app needs a unique calendar experience, but building it in Bubble takes forever.
- A client requests an analytics integration - but there's no plugin, just a JavaScript SDK.
These are all examples of things we ran into while working on real products that we were actually building on the job. We've spent the last 5+ years figuring out how to build plugins to solve these kinds of problems.
Over that time, we learned that building with bubble is like working with a nice, simple toolbox. It's great for most things, but sometimes you need that one missing tool to finish the job.
Mastering Code & Plugins In Bubble gives you that missing tool.
Learn to code your own plugins. Stop struggling with workarounds and limitations. Instead, build exactly what your app needs, with the perfect fit and style. It's the resource we wish we had.
What you'll learn
The biggest objective of this course is to teach you how to build real plugins that solve actual problems - not just tutorial examples.
We cover fundamentals like:
- When to use custom code vs. built-in Bubble features
- Setting up a good development environment and workflow
- How to actually get the code with the help of LLMs like ChatGPT
- Understanding the plugin editor and its various features
...as well as hard topics, like:
- How to search for good libraries to use that work in plugins
- How to use npm modules and React, using JavaScript bundling
- How to debug JavaScript issues using LLMs and get the solutions
- Best practices for dealing with code to keep things performant
Every example we show is open source and accessible for you to inspect in detail.
The Course Outline
Together we'll build a few real custom code integrations & plugins from start to finish, covering everything from custom HTML elements to React integration, bundling, client actions, server actions, and API connections.
Getting Started
Learn how to set up your tools, connect Bubble with GitHub, and decide when to use code.
- 1. To Code, Or Not To Code (5 mins)
- 2. Setting Up Your Dev Environment (4 mins)
- 3. Connecting Bubble with GitHub (4 mins)
Custom Code
Learn how to use the HTML element, Toolbox plugin, and server scripts to add custom code to Bubble.
- 4. Using The HTML Element For Custom Code (8 mins)
- 5. Combining HTML Element & Toolbox Plugin (14 mins)
- 6. Using Toolbox Server Scripts (15 mins)
- 7. Using Run JavaScript Actions (13 mins)
- 8. Combining Run JavaScript & HTML Element (10 mins)
- 9. Client Side & Server Side JavaScript (7 mins)
- 10. Customizing Elements with CSS (12 mins)
- 11. Common Toolbox Issues (9 mins)
- 12. Common JavaScript Issues (9 mins)
Plugin Development
Learn how to build Bubble plugins, including element plugins, client actions, server actions and API connections.
- 13. Plugin Development Workflow (6 mins)
- 14. Exploring The Plugin Editor (11 mins)
- 15. Setting Up Plugin Properties (19 mins)
- 16. Building Your First Element Plugin (18 mins)
- 17. Element Properties & CSS Variables (21 mins)
- 18. Element Exposed States & Events (21 mins)
- 19. Working With Element Actions (22 mins)
- 20. Remaining Element Features & Publishing (20 mins)
- 21. Interactive vs Non-Interactive Elements (12 mins)
- 22. Bundling React & NPM Libraries (30 mins)
- 23. Building Client Action Plugins (14 mins)
- 24. Building Server Action Plugins (26 mins)
- 25. Building API Connection Plugins (17 mins)
JavaScript Learning Resources
A handpicked list of free resources that helped us learn JavaScript. No affiliate links or paid stuff - just useful content we've found helpful when building plugins.
Frequently asked questions
Who is this course for?
This course is for developers familiar with Bubble who want to understand how custom code and plugins work. While we show you how to get code using AI tools like ChatGPT, building plugins still requires learning JavaScript. It's not super easy, but it's more accessible than ever. Anyone can learn it, but you should know that coding inherently comes with challenges. If you're already comfortable with code, the sections on React integrations, bundling and NPM will be valuable.
Will this course teach me javascript?
This isn't a JavaScript course - it focuses on the complete process of building plugins. As a Bubble developer, you already understand many programming concepts which makes learning easier, but you'll still need to learn some basic JavaScript. We'll show you how to use AI tools to get the code you need, but you'll need to understand JavaScript enough to handle issues in your own plugins. Throughout the course, we'll link to free resources that can help you learn the specific JavaScript concepts relevant to each lesson.
Will I get lifetime access after buying?
Yep. One payment gets you lifetime access to the entire course.
Do you offer discounts?
We want to get this course to as many people as possible. We understand that differences in purchasing power can make it unaffordable in some countries. We also know that Bubble builders come from all over the world - that's part of what makes the community great. If you're in a region where the course price is a real barrier, email youssef@minimum.studio. We'll figure something out.