1. Open the companion GPT:
https://chatgpt.com/g/g-6a305d409d4c81918837de170876d5d5-secure-bubble-mobile-architect
2. Tell it what screen or feature you want to build. Include your Bubble app URL, whether you are using version-test or live, data types, fields, backend workflows, assets from Bubble File Manager, and any design references.
3. If the GPT asks you to create Backend Workflows, follow its Bubble step-by-step first. Use Backend Workflows for login, signup, sensitive logic, API keys, writes that need validation, and multi-step operations.
4. Add the Prompt to App for Bubble Mobile element to a Bubble Mobile view.
5. Paste the GPT output into the three fields: HTML content, CSS content, and JavaScript content.
6. For full-screen screens, set the Bubble Mobile view/element to fill the available space and use CSS that sets html, body, #bubble-html-root, and the main wrapper to width: 100%; height: 100%.
7. Only run code you trust. Never place Bubble admin API tokens, private keys, or secrets in the JavaScript field.
Demo Editor:
https://bubble.io/page?id=testpluginsnativo&test_plugin=1781422798222x489767040479658000_current&tab=Design&name=Home&type=page&elements=bTHAl