@dxtmisha/wiki 0.56.0 → 0.57.1

package/src/media/functional/nitro-basic/functions/uiCreateApp/uiCreateApp.en.mdx

@@ -0,0 +1,43 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/en/nitro-basic/Functions/uiCreateApp - Create Vue App'/>
+
+# `uiCreateApp`
+
+Creates a Vue SSR application instance from a root component and initializes core plugins, including the router. If a ready-made router is not passed in the options, the function can create one automatically based on the provided routes.
+
+**Parameters:**
+- `appComponent: A` — The root component of the application.
+- `options: NitroAppOptions` — Application configuration options.
+
+**Returns:**
+An object containing the `app` instance, `router`, and `options`.
+
+## Types
+
+### NitroAppOptions
+
+- `appRouter?: object` — Router configuration:
+  - `routes: RouteRecordRaw[]` — list of route records.
+  - `options?: RouterOptions` — router creation options.
+- `api?: ApiConfig` — configuration for the API client.
+- `translate?: TranslateConfig` — configuration for the translation service.
+- `metaSuffix?: string` — suffix to be appended to all page titles.
+- `icons?: IconsConfig` — configuration for the icon management service.
+- `router?: Router` — Vue Router instance (if already created).
+- `errorCauses?: ErrorCenterCauseList` — error causes list for the error center.
+
+**Usage Example:**
+
+```typescript
+import { uiCreateApp } from '@dxtmisha/nitro-basic'
+import App from './App.vue'
+
+const { app, router } = uiCreateApp(App, {
+  appRouter: {
+    routes: [
+      { path: '/', component: () => import('./Home.vue') }
+    ]
+  }
+})
+```

package/src/media/functional/nitro-basic/functions/uiCreateApp/uiCreateApp.ru.mdx

@@ -0,0 +1,43 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/ru/nitro-basic/Functions/uiCreateApp - Создание Vue приложения'/>
+
+# `uiCreateApp`
+
+Создаёт экземпляр Vue SSR приложения из корневого компонента и инициализирует основные плагины, включая маршрутизатор. Если в опциях не передан готовый роутер, функция может создать его автоматически на основе предоставленных маршрутов.
+
+**Параметры:**
+- `appComponent: A` — Корневой компонент приложения.
+- `options: NitroAppOptions` — Параметры конфигурации приложения.
+
+**Возвращает:**
+Объект, содержащий экземпляр `app`, `router` и `options`.
+
+## Типы
+
+### NitroAppOptions
+
+- `appRouter?: object` — Конфигурация маршрутизатора:
+  - `routes: RouteRecordRaw[]` — список записей маршрутов.
+  - `options?: RouterOptions` — опции создания маршрутизатора.
+- `api?: ApiConfig` — конфигурация для API-клиента.
+- `translate?: TranslateConfig` — конфигурация для сервиса переводов.
+- `metaSuffix?: string` — суффикс, который будет добавляться ко всем заголовкам страниц.
+- `icons?: IconsConfig` — конфигурация для сервиса управления иконками.
+- `router?: Router` — экземпляр Vue Router (если уже создан).
+- `errorCauses?: ErrorCenterCauseList` — список причин ошибок для центра ошибок.
+
+**Пример использования:**
+
+```typescript
+import { uiCreateApp } from '@dxtmisha/nitro-basic'
+import App from './App.vue'
+
+const { app, router } = uiCreateApp(App, {
+  appRouter: {
+    routes: [
+      { path: '/', component: () => import('./Home.vue') }
+    ]
+  }
+})
+```

package/src/media/functional/nitro-basic/functions/uiCreateApp/uiCreateApp.vi.mdx

