# Views

URL: /code/file-conventions/views · Id: `page:code/file-conventions/views`

> A view file inside an App replaces the one derived screen at its path with Components.

A `view.mdx` file inside an [App](/business/nouns/app) replaces the one derived screen at its path. Every other screen keeps deriving from the [Nouns](/business/nouns/noun).

```text
apps/portal/
└── leases/[lease]/view.mdx      replaces /app/leases/{lease}
```

## Reference
MDX with [Components](/business/nouns/component), under the same rules as a [Page](/business/nouns/page): literal props, parsed, never run.

| Key | Type | Holds |
| --- | --- | --- |
| `title` | string | The screen title |
| `personas` | list | The [Personas](/business/nouns/persona) who see this view; others keep the derived screen |

## Examples
### Minimal
```mdx title="apps/portal/leases/[lease]/view.mdx"
<ThingDetail />
```

### Leaseline
```mdx title="apps/portal/leases/[lease]/view.mdx"
---
personas: [manager]
---
<ThingDetail fields={["unit", "resident", "endsOn", "rent", "status"]} />
<Timeline />
<VerbSheet verbs={["Lease.renew", "Lease.notify"]} />
```

## What it builds
The [SoftwareBuilder](/code/builders/software) compiles it into the App's screen at that path.

- the screen as HTML for people, JSON for native clients and Markdown for agents
- no new route; authorization is the App's

## Good to know
- Delete the file to return to the derived screen.