Skip to main content

Pages

Each Superblocks app is structured into Pages. A Page is an isolated section of your application with its own scope. This means each Page has its own set of components, APIs, frontend variables, timers, custom events, and more.

When you create a Superblocks application, it starts with a default page named Page1. You can view and navigate between all pages in your application using the Navigation panel.

Creating pages

To create a new Page, open the Navigation panel on the left and click the plus button next to the Page dropdown menu.

Add a new page to your app

A popover will appear, prompting you to fill in the details for the new Page. Enter an intuitive name for the Page — using PascalCase is recommended for consistent naming.

You will also need to specify the Route for the Page. Learn more about routes.

Create page popover

To rename your Page, simply double-click on the Page name in the Navigation panel under Components, or edit it via the Page Properties panel.

Edit page name

Sharing resources and data across pages [BETA]

Certain resources, such as frontend variables, APIs, and timers, can be shared across your application. For more information about sharing resources across pages, see the scope docs.

For the time being, APIs and components are both page-specific and cannot be shared across pages. App-scoped reusable APIs are coming soon!

Pageload event

Each page has its own pageLoad event that is triggered when the page is navigated to. You can use the onPageLoad event handler to trigger automatic behavior for when a specific page is loaded.