@@ -0,0 +1,43 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/vi/nitro-basic/Functions/uiCreateApp - Tạo ứng dụng Vue'/>
+
+# `uiCreateApp`
+
+Tạo một thực thể ứng dụng Vue SSR từ một thành phần gốc và khởi tạo các plugin cốt lõi, bao gồm cả router. Nếu một router có sẵn không được truyền vào trong các tùy chọn, hàm có thể tự động tạo một router dựa trên các tuyến đường được cung cấp.
+
+**Tham số:**
+- `appComponent: A` — Thành phần gốc của ứng dụng.
+- `options: NitroAppOptions` — Các tùy chọn cấu hình ứng dụng.
+
+**Trả về:**
+Một đối tượng chứa thực thể `app`, `router`, và `options`.
+
+## Các kiểu
+
+### NitroAppOptions
+
+- `appRouter?: object` — Cấu hình router:
+  - `routes: RouteRecordRaw[]` — danh sách các bản ghi tuyến đường.
+  - `options?: RouterOptions` — các tùy chọn tạo router.
+- `api?: ApiConfig` — cấu hình cho API client.
+- `translate?: TranslateConfig` — cấu hình cho dịch vụ dịch thuật.
+- `metaSuffix?: string` — hậu tố sẽ được thêm vào tất cả các tiêu đề trang.
+- `icons?: IconsConfig` — cấu hình cho dịch vụ quản lý icon.
+- `router?: Router` — thực thể Vue Router (nếu đã được tạo).
+- `errorCauses?: ErrorCenterCauseList` — danh sách nguyên nhân lỗi cho trung tâm lỗi.
+
+**Ví dụ sử dụng:**
+
+```typescript
+import { uiCreateApp } from '@dxtmisha/nitro-basic'
+import App from './App.vue'
+
+const { app, router } = uiCreateApp(App, {
+  appRouter: {
+    routes: [
+      { path: '/', component: () => import('./Home.vue') }
+    ]
+  }
+})
+```

package/src/media/functional/nitro-basic/functions/uiCreateClientApp/uiCreateClientApp.en.mdx

@@ -0,0 +1,31 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/en/nitro-basic/Functions/uiCreateClientApp - Client App Bootstrap'/>
+
+# `uiCreateClientApp`
+
+Finalizes the initialization and mounts the Vue application into the DOM on the client side. It connects functional plugins, waits for the router to be ready to prevent hydration mismatches, and performs additional actions before mounting.
+
+**Parameters:**
+- `app: App<T>` — The Vue application instance.
+- `rootContainer: string | T` (default `'#app'`) — Selector or element for mounting.
+- `router: Router` — The Vue Router instance.
+- `options: NitroAppOptions` — Configuration options.
+- `action?: (app: App<T>) => Promise<void> | void` — Additional action before mounting.
+
+## Types
+
+### NitroAppOptions
+
+- `api?: ApiConfig` — configuration for the API client.
+- `translate?: TranslateConfig` — configuration for the translation service.
+- `metaSuffix?: string` — suffix to be appended to all page titles.
+- `icons?: IconsConfig` — configuration for the icon management service.
+- `router?: Router` — Vue Router instance.
+- `errorCauses?: ErrorCenterCauseList` — error causes list for the error center.
+
+```typescript
+import { uiCreateClientApp } from '@dxtmisha/nitro-basic'
+
+await uiCreateClientApp(app, '#app', router, options)
+```

package/src/media/functional/nitro-basic/functions/uiCreateClientApp/uiCreateClientApp.ru.mdx

@@ -0,0 +1,31 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/ru/nitro-basic/Functions/uiCreateClientApp - Запуск приложения на клиенте'/>
+
+# `uiCreateClientApp`
+
+Завершает инициализацию и монтирует Vue-приложение в DOM на стороне клиента. Она подключает функциональные плагины, ожидает готовности маршрутизатора для предотвращения ошибок гидратации и выполняет дополнительные действия перед монтированием.
+
+**Параметры:**
+- `app: App<T>` — Экземпляр приложения Vue.
+- `rootContainer: string | T` (по умолчанию `'#app'`) — Селектор или элемент для монтирования.
+- `router: Router` — Экземпляр Vue Router.
+- `options: NitroAppOptions` — Параметры конфигурации.
+- `action?: (app: App<T>) => Promise<void> | void` — Дополнительное действие перед монтированием.
+
+## Типы
+
+### NitroAppOptions
+
+- `api?: ApiConfig` — конфигурация для API-клиента.
+- `translate?: TranslateConfig` — конфигурация для сервиса переводов.
+- `metaSuffix?: string` — суффикс, который будет добавляться ко всем заголовкам страниц.
+- `icons?: IconsConfig` — конфигурация для сервиса управления иконками.
+- `router?: Router` — экземпляр Vue Router.
+- `errorCauses?: ErrorCenterCauseList` — список причин ошибок для центра ошибок.
+
+```typescript
+import { uiCreateClientApp } from '@dxtmisha/nitro-basic'
+
+await uiCreateClientApp(app, '#app', router, options)
+```

