> For the complete documentation index, see [llms.txt](https://docs.iexexchanger.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.iexexchanger.com/get-started/ustanovka/nastroika-fastpanel/nastroika-frontend.md).

# Настройка Frontend

Frontend представляет собой клиентскую часть обменного пункта, которая будет доступна пользователям по основному домену сайта.

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

После завершения настройки Frontend должен быть доступен по адресу: `https://ваш_домен`

## Перед началом

Перед выполнением данного этапа убедитесь, что:

* основной домен уже создан в FastPanel;
* SSL-сертификат для основного домена настроен;
* архив Frontend скачан из личного кабинета iEXExchanger;
* вы имеете доступ к панели управления FastPanel.

***

## Загрузка файлов Frontend

В панели управления FastPanel перейдите в раздел **«Сайты»** и выберите основной домен: `ваш_домен` 

<figure><img src="/files/3EBKWBIpVYx7QzMHrc5V" alt="" width="375"><figcaption></figcaption></figure>

Перейдите в раздел **«Файлы».**

<figure><img src="/files/MYNI8tpZiOsDqK3tgYKO" alt="" width="563"><figcaption></figcaption></figure>

Откроется корневая директория сайта.

{% content-ref url="/pages/Qs1hiwajeXhU7MQo0zB9" %}
[Broken mention](broken://pages/Qs1hiwajeXhU7MQo0zB9)
{% endcontent-ref %}

Загрузите архив Frontend, полученный в личном кабинете iEXExchanger, используя кнопку **«Загрузить»** в верхней части файлового менеджера.

<figure><img src="/files/tTRRxX9NRfwrou5AWhNm" alt=""><figcaption></figcaption></figure>

После завершения загрузки распакуйте архив непосредственно в корневую директорию сайта.

## Проверка структуры проекта

После распаковки в корневой директории сайта должна присутствовать директория: `dist/exchanger`

Именно она содержит готовую клиентскую часть системы и SSR-сервер Angular.

<figure><img src="/files/7kgJG3PedMGsbS7uGCS7" alt=""><figcaption></figcaption></figure>

Если после распаковки появилась дополнительная вложенная папка, перенесите содержимое архива в корень сайта.

***

## Создание файла .env

После загрузки файлов необходимо создать конфигурационный файл Frontend.

В корневой директории проекта создайте новый файл: `.env`

<figure><img src="/files/jpve7XKEKMZN4J8sU1T8" alt="" width="375"><figcaption></figcaption></figure>

Добавьте в него следующую конфигурацию:

```dotenv
NODE_ENV=production
PORT=4000
HOST=127.0.0.1

PM2=true

SUPPORTED_LANGUAGES=ru,en
DEFAULT_LANGUAGE=ru

ALLOWED_HOSTS=ваш_домен
API_URL=https://app.ваш_домен

CSS_VERSION=1

CUSTOM_THEME=custom-theme
CUSTOM_THEME_URL=/static/theme/custom-theme.css
```

После создания файла сохраните изменения.

### Настройка параметров

Обязательно измените следующие параметры:

{% stepper %}
{% step %}

#### ALLOWED\_HOSTS

Укажите основной домен обменного пункта.

Пример: `ALLOWED_HOSTS=example.com`
{% endstep %}

{% step %}

#### API\_URL

Укажите адрес технического поддомена.

Пример: `API_URL=https://app.example.com`
{% endstep %}
{% endstepper %}

## Создание конфигурации PM2

Для последующего запуска Frontend необходимо создать конфигурационный файл PM2.

В корневой директории проекта создайте новый файл: `ecosystem.config.cjs`

Добавьте в него следующий код:

```javascript
module.exports = {
  apps: [
    {
      name: 'iexexchanger',
      script: 'dist/exchanger/server/server.mjs',
      cwd: __dirname,
      instances: 'max',
      exec_mode: 'cluster',
      autorestart: true,
      watch: false,
      max_memory_restart: '1G',
      env: {
        NODE_ENV: 'production',
        PORT: 4000,
        PM2: true,
      },
      log_date_format: 'YYYY-MM-DD HH:mm:ss Z',
      error_file: 'logs/err.log',
      out_file: 'logs/out.log',
      merge_logs: true,
      time: true,
      wait_ready: false,
      listen_timeout: 3000,
      kill_timeout: 2000,
      exp_backoff_restart_delay: 100
    },
  ],
};
```

После добавления конфигурации нажмите кнопку **«Сохранить»**.


---

# 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 dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.iexexchanger.com/get-started/ustanovka/nastroika-fastpanel/nastroika-frontend.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
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.