# Installation

## Requirements

| Resource | Notes |
| --- | --- |
| [koja-lib](/koja-lib/getting-started) | Required. Names, jobs, money, admin groups and Discord logging go through it |
| ESX, QBCore, QBX or a custom framework | Supported through koja-lib |
| OneSync | Recommended. Proximity is calculated on the server. Without it the clients filter by distance |

No database is needed.

:::steps

### Add the resource

Put `koja-chat` in your `resources` folder. Keep the folder name.

### Remove the default chat

Remove or stop the default `chat` resource. `ensure chat` is usually started by `[system]`.
Koja Chat declares `provide 'chat'`, so scripts that use `exports.chat` or the `chat:` events keep working without the original.

### Start it after koja-lib

```cfg title="server.cfg"
ensure koja-lib
ensure koja-chat
```

### Configure it

Edit `editable/config.lua`. Change names, badges and the admin check in `editable/server.lua`, and the open check in `editable/client.lua`. See [Configuration](/new/chat/configuration).

:::

:::hint{type="info" title="Staff"}
Who counts as staff (the Staff tab, admin commands, spam bypass) comes from the koja-lib admin groups. Set `Config.AdminGroups` or `Config.AdminAce` in `editable/config.lua` to use your own, or change `Custom.IsAdmin` in `editable/server.lua`.
:::

## Developer console (optional)

The Console tab is off by default. To use it, enable `Config.DevMode.enabled` and give the group the ACE:

```cfg title="server.cfg"
add_ace group.admin koja-chat.dev allow
```

Running server commands from the tab needs the separate `Config.DevMode.execute = true`. Only enable it for people you trust with the server console.

## Discord logs (optional)

Set `Config.Logs.enabled = true` and a webhook in `Config.Logs.webhook`. See [Configuration](/new/chat/configuration).

## Building the UI (only if you change it)

The release ZIP ships the built UI in `web/build`. A source download of the repository does not, so build it first.

```bash title="web"
cd web
npm ci
npm run build   # outputs web/build
npm run dev     # browser preview with sample messages
```

## Check that it works

- Press `T` (the default `Config.OpenKey`). Players can rebind it in the GTA key settings under FiveM.
- Type `/me waves`. The text appears for players within range and above your head.
- Open the chat settings in the chat to change style, colour and position.