package/src/media/functional/nitro-basic/functions/uiCreateClientApp/uiCreateClientApp.vi.mdx

@@ -0,0 +1,31 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/vi/nitro-basic/Functions/uiCreateClientApp - Khởi động ứng dụng Client'/>
+
+# `uiCreateClientApp`
+
+Hoàn tất việc khởi tạo và mount ứng dụng Vue vào DOM ở phía client. Nó kết nối các plugin chức năng, đợi router sẵn sàng để ngăn chặn sự không khớp khi hydrat hóa, và thực hiện các hành động bổ sung trước khi mount.
+
+**Tham số:**
+- `app: App<T>` — Thực thể ứng dụng Vue.
+- `rootContainer: string | T` (mặc định `'#app'`) — Selector hoặc thành phần để mount.
+- `router: Router` — Thực thể Vue Router.
+- `options: NitroAppOptions` — Các tùy chọn cấu hình.
+- `action?: (app: App<T>) => Promise<void> | void` — Hành động bổ sung trước khi mount.
+
+## Các kiểu
+
+### NitroAppOptions
+
+- `api?: ApiConfig` — cấu hình cho API client.
+- `translate?: TranslateConfig` — cấu hình cho dịch vụ dịch thuật.
+- `metaSuffix?: string` — hậu tố sẽ được thêm vào tất cả các tiêu đề trang.
+- `icons?: IconsConfig` — cấu hình cho dịch vụ quản lý icon.
+- `router?: Router` — thực thể Vue Router.
+- `errorCauses?: ErrorCenterCauseList` — danh sách nguyên nhân lỗi cho trung tâm lỗi.
+
+```typescript
+import { uiCreateClientApp } from '@dxtmisha/nitro-basic'
+
+await uiCreateClientApp(app, '#app', router, options)
+```

package/src/media/functional/nitro-basic/functions/uiCreateServerApp/uiCreateServerApp.en.mdx

@@ -0,0 +1,34 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/en/nitro-basic/Functions/uiCreateServerApp - Full Server Initialization'/>
+
+# `uiCreateServerApp`
+
+A comprehensive asynchronous function to initialize the application on the server side. It configures everything necessary for SSR: headers, storage, API, routing, and performs HTML rendering.
+
+**Key Stages:**
+1. Initialization of headers, storage, and cookies.
+2. Configuration of the API client and functional plugins.
+3. Synchronization of the router with the current URL.
+4. Rendering the application into a string.
+5. Substitution of data (language, meta, scripts, content) into the HTML template.
+
+**Returns:**
+An object with the rendered page body, metadata, and headers.
+
+## Types
+
+### NitroAppOptions
+
+- `api?: ApiConfig` — configuration for the API client.
+- `translate?: TranslateConfig` — configuration for the translation service.
+- `metaSuffix?: string` — suffix to be appended to all page titles.
+- `icons?: IconsConfig` — configuration for the icon management service.
+- `router?: Router` — Vue Router instance.
+- `errorCauses?: ErrorCenterCauseList` — error causes list for the error center.
+
+```typescript
+import { uiCreateServerApp } from '@dxtmisha/nitro-basic'
+
+const data = await uiCreateServerApp(app, request, router, options, action, context, htmlTemplate)
+```

package/src/media/functional/nitro-basic/functions/uiCreateServerApp/uiCreateServerApp.ru.mdx

@@ -0,0 +1,34 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/ru/nitro-basic/Functions/uiCreateServerApp - Полная инициализация сервера'/>
+
+# `uiCreateServerApp`
+
+Комплексная асинхронная функция для инициализации приложения на стороне сервера. Она настраивает всё необходимое для SSR: заголовки, хранилища, API, маршрутизацию и выполняет рендеринг в HTML.
+
+**Основные этапы:**
+1. Инициализация заголовков, хранилищ и cookie.
+2. Настройка API-клиента и функциональных плагинов.
+3. Синхронизация роутера с текущим URL.
+4. Рендеринг приложения в строку.
+5. Подстановка данных (язык, мета, скрипты, контент) в HTML-шаблон.
+
+**Возвращает:**
+Объект с отрендеренным телом страницы, метаданными и заголовками.
+
+## Типы
+
+### NitroAppOptions
+
+- `api?: ApiConfig` — конфигурация для API-клиента.
+- `translate?: TranslateConfig` — конфигурация для сервиса переводов.
+- `metaSuffix?: string` — суффикс, который будет добавляться ко всем заголовкам страниц.
+- `icons?: IconsConfig` — конфигурация для сервиса управления иконками.
+- `router?: Router` — экземпляр Vue Router.
+- `errorCauses?: ErrorCenterCauseList` — список причин ошибок для центра ошибок.
+
+```typescript
+import { uiCreateServerApp } from '@dxtmisha/nitro-basic'
+
+const data = await uiCreateServerApp(app, request, router, options, action, context, htmlTemplate)
+```

