Works with GPT 3.5 turbo and chat history but should also work with Chat GPT 4 you just need the api key for it. Is able to do lists, bullet points, email templates and code blocks. Saved chat history, huge list of prompts added ⌵

Add your Open AI API Key and run it on your local network https://localhost:5000 or with https:// your.domain.com either one works!

1. Clone the repo
2. Install with Docker CLI / Docker Compose
3. Build on Ubuntu or Debian
4. Set up a Cloudflare Tunnel for HTTPS optional
5. Run on a devcontainer VScode

Host your own Ai Chat bot

Save, Load and Delete Chats

wide view

Project Root
├── TKS-GPT
│   ├── app.py (Flask Backend)
│   ├── .env (Environment Variables)
│   ├── venv (Virtual Environment)
│   └── ...
└── chatbot-ui (React Frontend)
    ├── package.json (Dependencies and scripts)
    ├── src
    │   ├── App.js (Main component, includes axios API call)
    │   └── ...
    └── build (Generated by 'npm run build')

git clone https://github.com/bigsk1/TKS-GPT.git

cd TKS-GPT

https://hub.docker.com/r/bigsk1/tks-gpt

docker run -d -p 5000:5000 --name tks-gpt --env OPENAI_API_KEY=your_openai_api_key --restart always bigsk1/tks-gpt:latest

Docker compose

version: '3.8'

services:
  app:
    image: bigsk1/tks-gpt:latest
    environment:
      - OPENAI_API_KEY=<your_openai_api_key>
    ports:
      - "5000:5000"
    restart: unless-stopped
    security_opt:
      - no-new-privileges:true

You can use docker cli in same folder as the Dockerfile

docker build -t your_image_name .

docker run -d -p 5000:5000 --name tksgpt-container --env OPENAI_API_KEY=ENTER_YOUR_OPEN_AI_APIKEY_HERE your_image_name

or

In the docker-compose.yml file add your Open AI Api key

version: '3.8'

services:
  app:
    build: .
    image: your_custom_image_name
    restart: unless-stopped
    environment:
      - OPENAI_API_KEY=your_openai_api_key
    ports:
      - "5000:5000"

and then

docker-compose up -d

Your app will be running on https://localhost:5000 use it as is or add ssl both work with no code change needed.

THERE ARE TWO PARTS TO YOUR PROJECT A BACKEND AND A FRONTEND

Active Virtual Enviroment ( optional but recommended )

For Python, you'll need to create a virtual environment. In your project directory, run:

python3 -m venv venv

Activate the virtual environment:

source venv/bin/activate

Install Python dependencies:

With the virtual environment activated, install the required Python packages using the requirements.txt file:

pip install -r requirements.txt

Exit out of virtual enviroment and back to the TKS-GPT folder type deactivate

Install Node.js and npm:

Make sure Node.js and npm are installed on your system. You can check if they are installed by running:

node -v
npm -v

You need Node version 18+

If not installed, you can download them from the official Node.js website https://nodejs.org/en/download/

See here https://github.com/nodesource/distributions

Install frontend dependencies:

Node (v19.x) to current

sudo apt update
sudo apt install -y curl

curl -fsSL https://deb.nodesource.com/setup_current.x | sudo -E bash - &&\
sudo apt-get install -y nodejs

sudo apt-get install -y build-essential

Node (v19.x) to current

sudo apt install curl

curl -fsSL https://deb.nodesource.com/setup_current.x | bash - &&\
apt-get install -y nodejs

run as root on debian

apt-get install -y build-essential

Navigate to the frontend folder (the folder containing the package.json file, e.g., chatbot-ui), and install the required npm packages:

cd chatbot-ui
npm install

To connect the front-end to the back-end

Install Axios in your chatbot-ui folder:

npm install axios

Set up environment variables:

Make sure you have a .env file in (TKS-GPT folder) with the required environment variables (such as OPENAI_API_KEY).

