How to build a multi-page app in Bubble

A multi-page app in Bubble means you create separate Bubble pages for different screens (like Home, Dashboard, Settings), and you let users move between them using “Go to page…” navigation actions. Each page can have its own layout, data type, and workflows. You build pages in the Bubble editor, set each page’s Type of content when you want to pass data between pages, and use URL parameters only when you need extra filtering or state. This is simple, fast to build, and ideal when the screens don’t need to share complex UI states.

What a Multi‑Page App Really Means in Bubble

Bubble gives you two ways to structure an app: one-page apps (single page with hidden groups) or multi-page apps (separate pages). A multi-page app is easier for beginners because each screen is its own page and loads separately in the browser. Every page has:

• Its own URL (e.g., /dashboard)
• Its own workflows
• Its own reusable UI
• Optional Type of content so you can send data to it

How to Create Pages Correctly

In the Bubble editor, click the page dropdown → New page. Give it a simple name (e.g., dashboard). If the page should display a specific thing from the database (like a Project page), set its Type of content to the corresponding Data Type. Otherwise leave it blank for general pages like Login or Settings.

• Pages with a Type of content can receive a specific thing through navigation.
• Pages without a Type of content are good for general UI.

How Navigation Works

Navigation is always done in workflows. Add a workflow event like “When button is clicked → Navigation → Go to page…”. If the target page has a Type of content, Bubble will require you to pass a thing.

// Example: go to a Project page and pass the Project the user clicked
Go to page: project
Data to send: Current cell's Project

If you also need filters or additional data (like a tab value), use Send more parameters to the page.

When to Use URL Parameters

Use URL parameters for UI-specific states (like “tab=details”) or small filtering info. Don’t use them to send sensitive data—Bubble privacy rules still apply, but it’s better to pass only IDs or simple states.

• Good for: tab selection, view modes, filters
• Not ideal for: large or sensitive data

Best Practices for Multi‑Page Architecture

• Keep each page focused on one purpose.
• Reuse elements (headers, footers) using Reusable Elements.
• Only set a Type of content when the page truly displays a single database thing.
• Use page-level privacy rules so each page only loads the data it needs.
• Avoid too many URL parameters—keep them meaningful.

How Pages Load Data

When a page has a Type of content, Bubble provides Current Page Thing, which you can use directly in groups, repeating groups, or workflows. This is cleaner than setting custom states or reloading data manually.

That’s the core of building a multi-page Bubble app: separate pages, simple navigation, clean data flow, and page-level focus.