package/src/media/functional/nitro-basic/functions/uiCreateServerApp/uiCreateServerApp.vi.mdx

@@ -0,0 +1,34 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/vi/nitro-basic/Functions/uiCreateServerApp - Khởi tạo Server đầy đủ'/>
+
+# `uiCreateServerApp`
+
+Một hàm bất đối xứng toàn diện để khởi tạo ứng dụng ở phía server. Nó cấu hình mọi thứ cần thiết cho SSR: header, bộ lưu trữ, API, định tuyến và thực hiện render HTML.
+
+**Các giai đoạn chính:**
+1. Khởi tạo header, bộ lưu trữ và cookie.
+2. Cấu hình API client và các plugin chức năng.
+3. Đồng bộ hóa router với URL hiện tại.
+4. Render ứng dụng thành một chuỗi.
+5. Thay thế dữ liệu (ngôn ngữ, meta, kịch bản, nội dung) vào template HTML.
+
+**Trả về:**
+Một đối tượng với nội dung trang đã được render, metadata và các header.
+
+## Các kiểu
+
+### NitroAppOptions
+
+- `api?: ApiConfig` — cấu hình cho API client.
+- `translate?: TranslateConfig` — cấu hình cho dịch vụ dịch thuật.
+- `metaSuffix?: string` — hậu tố sẽ được thêm vào tất cả các tiêu đề trang.
+- `icons?: IconsConfig` — cấu hình cho dịch vụ quản lý icon.
+- `router?: Router` — thực thể Vue Router.
+- `errorCauses?: ErrorCenterCauseList` — danh sách nguyên nhân lỗi cho trung tâm lỗi.
+
+```typescript
+import { uiCreateServerApp } from '@dxtmisha/nitro-basic'
+
+const data = await uiCreateServerApp(app, request, router, options, action, context, htmlTemplate)
+```

package/src/media/functional/nitro-basic/functions/uiCreateSsrRouter/uiCreateSsrRouter.en.mdx

@@ -0,0 +1,17 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/en/nitro-basic/Functions/uiCreateSsrRouter - Create SSR Router'/>
+
+# `uiCreateSsrRouter`
+
+Creates a Vue router instance with a history type suitable for the current runtime environment. On the server, it uses `createMemoryHistory`, and in the browser, it uses `createWebHistory`.
+
+**Parameters:**
+- `routes: RouteRecordRaw[]` — A list of routes.
+- `options: NitroAppRouterOptions` — Additional router options.
+
+```typescript
+import { uiCreateSsrRouter } from '@dxtmisha/nitro-basic'
+
+const router = uiCreateSsrRouter(routes)
+```

package/src/media/functional/nitro-basic/functions/uiCreateSsrRouter/uiCreateSsrRouter.ru.mdx

@@ -0,0 +1,17 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/ru/nitro-basic/Functions/uiCreateSsrRouter - Создание SSR роутера'/>
+
+# `uiCreateSsrRouter`
+
+Создаёт экземпляр маршрутизатора Vue с типом истории, подходящим для текущей среды выполнения. На сервере используется `createMemoryHistory`, а в браузере — `createWebHistory`.
+
+**Параметры:**
+- `routes: RouteRecordRaw[]` — Список маршрутов.
+- `options: NitroAppRouterOptions` — Дополнительные опции роутера.
+
+```typescript
+import { uiCreateSsrRouter } from '@dxtmisha/nitro-basic'
+
+const router = uiCreateSsrRouter(routes)
+```

package/src/media/functional/nitro-basic/functions/uiCreateSsrRouter/uiCreateSsrRouter.vi.mdx

