> For the complete documentation index, see [llms.txt](https://docs.rierino.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.rierino.com/design/pro-code/custom-page.md).

# Custom Page

Custom page allows creating full pages with custom code

A hosted page is a menu entry whose content is entirely your code. Nothing is fetched or wrapped for you: no data source, no list, no editor. You get a blank canvas inside the application shell.

Two things to know:

* **The page must be in the app menu.** A hosted page URL that isn't reachable from the app's menu configuration is rejected with a *"ui not in app"* redirect. Add the entry to the menu.
* **You fetch your own data.** Either use the query hooks from `store`, or wrap yourself in `ConnectionWrapper` to get the same data contract a standard list screen has. Both are shown in [Recipes](/design/pro-code/recipes.md).

If the menu entry is configured to use a UI definition, the schema and UI design for that type are handed to your page as props, so you can render a standard list or standard editors inside your custom layout.

There is also a **full-structure page**: a normal list screen whose structure is set to `full`. It behaves the same way: the standard list machinery is skipped and your code owns the screen. The difference is that every key of the list configuration arrives as a prop, which is a convenient way to pass settings into your page.

## Custom page properties

| Prop                       | Notes                                                                                            |
| -------------------------- | ------------------------------------------------------------------------------------------------ |
| `app`, `apps`, `appConfig` | the current application context                                                                  |
| `type`                     | the page type from the URL                                                                       |
| `screenConfig`             | the menu entry for this page; your own settings on that entry are here                           |
| `schema`, `uiDesign`       | populated only when the menu entry is configured to use a UI definition; empty objects otherwise |
| `router`                   | the Next.js router                                                                               |

For a **full-structure page**, every key of the list configuration is spread as a prop instead.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation by asking a question.

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://docs.rierino.com/design/pro-code/custom-page.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.