README.md 14.5 KB
Newer Older
Timothy J. Baek's avatar
Timothy J. Baek committed
1
# Ollama Web UI: A User-Friendly Web Interface for Chat Interactions 👋
Timothy J. Baek's avatar
Timothy J. Baek committed
2

Timothy J. Baek's avatar
Timothy J. Baek committed
3
4
5
![GitHub stars](https://img.shields.io/github/stars/ollama-webui/ollama-webui?style=social)
![GitHub forks](https://img.shields.io/github/forks/ollama-webui/ollama-webui?style=social)
![GitHub watchers](https://img.shields.io/github/watchers/ollama-webui/ollama-webui?style=social)
Timothy J. Baek's avatar
Timothy J. Baek committed
6
7
8
9
![GitHub repo size](https://img.shields.io/github/repo-size/ollama-webui/ollama-webui)
![GitHub language count](https://img.shields.io/github/languages/count/ollama-webui/ollama-webui)
![GitHub top language](https://img.shields.io/github/languages/top/ollama-webui/ollama-webui)
![GitHub last commit](https://img.shields.io/github/last-commit/ollama-webui/ollama-webui?color=red)
Timothy J. Baek's avatar
Timothy J. Baek committed
10
![Hits](https://hits.seeyoufarm.com/api/count/incr/badge.svg?url=https%3A%2F%2Fgithub.com%2Follama-webui%2Follama-wbui&count_bg=%2379C83D&title_bg=%23555555&icon=&icon_color=%23E7E7E7&title=hits&edge_flat=false)
Timothy Jaeryang Baek's avatar
Timothy Jaeryang Baek committed
11
[![Discord](https://img.shields.io/badge/Discord-Ollama_Web_UI-blue?logo=discord&logoColor=white)](https://discord.gg/5rJgQTnV4s)
Timothy J. Baek's avatar
Timothy J. Baek committed
12
[![](https://img.shields.io/static/v1?label=Sponsor&message=%E2%9D%A4&logo=GitHub&color=%23fe8e86)](https://github.com/sponsors/tjbck)
Timothy J. Baek's avatar
Timothy J. Baek committed
13

Timothy J. Baek's avatar
Timothy J. Baek committed
14
15
ChatGPT-Style Web Interface for Ollama 🦙

Timothy J. Baek's avatar
Timothy J. Baek committed
16
**Disclaimer:** _ollama-webui is a community-driven project and is not affiliated with the Ollama team in any way. This initiative is independent, and any inquiries or feedback should be directed to [our community on Discord](https://discord.gg/5rJgQTnV4s). We kindly request users to refrain from contacting or harassing the Ollama team regarding this project._
Timothy Jaeryang Baek's avatar
Timothy Jaeryang Baek committed
17

Timothy J. Baek's avatar
Timothy J. Baek committed
18
19
![Ollama Web UI Demo](./demo.gif)

Timothy Jaeryang Baek's avatar
Timothy Jaeryang Baek committed
20
21
Also check our sibling project, [OllamaHub](https://ollamahub.com/), where you can discover, download, and explore customized Modelfiles for Ollama! 🦙🔍

Timothy J. Baek's avatar
Timothy J. Baek committed
22
23
24
## Features ⭐

- 🖥️ **Intuitive Interface**: Our chat interface takes inspiration from ChatGPT, ensuring a user-friendly experience.
25

Timothy J. Baek's avatar
Timothy J. Baek committed
26
- 📱 **Responsive Design**: Enjoy a seamless experience on both desktop and mobile devices.
27

Timothy J. Baek's avatar
Timothy J. Baek committed
28
-**Swift Responsiveness**: Enjoy fast and responsive performance.
29

Daniele Viti's avatar
Daniele Viti committed
30
- 🚀 **Effortless Setup**: Install seamlessly using Docker or Kubernetes (kubectl, kustomize or helm) for a hassle-free experience.
31

Timothy J. Baek's avatar
Timothy J. Baek committed
32
33
34
35
- 💻 **Code Syntax Highlighting**: Enjoy enhanced code readability with our syntax highlighting feature.

- ✒️🔢 **Full Markdown and LaTeX Support**: Elevate your LLM experience with comprehensive Markdown and LaTeX capabilities for enriched interaction.

36
37
- 📥🗑️ **Download/Delete Models**: Easily download or remove models directly from the web UI.

Timothy J. Baek's avatar
Timothy J. Baek committed
38
- ⬆️ **GGUF File Model Creation**: Effortlessly create Ollama models by uploading GGUF files directly from the web UI. Streamlined process with options to upload from your machine or download GGUF files from Hugging Face.
Timothy J. Baek's avatar
Timothy J. Baek committed
39

Timothy J. Baek's avatar
Timothy J. Baek committed
40
- 🤖 **Multiple Model Support**: Seamlessly switch between different chat models for diverse interactions.
41

Timothy J. Baek's avatar
Timothy J. Baek committed
42
43
- 🔄 **Multi-Modal Support**: Seamlessly engage with models that support multimodal interactions, including images (e.g., LLava).

44
- 🧩 **Modelfile Builder**: Easily create Ollama modelfiles via the web UI. Create and add characters/agents, customize chat elements, and import modelfiles effortlessly through [OllamaHub](https://ollamahub.com/) integration.
Timothy Jaeryang Baek's avatar
Timothy Jaeryang Baek committed
45

Timothy J. Baek's avatar
Timothy J. Baek committed
46
- ⚙️ **Many Models Conversations**: Effortlessly engage with various models simultaneously, harnessing their unique strengths for optimal responses. Enhance your experience by leveraging a diverse set of models in parallel.
Timothy J. Baek's avatar
Timothy J. Baek committed
47

Timothy Jaeryang Baek's avatar
Timothy Jaeryang Baek committed
48
- 🤝 **OpenAI API Integration**: Effortlessly integrate OpenAI-compatible API for versatile conversations alongside Ollama models. Customize the API Base URL to link with **LMStudio, Mistral, OpenRouter, and more**.
Timothy J. Baek's avatar
Timothy J. Baek committed
49

Timothy J. Baek's avatar
Timothy J. Baek committed
50
51
- 🔄 **Regeneration History Access**: Easily revisit and explore your entire regeneration history.

52
- 📜 **Chat History**: Effortlessly access and manage your conversation history.
53

Timothy J. Baek's avatar
Timothy J. Baek committed
54
- 📤📥 **Import/Export Chat History**: Seamlessly move your chat data in and out of the platform.
55

Timothy J. Baek's avatar
Timothy J. Baek committed
56
- 🗣️ **Voice Input Support**: Engage with your model through voice interactions; enjoy the convenience of talking to your model directly. Additionally, explore the option for sending voice input automatically after 3 seconds of silence for a streamlined experience.
Timothy J. Baek's avatar
Timothy J. Baek committed
57

Timothy J. Baek's avatar
Timothy J. Baek committed
58
- ⚙️ **Fine-Tuned Control with Advanced Parameters**: Gain a deeper level of control by adjusting parameters such as temperature and defining your system prompts to tailor the conversation to your specific preferences and needs.
59

Timothy J. Baek's avatar
Timothy J. Baek committed
60
61
- 🔐 **Auth Header Support**: Effortlessly enhance security by adding Authorization headers to Ollama requests directly from the web UI settings, ensuring access to secured Ollama servers.

Timothy J. Baek's avatar
Timothy J. Baek committed
62
- 🔗 **External Ollama Server Connection**: Seamlessly link to an external Ollama server hosted on a different address by configuring the environment variable during the Docker build phase. Additionally, you can also set the external server connection URL from the web UI post-build.
63

Timothy J. Baek's avatar
Timothy J. Baek committed
64
- 🔒 **Backend Reverse Proxy Support**: Strengthen security by enabling direct communication between Ollama Web UI backend and Ollama, eliminating the need to expose Ollama over LAN.
65

Timothy J. Baek's avatar
Timothy J. Baek committed
66
67
- 🌟 **Continuous Updates**: We are committed to improving Ollama Web UI with regular updates and new features.

68
## 🔗 Also Check Out OllamaHub!
Timothy Jaeryang Baek's avatar
Timothy Jaeryang Baek committed
69
70
71

Don't forget to explore our sibling project, [OllamaHub](https://ollamahub.com/), where you can discover, download, and explore customized Modelfiles. OllamaHub offers a wide range of exciting possibilities for enhancing your chat interactions with Ollama! 🚀

Timothy J. Baek's avatar
Timothy J. Baek committed
72
73
## How to Install 🚀

74
### Installing Both Ollama and Ollama Web UI Using Docker Compose
Timothy J. Baek's avatar
Timothy J. Baek committed
75

76
If you don't have Ollama installed yet, you can use the provided bash script for a hassle-free installation. Simply run the following command:
Timothy Jaeryang Baek's avatar
Timothy Jaeryang Baek committed
77

78
For cpu-only container
Timothy Jaeryang Baek's avatar
Timothy Jaeryang Baek committed
79
```bash
80
chmod +x run-compose.sh && ./run-compose.sh
Timothy Jaeryang Baek's avatar
Timothy Jaeryang Baek committed
81
82
```

83
84
85
86
87
88
89
90
91
For gpu-enabled container (to enable this you must have your gpu driver for docker, it mostly works with nvidia so this is the official install guide: [nvidia-container-toolkit](https://docs.nvidia.com/datacenter/cloud-native/container-toolkit/latest/install-guide.html))
```bash
chmod +x run-compose.sh && ./run-compose.sh --enable-gpu[count=1]
```

Note that both the above commands will use the latest production docker image in repository, to be able to build the latest local version you'll need to append the `--build` parameter, for example:
```bash
./run-compose.sh --build --enable-gpu[count=1]
```
Timothy Jaeryang Baek's avatar
Timothy Jaeryang Baek committed
92

Daniele Viti's avatar
Daniele Viti committed
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
### Installing Both Ollama and Ollama Web UI Using Kustomize
For cpu-only pod
```bash
kubectl apply -f ./kubernetes/manifest/base
```
For gpu-enabled pod
```bash
kubectl apply -k ./kubernetes/manifest
```

### Installing Both Ollama and Ollama Web UI Using Helm
Package Helm file first
```bash
helm package ./kubernetes/helm/
```

For cpu-only pod
```bash
helm install ollama-webui ./ollama-webui-*.tgz
```
For gpu-enabled pod
```bash
helm install ollama-webui ./ollama-webui-*.tgz --set ollama.resources.limits.nvidia.com/gpu="1"
```

Check the `kubernetes/helm/values.yaml` file to know which parameters are available for customization

120
121
122
123
124
125
126
### Installing Ollama Web UI Only

#### Prerequisites

Make sure you have the latest version of Ollama installed before proceeding with the installation. You can find the latest version of Ollama at [https://ollama.ai/](https://ollama.ai/).

##### Checking Ollama
Timothy J. Baek's avatar
Timothy J. Baek committed
127

128
After installing Ollama, verify that Ollama is running by accessing the following link in your web browser: [http://127.0.0.1:11434/](http://127.0.0.1:11434/). Note that the port number may differ based on your system configuration.
Timothy J. Baek's avatar
Timothy J. Baek committed
129

130
#### Using Docker 🐳
Timothy J. Baek's avatar
Timothy J. Baek committed
131

132
If Ollama is hosted on your local machine and accessible at [http://127.0.0.1:11434/](http://127.0.0.1:11434/), run the following command:
Timothy J. Baek's avatar
Timothy J. Baek committed
133
134

```bash
135
docker run -d -p 3000:8080 --add-host=host.docker.internal:host-gateway --name ollama-webui --restart always ghcr.io/ollama-webui/ollama-webui:main
Timothy J. Baek's avatar
Timothy J. Baek committed
136
137
```

138
Alternatively, if you prefer to build the container yourself, use the following command:
Timothy J. Baek's avatar
Timothy J. Baek committed
139
140

```bash
141
142
docker build -t ollama-webui .
docker run -d -p 3000:8080 --add-host=host.docker.internal:host-gateway --name ollama-webui --restart always ollama-webui
Timothy J. Baek's avatar
Timothy J. Baek committed
143
144
```

145
Your Ollama Web UI should now be hosted at [http://localhost:3000](http://localhost:3000) and accessible over LAN (or Network). Enjoy! 😄
Timothy J. Baek's avatar
Timothy J. Baek committed
146

147
#### Accessing External Ollama on a Different Server
148

Timothy J. Baek's avatar
Timothy J. Baek committed
149
Change `OLLAMA_API_BASE_URL` environment variable to match the external Ollama Server url:
Timothy J. Baek's avatar
Timothy J. Baek committed
150
151

```bash
Timothy J. Baek's avatar
Timothy J. Baek committed
152
153
154
155
156
157
158
159
docker run -d -p 3000:8080 -e OLLAMA_API_BASE_URL=https://example.com/api --name ollama-webui --restart always ghcr.io/ollama-webui/ollama-webui:main
```

Alternatively, if you prefer to build the container yourself, use the following command:

```bash
docker build -t ollama-webui .
docker run -d -p 3000:8080 -e OLLAMA_API_BASE_URL=https://example.com/api --name ollama-webui --restart always ollama-webui
Timothy J. Baek's avatar
Timothy J. Baek committed
160
161
```

162
## How to Install Without Docker
163

164
165
While we strongly recommend using our convenient Docker container installation for optimal support, we understand that some situations may require a non-Docker setup, especially for development purposes. Please note that non-Docker installations are not officially supported, and you might need to troubleshoot on your own.

166
167
168
169
**Warning: Backend Dependency for Proper Functionality**

In order to ensure the seamless operation of our application, it is crucial to run both the backend and frontend components simultaneously. Serving only the frontend in isolation is not supported and may lead to unpredictable outcomes, rendering the application inoperable. Attempting to raise an issue when solely serving the frontend will not be addressed, as it falls outside the intended usage. To achieve optimal results, please strictly adhere to the specified steps outlined in this documentation. Utilize the frontend solely for building static files, and subsequently run the complete application with the provided backend commands. Failure to follow these instructions may result in unsupported configurations, and we may not be able to provide assistance in such cases. Your cooperation in following the prescribed procedures is essential for a smooth user experience and effective issue resolution.

170
### TL;DR 🚀
171
172
173
174
175
176
177

Run the following commands to install:

```sh
git clone https://github.com/ollama-webui/ollama-webui.git
cd ollama-webui/

178
# Copying required .env file
179
cp -RPp example.env .env
180
181

# Building Frontend
182
183
184
npm i
npm run build

185
# Serving Frontend with the Backend
186
187
188
189
cd ./backend
pip install -r requirements.txt
sh start.sh
```
190

191
192
You should have the Ollama Web UI up and running at http://localhost:8080/. Enjoy! 😄

193
194
195
196
197
198
199
### Project Components

The Ollama Web UI consists of two primary components: the frontend and the backend (which serves as a reverse proxy, handling static frontend files, and additional features). Both need to be running concurrently for the development environment using `npm run dev`. Alternatively, you can set the `PUBLIC_API_BASE_URL` during the build process to have the frontend connect directly to your Ollama instance or build the frontend as static files and serve them with the backend.

### Prerequisites

1. **Clone and Enter the Project:**
200
201

   ```sh
202
   git clone https://github.com/ollama-webui/ollama-webui.git
203
   cd ollama-webui/
204
205
   ```

206
2. **Create and Edit `.env`:**
207
208

   ```sh
209
   cp -RPp example.env .env
210
   ```
211

212
213
214
### Building Ollama Web UI Frontend

1. **Install Node Dependencies:**
215

216
   ```sh
217
   npm install
218
   ```
219

220
2. **Run in Dev Mode or Build for Deployment:**
221

222
   - Dev Mode (requires the backend to be running simultaneously):
223

224
225
226
     ```sh
     npm run dev
     ```
227

228
   - Build for Deployment:
229

230
     ```sh
231
     # `PUBLIC_API_BASE_URL` overwrites the value in `.env`
232
233
     PUBLIC_API_BASE_URL='https://example.com/api' npm run build
     ```
234

235
3. **Test the Build with `Caddy` (or your preferred server):**
236
237
238
239
240
241
242
243

   ```sh
   curl https://webi.sh/caddy | sh

   PUBLIC_API_BASE_URL='https://localhost/api' npm run build
   caddy run --envfile .env --config ./Caddyfile.localhost
   ```

244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
### Running Ollama Web UI Backend

If you wish to run the backend for deployment, ensure that the frontend is built so that the backend can serve the frontend files along with the API route.

#### Setup Instructions

1. **Install Python Requirements:**

   ```sh
   cd ./backend
   pip install -r requirements.txt
   ```

2. **Run Python Backend:**

   - Dev Mode with Hot Reloading:

     ```sh
     sh dev.sh
     ```

   - Deployment:

     ```sh
     sh start.sh
     ```

Now, you should have the Ollama Web UI up and running at [http://localhost:8080/](http://localhost:8080/). Feel free to explore the features and functionalities of Ollama! If you encounter any issues, please refer to the instructions above or reach out to the community for assistance.

273
274
## Troubleshooting

275
See [TROUBLESHOOTING.md](/TROUBLESHOOTING.md) for information on how to troubleshoot and/or join our [Ollama Web UI Discord community](https://discord.gg/5rJgQTnV4s).
276

Timothy J. Baek's avatar
Timothy J. Baek committed
277
278
## What's Next? 🚀

Timothy Jaeryang Baek's avatar
Timothy Jaeryang Baek committed
279
### Roadmap 📝
Timothy J. Baek's avatar
Timothy J. Baek committed
280

Timothy Jaeryang Baek's avatar
Timothy Jaeryang Baek committed
281
Here are some exciting tasks on our roadmap:
Timothy J. Baek's avatar
Timothy J. Baek committed
282

Timothy Jaeryang Baek's avatar
Timothy Jaeryang Baek committed
283
- 📚 **RAG Integration**: Experience first-class retrieval augmented generation support, enabling chat with your documents.
Timothy J. Baek's avatar
Timothy J. Baek committed
284
- 🔐 **Access Control**: Securely manage requests to Ollama by utilizing the backend as a reverse proxy gateway, ensuring only authenticated users can send specific requests.
Timothy J. Baek's avatar
Timothy J. Baek committed
285
286
- 🧪 **Research-Centric Features**: Empower researchers in the fields of LLM and HCI with a comprehensive web UI for conducting user studies. Stay tuned for ongoing feature enhancements (e.g., surveys, analytics, and participant tracking) to facilitate their research.
- 📈 **User Study Tools**: Providing specialized tools, like heat maps and behavior tracking modules, to empower researchers in capturing and analyzing user behavior patterns with precision and accuracy.
Timothy J. Baek's avatar
Timothy J. Baek committed
287
288
289
290
- 📚 **Enhanced Documentation**: Elevate your setup and customization experience with improved, comprehensive documentation.

Feel free to contribute and help us make Ollama Web UI even better! 🙌

291
292
293
## Supporters ✨

A big shoutout to our amazing supporters who's helping to make this project possible! 🙏
Timothy J. Baek's avatar
Timothy J. Baek committed
294

295
### Platinum Sponsors 🤍
Timothy J. Baek's avatar
Timothy J. Baek committed
296

297
- [Prof. Lawrence Kim @ SFU](https://www.lhkim.com/)
Timothy J. Baek's avatar
Timothy J. Baek committed
298
299
300

## License 📜

Timothy J. Baek's avatar
Timothy J. Baek committed
301
This project is licensed under the [MIT License](LICENSE) - see the [LICENSE](LICENSE) file for details. 📄
Timothy J. Baek's avatar
Timothy J. Baek committed
302
303
304

## Support 💬

Timothy J. Baek's avatar
Timothy J. Baek committed
305
If you have any questions, suggestions, or need assistance, please open an issue or join our
Timothy Jaeryang Baek's avatar
Timothy Jaeryang Baek committed
306
[Ollama Web UI Discord community](https://discord.gg/5rJgQTnV4s) or
Timothy J. Baek's avatar
Timothy J. Baek committed
307
[Ollama Discord community](https://discord.gg/ollama) to connect with us! 🤝
Timothy J. Baek's avatar
Timothy J. Baek committed
308
309
310

---

311
Created by [Timothy J. Baek](https://github.com/tjbck) - Let's make Ollama Web UI even more amazing together! 💪