@@ -0,0 +1,17 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/vi/nitro-basic/Functions/uiCreateSsrRouter - Tạo SSR Router'/>
+
+# `uiCreateSsrRouter`
+
+Tạo một thực thể Vue router với loại lịch sử phù hợp cho môi trường thực thi hiện tại. Trên server, nó sử dụng `createMemoryHistory`, và trong trình duyệt, nó sử dụng `createWebHistory`.
+
+**Tham số:**
+- `routes: RouteRecordRaw[]` — Danh sách các tuyến đường.
+- `options: NitroAppRouterOptions` — Các tùy chọn router bổ sung.
+
+```typescript
+import { uiCreateSsrRouter } from '@dxtmisha/nitro-basic'
+
+const router = uiCreateSsrRouter(routes)
+```

package/src/media/functional/nitro-basic/functions/uiId/uiId.en.mdx

@@ -0,0 +1,13 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/en/nitro-basic/Functions/uiId - Global ID Generator'/>
+
+# `uiId`
+
+Initializes the global unique identifier generation function for elements. It uses Vue's built-in `useId` mechanism if called within a component, otherwise it generates an incremental ID with the `ui-` prefix.
+
+```typescript
+import { uiId } from '@dxtmisha/nitro-basic'
+
+uiId()
+```

package/src/media/functional/nitro-basic/functions/uiId/uiId.ru.mdx

@@ -0,0 +1,13 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/ru/nitro-basic/Functions/uiId - Глобальный генератор ID'/>
+
+# `uiId`
+
+Инициализирует глобальную функцию генерации уникальных идентификаторов для элементов. Она использует встроенный механизм Vue `useId`, если вызов происходит внутри компонента, в противном случае генерирует инкрементальный идентификатор с префиксом `ui-`.
+
+```typescript
+import { uiId } from '@dxtmisha/nitro-basic'
+
+uiId()
+```

package/src/media/functional/nitro-basic/functions/uiId/uiId.vi.mdx

@@ -0,0 +1,13 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/vi/nitro-basic/Functions/uiId - Trình tạo ID toàn cục'/>
+
+# `uiId`
+
+Khởi tạo hàm tạo định danh duy nhất toàn cục cho các thành phần. Nó sử dụng cơ chế `useId` tích hợp của Vue nếu được gọi trong một component, ngược lại nó sẽ tạo một ID tăng dần với tiền tố `ui-`.
+
+```typescript
+import { uiId } from '@dxtmisha/nitro-basic'
+
+uiId()
+```

package/src/media/functional/nitro-basic/functions/uiServerStorage/uiServerStorage.en.mdx

@@ -0,0 +1,13 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/en/nitro-basic/Functions/uiServerStorage - ServerStorage Initialization'/>
+
+# `uiServerStorage`
+
+Configures the global `ServerStorage` object by providing a mechanism to retrieve data from the Vue application context (injected via the `NITRO_APP_STORAGE` key). This allows components to save and retrieve state during server-side rendering.
+
+```typescript
+import { uiServerStorage } from '@dxtmisha/nitro-basic'
+
+uiServerStorage()
+```

package/src/media/functional/nitro-basic/functions/uiServerStorage/uiServerStorage.ru.mdx

@@ -0,0 +1,13 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/ru/nitro-basic/Functions/uiServerStorage - Инициализация ServerStorage'/>
+
+# `uiServerStorage`
+
+Настраивает глобальный объект `ServerStorage`, предоставляя механизм для извлечения данных из контекста приложения Vue (внедренного через ключ `NITRO_APP_STORAGE`). Это позволяет компонентам сохранять и получать состояние во время серверного рендеринга.
+
+```typescript
+import { uiServerStorage } from '@dxtmisha/nitro-basic'
+
+uiServerStorage()
+```

package/src/media/functional/nitro-basic/functions/uiServerStorage/uiServerStorage.vi.mdx

@@ -0,0 +1,13 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/vi/nitro-basic/Functions/uiServerStorage - Khởi tạo ServerStorage'/>
+
+# `uiServerStorage`
+
+Cấu hình đối tượng `ServerStorage` toàn cục bằng cách cung cấp một cơ chế để lấy dữ liệu từ ngữ cảnh ứng dụng Vue (được cung cấp thông qua khóa `NITRO_APP_STORAGE`). Điều này cho phép các thành phần lưu và lấy trạng thái trong quá trình render phía server.
+
+```typescript
+import { uiServerStorage } from '@dxtmisha/nitro-basic'
+
+uiServerStorage()
+```

