# 開発設定

LangBotはフロントエンドとバックエンドに分かれています。フロントエンドはNext.js + shadcnを使用して開発され、バックエンドはQuart(Flaskの非同期版)を使用して開発されています。

## バックエンド

コードは`pkg`ディレクトリにあり、ルートディレクトリの`main.py`ファイルによって起動されます。

依存関係をインストールします。依存関係の管理にはuvを使用します。

```bash
pip install uv
uv sync --dev
```

バックエンドを起動します

```bash
uv run main.py
```

この時点で、設定ファイルは`data/config.yaml`ファイルに自動的に生成されます。

## フロントエンド

コードは`web`ディレクトリにあり、Node.jsと[pnpm](https://pnpm.io/installation)が必要です。

`.env.example`を`.env`にコピーして、値を入力します。

- Linuxおよびその他の環境での使用

```bash
cp .env.example .env
```

- Windows環境での使用

```bash
copy .env.example .env
```

依存関係をインストールしてフロントエンドを起動します

```bash
pnpm install
pnpm dev

# pnpmがインストールされていない場合は、npmを使用して依存関係を解決して起動することもできます
npm install
npm run dev
```

その後、出力情報に従って、`http://127.0.0.1:3000`にアクセスして、スタンドアロンフロントエンドページを表示します。

:::info
`pnpm dev`を使用してローカルで起動すると、環境変数`NEXT_PUBLIC_API_BASE_URL`がフロントエンドによって自動的に使用され、フロントエンドがローカルで実行中のバックエンドの`5300`ポートにアクセスできるようになります。

本番環境では、フロントエンドは静的ファイルにプリコンパイルされ、バックエンドによって提供され、フロントエンドは同じドメインのバックエンドアドレスに自動的にアクセスします。
:::

## APIドキュメント

各インターフェースを開発する前に、APIFoxでAPIドキュメントを作成します。[APIドキュメント(中国語)](https://ok52vhsenr.apifox.cn/)を参照してください。