ДокументацияСтраницы и макеты в файлах

Страницы внешнего интерфейса

Страница - это базовая единица приложения Nexy. Это ресурс с URL-адресом, определенный в файле в src/routes/.

Независимо от используемой клиентской платформы, каждая страница соответствует одному и тому же универсальному жизненному циклу и архитектурным ограничениям.

Жизненный цикл страницы

Когда пользователь переходит на страницу, Nexy выполняет следующие шаги:

Сопоставление маршрутов: маршрутизатор идентифицирует файл, соответствующий URL-адресу.
Извлечение данных: сервер запускает фронтматер страницы Python для получения необходимых ему данных.
Композиция: страница заключена в ближайший к ней layout.nexy (или макет структуры).
Рендеринг: результат отображается в HTML (через Jinja2, Markdown или SSR платформы).
Гидратация: если страница использует клиентскую платформу, браузер присоединяет интерактивную логику к статическому HTML.

Шаги со 2 по 4 на одной странице в режиме сервера: извлекается заголовок, рендерится шаблон и корневой макет оборачивает результат.

src/маршруты/users.nexy

---from src.users import all_users users = all_users()---<h1>Users</h1><ul>  {% for user in users %}  <li>{{ user.name }}</li>  {% endfor %}</ul>

Маршрутизация и URL-адреса

Маршрутизация строго файловая. URL-адрес определяется путем к файлу в разделе src/routes/ за вычетом расширения.

src/routes/

index.tsx/

about.tsx/about

blog/

index.tsx/blog

[slug].tsx/blog/hello-world

Динамические сегменты

Чтобы создать маршрут, который зависит от параметра (например, профиля пользователя), используйте квадратные скобки:

src/routes/user/[id].tsx → /user/123

Значение сегмента (123) доступно странице через перехватчик useParams() из @nexy/client.

src/маршруты/пользователь/[id].tsx

import { useParams } from "@nexy/client"; export default function User() {  const { id } = useParams<{ id: string }>();  return <h1>User {id}</h1>;}

Группы маршрутов

Папки, заключенные в круглые скобки, игнорируются маршрутизатором, но позволяют группировать файлы для организационных целей или общих макетов:

src/routes/(auth)/login.tsx → /login

src/routes/

layout.tsx

(auth)/

layout.tsxwraps /login and /signup only

signup.tsx/signup

Метаданные страницы

Каждая страница может определять метаданные (заголовок, описание, теги OpenGraph), которые Nexy вводит в оболочку документа. Страница .nexy устанавливает его во вступительной части с литералом или с помощью setMetadata:

src/маршруты/blog.nexy

---metadata = {"title": "Blog", "description": "Posts about Nexy"}---<h1>Blog</h1>

setMetadata - это Python: страница .tsx, .vue или .svelte не имеет экспорта metadata, поэтому в режиме клиента записывайте заголовок и метатеги в корневом макете. См. Метаданные страницы для каждого поля.

Реализация фреймворка

Представленные выше понятия универсальны. Чтобы узнать, как реализовать страницу в вашей конкретной платформе, см. руководство Различия:

Изменить на GitHub