> ## Documentation Index
> Fetch the complete documentation index at: https://ayakaleaf-pro.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Налаштування середовища розробки (локально)

> Налаштуйте середовище розробки на локальному сервері або настільному комп'ютері.

## Передумови

Overleaf — типовий проєкт з відкритим кодом із мікросервісною архітектурою, усі служби якого працюють у Docker. 

* Вихідний код офіційної Community Edition доступний на [GitHub Overleaf Official](https://github.com/overleaf/overleaf/tree). 
* Вихідний код Overleaf-CEP доступний на [GitHub Yu-i-i/Overleaf](https://github.com/yu-i-i/overleaf-cep).
* Overleaf Pro Edition доступна на [GitHub Ayaka-notes/overleaf-pro](https://github.com/ayaka-notes/overleaf-pro).

Для налаштування середовища розробки Overleaf вам знадобиться потужний сервер; рекомендовано конфігурацію щонайменше з 8 ядрами та 16 ГБ оперативної пам'яті, оскільки одночасно потрібно запускати понад 20 контейнерів.

<Info>
  Оскільки сервери з 8 і більше ядрами CPU зазвичай дорогі, наполегливо рекомендуємо використовувати для розробки свій локальний комп'ютер.
</Info>

Водночас ми вважаємо, що як розробник ви вже знайомі з [установленням Docker](https://docs.docker.com/engine/install/ubuntu/). Наполегливо радимо використовувати для розробки свіжу та стабільну Ubuntu LTS (наприклад, Ubuntu 24.04 у 2025–2026 роках) і найновішу версію Docker, оскільки це зменшує ймовірність несподіваних помилок.

Отже, вам знадобиться:

* [x] Потужний сервер/настільний комп'ютер для розробки
* [x] Свіжа та стабільна Ubuntu LTS (наприклад, Ubuntu 24.04)
* [x] Середовище Docker і Git

## Інструкція з налаштування

Тут ми використаємо overleaf-cep як приклад, щоб показати, як налаштувати середовище розробки Overleaf.

<Steps>
  <Step title="Отримайте вихідний код">
    Насамперед клонуймо репозиторій:

    ```bash title="bash" theme={null}
    git clone https://github.com/ayaka-notes/overleaf-pro.git
    cd overleaf-pro
    ```
  </Step>

  <Step title="Синхронізуйте `package-lock.json`">
    Оскільки Overleaf розробляється у [внутрішньому репозиторії](http://github.com/overleaf/internal), файл `package-lock.json` дуже ймовірно розсинхронізується через певні особливості розробки. Щоб синхронізувати його, потрібно виконати наведену нижче команду (якщо у вас є локальне середовище nodejs).

    ```bash title="bash" theme={null}
    npm install --package-lock-only --ignore-scripts
    ```

    Якщо nodejs не встановлено, не хвилюйтеся: ту саму команду можна виконати безпосередньо за допомогою `docker`. Запускайте її <strong>з кореня репозиторію Overleaf:</strong>

    ```bash title="bash" theme={null}
    docker run --rm \
      -v "$(pwd)":/workspace \
      -w /workspace \
      node:22.18.0 \
      npm install --package-lock-only --ignore-scripts
    ```
  </Step>

  <Step title="Зберіть образ для розробки">
    Overleaf надає окремий каталог `/develop` для скриптів розробки. Просто зберіть служби:

    ```bash title="bash" theme={null}
    cd ./develop
    bin/build
    ```

    <Info>
      Якщо Docker вичерпує оперативну пам'ять під час паралельного збирання служб, створіть у цьому каталозі файл `.env`, що містить `COMPOSE_PARALLEL_LIMIT=1`.
    </Info>
  </Step>

  <Step title="Запустіть усі мікросервіси">
    Потім запустіть служби:

    ```bash title="bash" theme={null}
    bin/up
    ```

    Коли служби запрацюють, відкрийте [http://localhost/launchpad](http://localhost/launchpad), щоб створити перший обліковий запис адміністратора.

    <Danger>
      Ви повинні виконати `bin/up` перед командою `bin/dev`. Інакше можуть виникнути різноманітні проблеми з правами доступу.
    </Danger>
  </Step>
</Steps>

<Info>
  За замовчуванням права адміністратора недоступні. Потрібно додати наведений нижче рядок до `develop/dev.env`. Після цього ви матимете доступ до панелі адміністратора.

  ```text theme={null}
  ADMIN_PRIVILEGE_AVAILABLE=true
  ```
</Info>

### TeX Live

Для компіляції PDF потрібно зібрати образ TeX Live, який виконуватиме компіляцію всередині Docker:

```text theme={null}
docker build texlive -t texlive-full
```

Для компіляції на хості macOS може знадобитися перевизначити шлях до сокета Docker, створивши в цьому каталозі файл `.env`, що містить `DOCKER_SOCKET_PATH=/var/run/docker.sock.raw`

Також ви можете використовувати [ayaka-notes/texlive-full](https://github.com/ayaka-notes/texlive-full), зокрема тег base, який є мінімальною версією texlive.

### Розробка

Щоб не виконувати `bin/build && bin/up` після кожної зміни коду, можна запустити Overleaf Community Edition у *режимі розробки*, у якому служби автоматично оновлюються при змінах коду.

Для цього скористайтеся вбудованим скриптом `bin/dev`:

```text theme={null}
bin/dev
```

Це запустить усі служби за допомогою `node --watch`, який автоматично відстежує код і за потреби перезапускає служби.

Для підвищення продуктивності можна запустити в режимі розробки лише частину служб, передавши скрипту `bin/dev` їхній список, розділений пробілами:

```text theme={null}
bin/dev [service1] [service2] ... [serviceN]
```

<Info>
  Запуск служби `web` у *режимі розробки* оновлюватиме службу `web` лише при зміні коду бекенду. Щоб автоматично оновлювався й код фронтенду, обов'язково також запустіть у *режимі розробки* службу `webpack`.
</Info>

Якщо служби не вказано, у режимі розробки буде запущено всі служби.

### Налагодження

У *режимі розробки* більшість служб відкривають порт налагодження, до якого можна під'єднати налагоджувач, наприклад інспектор у Chrome Dev Tools або вбудований в IDE. У таблиці нижче наведено порт, відкритий на **хост-машині** для кожної служби:

| Служба | Порт |
| - | - |
| `web` | 9229 |
| `clsi` | 9230 |
| `chat` | 9231 |
| `contacts` | 9232 |
| `docstore` | 9233 |
| `document-updater` | 9234 |
| `filestore` | 9235 |
| `notifications` | 9236 |
| `real-time` | 9237 |
| `references` | 9238 |
| `history-v1` | 9239 |
| `project-history` | 9240 |
| `linked-url-proxy` | 9241 |

Щоб під'єднатися до служби за допомогою *віддаленого налагодження* Chrome, перейдіть на chrome://inspect/ і переконайтеся, що позначено *Discover network targets*. Далі натисніть *Configure...* і додайте запис `localhost:[service port]` для кожної служби, до якої хочете під'єднати налагоджувач.

Після додавання запису служба з'явиться як *Remote Target*, яку можна інспектувати та налагоджувати.

### Журналювання

У середовищі розробки Overleaf надає скрипт `bin/logs`, однак для нього потрібно встановити деякі залежності:

```bash theme={null}
sudo npm install -g bunyan
# Or sudo apt install node-bunyan 
```

Або можна виконати безпосередньо:

```text theme={null}
docker compose logs -f [service name]
```

### Інші інструменти

Коли все буде готово, перегляньте [наступний розділ](/uk/dev/environment/setup-develop-tools), щоб додати інструменти налагодження до вашого середовища розробки Overleaf.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.