package/src/media/functional/nitro-basic/setup/setup.en.mdx

@@ -0,0 +1,133 @@
+import {Meta} from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/en/nitro-basic/# Project Setup'/>
+
+# Project Setup
+
+The `@dxtmisha/nitro-basic` library is designed to work in conjunction with Nitro and Vue 3. It ensures a smooth transition between server-side and client-side rendering. Below is a step-by-step guide for integrating the library into your project.
+
+## 1. Install Dependencies
+
+Install the necessary packages. In addition to the library itself, you will need Vue 3 and Vue Router:
+
+```bash
+npm install @dxtmisha/nitro-basic vue vue-router
+```
+
+## 2. Nitro Plugin Initialization
+
+For basic server environment setup (e.g., API caching), you need to register a Nitro plugin.
+
+Create the `server/plugins/ui.ts` file:
+
+```typescript
+import { definePlugin } from 'nitro'
+import { initPluginBasic } from '@dxtmisha/nitro-basic/plugin'
+
+export default definePlugin((nitroApp) => {
+  initPluginBasic(nitroApp)
+})
+```
+
+## 3. Create Application Factory (main.ts)
+
+Create a shared file for Vue application initialization that will be used on both server and client.
+
+```typescript
+// src/main.ts
+import { uiCreateApp } from '@dxtmisha/nitro-basic'
+import App from './App.vue'
+import { routes } from './router'
+
+export function createApp() {
+  return uiCreateApp(App, {
+    appRouter: {
+      routes
+    }
+  })
+}
+```
+
+## 4. Configure Client Entry Point
+
+On the client, you need to prepare the identifier generator and mount the application.
+
+```typescript
+// src/entry-client.ts
+import { uiBootstrapClient, uiCreateClientApp } from '@dxtmisha/nitro-basic'
+import { createApp } from './main'
+
+const { app, router, options } = createApp()
+
+// ID initialization for hydration
+uiBootstrapClient()
+
+// Mount the application
+uiCreateClientApp(app, '#app', router, options)
+```
+
+## 5. Configure Server Entry Point
+
+The server entry point is responsible for initializing storages, headers, and HTML rendering.
+
+```typescript
+// src/entry-server.ts
+import { uiBootstrapServer, uiCreateServerApp } from '@dxtmisha/nitro-basic'
+import { createApp } from './main'
+import template from './templates/main.html?raw' // HTML template
+
+// Global server initialization
+uiBootstrapServer()
+
+export default {
+  async fetch(request: Request) {
+    const { app, router, options } = createApp()
+
+    const { headers, body } = await uiCreateServerApp(
+      app,
+      request,
+      router,
+      options,
+      undefined,
+      undefined,
+      template
+    )
+
+    return new Response(body, { headers })
+  }
+}
+```
+
+## 6. HTML Template
+
+For SSR to work correctly, the library uses a placeholder system in the HTML template. The `uiCreateServerApp` function automatically replaces them with up-to-date data.
+
+**Available markers:**
+- `<!--ssr-lang-->` — user language code (e.g., `en`). Used in `<html lang="...">`.
+- `<!--ssr-title-->` — page title from `MetaStatic`. Injected into `<title>`.
+- `<!--ssr-meta-->` — block of meta tags (OG, Twitter, etc.) from `MetaStatic`.
+- `<!--ssr-outlet-->` — rendered HTML of your application. Usually inside `<div id="app">`.
+- `<!--ssr-teleports-->` — content from Vue Teleports.
+- `<!--ssr-scriptsJson-->` — **Critically important marker**. Contains JSON with hydration data (`ServerStorage`, API cache). Must be placed before the closing `</body>`.
+
+Example `main.html`:
+```html
+<!DOCTYPE html>
+<html lang="<!--ssr-lang-->">
+<head>
+    <meta charset="UTF-8">
+    <!--ssr-meta-->
+    <title><!--ssr-title--></title>
+</head>
+<body>
+    <div id="app"><!--ssr-outlet--></div>
+    
+    <!--ssr-teleports-->
+    <!--ssr-scriptsJson-->
+
+    <script type="module" src="/src/entry-client.ts"></script>
+</body>
+</html>
+```
+
+> Without the `<!--ssr-scriptsJson-->` marker, data received on the server will not be transferred to the client, leading to hydration errors and redundant API requests.