Documentation · Chapter 09

Organize routes, layouts, and styles.

A real interface needs more than buttons: explicit routes, shared layouts, loading states, local CSS, assets, and accessible navigation.

Every lesson starts from the problem, explains the mechanism, then gives a concrete verification.

File-based structure

Pages live under src/views/pages, reusable pieces under components, layouts under layouts, and Loading/Error/NotFound under states.

phpaml — zsh
src/views/
├── pages/home/page.php
├── components/TaskRow.php
├── layouts/AppLayout.php
├── states/{Loading,Error,NotFound}.php
└── stylesheets/pages/home.css

Import CSS explicitly

import('pages/home.css') is declared outside the class and resolves only local CSS under src/views/stylesheets. Remote URLs and traversal are rejected.

Navigate inside RouterView

RouterView updates the active page boundary, history, metadata, focus, and route states without replacing the whole document.