{"id":10187,"date":"2024-05-10T17:32:17","date_gmt":"2024-05-10T15:32:17","guid":{"rendered":"https:\/\/via-internet.de\/blog\/?p=10187"},"modified":"2024-05-10T18:08:21","modified_gmt":"2024-05-10T16:08:21","slug":"ollama-create-a-chatgpt-clone-with-ollama-and-hyperdiv","status":"publish","type":"post","link":"https:\/\/via-internet.de\/blog\/2024\/05\/10\/ollama-create-a-chatgpt-clone-with-ollama-and-hyperdiv\/","title":{"rendered":"Ollama | Create a ChatGPT Clone with Ollama and HyperDiv"},"content":{"rendered":"\n

In this blog post, we\u2019ll explore how to create a ChatGPT-like application using Hyperdiv and Ollama. Hyperdiv<\/a> provides a flexible framework for building web applications, while Ollama<\/a> offers powerful local machine learning capabilities.<\/p>\n\n\n\n

We will start with the Hyperdiv GPT-chatbot app template and adapt it to leverage Ollama, which runs locally. This guide will walk you through the necessary steps and code changes to integrate these technologies effectively.<\/p>\n\n\n\n

TL;DR<\/h2>\n\n\n\n

The complete code for this tutorial is here<\/a>.<\/p>\n\n\n\n

Step 1: Setting Up Your Environment<\/h2>\n\n\n\n

Install Ollama<\/h3>\n\n\n\n

Download Ollama from https:\/\/ollama.com\/download<\/a>. <\/p>\n\n\n\n

Install (Windows) or unpack (macOS) the downloaded file. This gets you an Ollama app (which allows you to start the Ollama service) and a Ollama command line.<\/p>\n\n\n\n

Start the Ollama service by starting the Ollama app.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

On macOS, you will see an icon for the Ollama Servce at the top bar.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Then, open a terminal and type ollama list<\/code>. This command displays the install models.<\/p>\n\n\n\n

ollama list<\/pre>\n\n\n\n
\"\"<\/figure>\n\n\n\n
<\/p>\n\n\n\n
To install a model, type <\/p>\n\n\n\n
ollama pull llama3<\/pre>\n\n\n\n
\"\"<\/figure>\n\n\n\n
For our ChatGPT Clone, we will use the llama3 model.<\/p>\n\n\n\n
If you want to use another model, then search here: https:\/\/ollama.com\/library<\/a><\/p>\n\n\n\n
Clone the HyperDiv Examples Repository<\/h3>\n\n\n\n
Start by cloning or downloading the Hyperdiv GPT-chatbot app. This app provides a basic structure for a chatbot application, which we will modify to work with Ollama.<\/p>\n\n\n\n
Go to your desired local folder to store the sources and type<\/p>\n\n\n\n
git clone https:\/\/github.com\/hyperdiv\/hyperdiv-apps<\/pre>\n\n\n\n
Then, go to the folder hyperdiv-apps\/gpt-chatbot<\/code><\/p>\n\n\n\n
Adapt app to use Ollama backend<\/h2>\n\n\n\n
First, we will create an ollama client to process all request:<\/p>\n\n\n\n
from openai import OpenAI\n\nclient = OpenAI(\n    base_url=\"http:\/\/localhost:11434\/v1\",\n    api_key=\"ollama\",\n)<\/pre>\n\n\n\n
\"\"<\/figure>\n\n\n\n
Then we modify the request function to use this client<\/p>\n\n\n\n
We change<\/p>\n\n\n\n
response = openai.ChatCompletion.create(<\/pre>\n\n\n\n
to<\/p>\n\n\n\n
response = client.chat.completions.create(<\/pre>\n\n\n\n
\"\"<\/figure>\n\n\n\n
Next step is changing the accees to the response fields. With OpenAI, the response data is a dictionary, so the way to acess the fields is like<\/p>\n\n\n\n
chunk[\"choices\"]<\/pre>\n\n\n\n
 With Ollama, we can access the field by name<\/p>\n\n\n\n
chunk.choices<\/pre>\n\n\n\n
The changes are<\/p>\n\n\n\n
 for chunk in response:\n    message = chunk.choices[0].delta\n    state.current_reply += message.content<\/pre>\n\n\n\n
\"\"<\/figure>\n\n\n\n
And the last step would be the change to use the correct model:<\/p>\n\n\n\n
model = form.select(\n    options=(\"codellama\", \"llama2\", \"llama3\", \"mistral\"),\n        value=\"llama3\",\n        name=\"gpt-model\",\n)<\/pre>\n\n\n\n
\"\"<\/figure>\n\n\n\n
Thats is! Save all changes<\/p>\n\n\n\n
Prepare Python environment and run app<\/h2>\n\n\n\n
Install the required modules:<\/p>\n\n\n\n
pip install openai hyperdiv<\/pre>\n\n\n\n
Run the app:<\/p>\n\n\n\n
python start.py<\/pre>\n\n\n\n
\"\"<\/figure>\n\n\n\n
Open the browser at http:\/\/localhost:8888<\/a><\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
Final Result<\/h2>\n\n\n\n
\"\"<\/figure>\n\n\n\n
The complete code for this tutorial is here<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"
In this blog post, we\u2019ll explore how to create a ChatGPT-like application using Hyperdiv and Ollama. Hyperdiv provides a flexible framework for building web applications, while Ollama offers powerful local machine learning capabilities. We will start with the Hyperdiv GPT-chatbot app template and adapt it to leverage Ollama, which runs locally. This guide will walk you through the necessary steps and code changes to integrate these technologies effectively. TL;DR The complete code for this tutorial is here. Step 1: Setting Up Your Environment Install Ollama Download Ollama from https:\/\/ollama.com\/download. Install (Windows) or unpack (macOS) the downloaded file. This gets you an […]<\/p>\n","protected":false},"author":1,"featured_media":10188,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_crdt_document":"","_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[165,164,65],"tags":[],"class_list":["post-10187","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-hyperdiv","category-ollama","category-python"],"jetpack_featured_media_url":"https:\/\/via-internet.de\/blog\/wp-content\/uploads\/2024\/05\/image-1.png","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/via-internet.de\/blog\/wp-json\/wp\/v2\/posts\/10187","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/via-internet.de\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/via-internet.de\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/via-internet.de\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/via-internet.de\/blog\/wp-json\/wp\/v2\/comments?post=10187"}],"version-history":[{"count":9,"href":"https:\/\/via-internet.de\/blog\/wp-json\/wp\/v2\/posts\/10187\/revisions"}],"predecessor-version":[{"id":10212,"href":"https:\/\/via-internet.de\/blog\/wp-json\/wp\/v2\/posts\/10187\/revisions\/10212"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/via-internet.de\/blog\/wp-json\/wp\/v2\/media\/10188"}],"wp:attachment":[{"href":"https:\/\/via-internet.de\/blog\/wp-json\/wp\/v2\/media?parent=10187"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/via-internet.de\/blog\/wp-json\/wp\/v2\/categories?post=10187"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/via-internet.de\/blog\/wp-json\/wp\/v2\/tags?post=10187"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}