After completing these steps, you should be able to run both the backend and frontend servers and start using your chatbot application.

TKS-GPT
├── app.py
├── chatbot-ui
│   ├── build
│   │   └── ...
│   ├── node_modules
│   │   └── ...
│   ├── public
│   │   └── ...
│   ├── src
│   │   ├── App.css
│   │   ├── App.js
│   │   ├── App.test.js
│   │   ├── index.css
│   │   ├── index.js
│   │   ├── logo.svg
│   │   ├── MessageContent.js
│   │   ├── Prompts.js
│   │   ├── reportWebVitals.js
│   │   ├── SavedChats.css
│   │   ├── SavedChats.js
│   │   ├── setupTests.js
│   │   └── ...
│   ├
│   ├── .gitignore
│   ├── package.json
│   └── package-lock.json
├── .dockerignore
├── Dockerfile
├── docker-compose.yml
├── .env
├── flask_app.log
├── .gitignore
├── requirements.txt
└── venv
    └── ...

Axios: Axios is used in the App.js file to make an HTTP POST request to the Flask backend's /chat endpoint. The request contains the user's message, and the response from the server contains the AI-generated message.

React: React is used for building the frontend user interface. The project was created using Create React App, and it uses components and state management with hooks (e.g., useState).

Node.js: Node.js is used as the underlying runtime environment for running the development server (npm start) and for building the production-ready static files (npm run build). It also manages the dependencies through package.json

The frontend and backend communicate via an API call made with axios from the App.js file. When the user enters a message and clicks the "Send" button, the frontend sends an HTTP POST request to the backend's /chat endpoint. The backend processes the request, interacts with the GPT model, and returns the AI-generated response, which the frontend then displays.

cd TKS-GPT/chatbot-ui

npm run build

In the TKS-GPT project folder

source venv/bin/activate

python3 app.py

On ubuntu you can use systemd to create a service to keep running even after a restart

make file for systemd service add your own user, group and path's

sudo nano /etc/systemd/system/tkschat.service

[Unit]
Description=TKS Chat Bot
After=network.target

[Service]
User=edit_for_user  ( normally your user name )
Group=edit_for_group  ( normally your user name )
WorkingDirectory=/path/to/your/flask/app/TKS-GPT
Environment="PATH=/path/to/your/TKS-GPT/venv/bin"
ExecStart=/path/to/your/venv/bin/python3 app.py
Restart=on-failure
RestartSec=5s

[Install]
WantedBy=multi-user.target

Save and exit the file.

Reload the systemd daemon to register your new service

sudo systemctl daemon-reload

Enable your service to start at boot:

sudo systemctl enable tkschat.service

Start your service:

sudo systemctl start tkschat.service

Now, your Flask app will automatically start when the system boots up. To check the status of your service, use the following command:

sudo systemctl status tkschat.service

You can also stop, restart, or disable the service using systemctl commands:

sudo systemctl stop tkschat.service
sudo systemctl restart tkschat.service
sudo systemctl disable tkschat.service

check systemd logs for errors

journalctl -u tkschat.service

https://developers.cloudflare.com/cloudflare-one/connections/connect-apps/install-and-setup/tunnel-guide

Your App will be on https://YOUR-LOCAL-IP-ADDRESS:5000

The easiest way is to use the UI in zero trust and make a tunnel and assign it a domain or subdomain. Allow your domain as origin, POST and GET methods, all headers.

Want to make updates and changes and using systemd?

first stop systemd server for flask using

sudo systemctl stop tkschat.service

in /TKS-GPT/chatbot-ui

npm run build

once built can enabled again using

sudo systemctl restart tkschat.service

git clone https://github.com/bigsk1/TKS-GPT.git

cd TKS-GPT

Open in Dev Container and when asked in terminal enter Open Ai Api Key, browse to localhost:5000

Read more about how this app was built using Chat-GPT https://bigsk1.github.io/posts/building-an-app-with-chat-gpt/