Deploy a lightweight AI utility on Civo using relaxAI and Civo Database

1mysql -h <HOST> -P <PORT> -u <USERNAME> -p

1CREATE DATABASE IF NOT EXISTS ai_tools;
2USE ai_tools;
3
4CREATE TABLE IF NOT EXISTS prompts (
5  id INT AUTO_INCREMENT PRIMARY KEY,
6  name VARCHAR(100) NOT NULL UNIQUE,
7  template TEXT NOT NULL
8);

1INSERT INTO prompts (name, template) VALUES
2  ('summarizer',      'Summarize the following text: {text}'),
3  ('polite_rewriter', 'Rewrite this message in a polite tone: {text}'),
4  ('code_explainer',  'Explain this code in simple terms: {text}');

1UPDATE prompts SET template = '…' WHERE name = '…';

1import os
2import requests
3import mysql.connector  # For connecting to MySQL database
4from fastapi import FastAPI, HTTPException  # Web framework and exception handling
5from pydantic import BaseModel  # For request validation
6from fastapi.middleware.cors import CORSMiddleware  # To handle CORS
7import logging  # For logging error/info/debug messages
8
9# --- Logging Configuration ---
10# Sets up logging format and level globally
11logging.basicConfig(level=logging.INFO, format='%(levelname)s:%(name)s:%(message)s')
12logger = logging.getLogger(__name__)
13
14# --- MySQL Database Configuration using environment variables ---
15DB_HOST = os.getenv("MYSQL_HOST")
16DB_USER = os.getenv("MYSQL_USER")
17DB_PASSWORD = os.getenv("MYSQL_PASSWORD")
18DB_NAME = os.getenv("MYSQL_DATABASE")
19
20# Function to establish and return a MySQL connection
21def get_db_connection():
22    try:
23        conn = mysql.connector.connect(
24            host=DB_HOST,
25            user=DB_USER,
26            password=DB_PASSWORD,
27            database=DB_NAME
28        )
29        return conn
30    except mysql.connector.Error as err:
31        logger.error(f"Error connecting to MySQL database: {err}")
32        raise HTTPException(status_code=500, detail="Database connection error.")
33
34# --- FastAPI App Initialization ---
35app = FastAPI()
36
37# --- CORS Configuration ---
38# This allows cross-origin requests from any domain
39# In production, restrict `allow_origins` to specific domains
40app.add_middleware(
41    CORSMiddleware,
42    allow_origins=["*"],  # Allow all origins (for development/testing)
43    allow_credentials=True,
44    allow_methods=["*"],
45    allow_headers=["*"],
46)
47
48# --- Request Schema ---
49# Defines the expected JSON request body
50class ProcessRequest(BaseModel):
51    text: str   # User's input text
52    tool: str   # Name of the tool whose prompt template will be used
53
54# --- API Endpoint to Process Text ---
55@app.post("/process")
56async def process_text(request: ProcessRequest):
57    # Load API key from environment variable
58    api_key = os.getenv("RELAXAI_API_KEY")
59    if not api_key:
60        logger.error("RELAXAI_API_KEY environment variable not set.")
61        raise HTTPException(status_code=500, detail="Backend configuration error: API Key not found.")
62
63    # --- Step 1: Load Prompt Template from MySQL ---
64    template = None
65    conn = None
66    try:
67        conn = get_db_connection()
68        cursor = conn.cursor(dictionary=True)  # Results returned as dictionaries
69
70        # SQL query to fetch the prompt template for the selected tool
71        query = "SELECT template FROM prompts WHERE name = %s"
72        cursor.execute(query, (request.tool,))
73        result = cursor.fetchone()
74
75        if not result:
76            # If no matching tool is found in the DB
77            logger.error(f"Prompt for tool '{request.tool}' not found in MySQL.")
78            raise HTTPException(status_code=404, detail=f"Prompt template '{request.tool}' not found.")
79
80        # Extract template string
81        template = result.get("template")
82        if not template:
83            logger.error(f"Template field is missing or empty for tool '{request.tool}'.")
84            raise HTTPException(status_code=500, detail=f"Prompt template for '{request.tool}' is empty or invalid.")
85
86    except mysql.connector.Error as err:
87        logger.exception(f"Error retrieving prompt from MySQL: {err}")
88        raise HTTPException(status_code=500, detail=f"Failed to retrieve prompt from database: {str(err)}")
89    finally:
90        # Close DB connection and cursor
91        if conn and conn.is_connected():
92            cursor.close()
93            conn.close()
94
95    # --- Step 2: Inject user input into template ---
96    try:
97        # Replace `{text}` in template with user's input
98        prompt = template.format(text=request.text)
99    except KeyError as e:
100        # Handle formatting errors (e.g., missing `text` placeholder)
101        logger.error(f"Prompt template formatting error: Expected: 'text', Got template: '{template}'")
102        raise HTTPException(status_code=500, detail="Internal server error: Prompt template mismatch.")
103
104    # --- Step 3: Call RelaxAI API with Constructed Prompt ---
105    headers = {
106        "Authorization": f"Bearer {api_key}",  # Bearer token authentication
107        "Content-Type": "application/json"
108    }
109    payload = {
110        "model": "Llama-4-Maverick-17B-128E",  # AI model to use
111        "messages": [{"role": "user", "content": prompt}],  # Message format
112        "max_tokens": 500  # Limit the response length
113    }
114
115    try:
116        # Make POST request to the RelaxAI API
117        response = requests.post(
118            "https://api.relax.ai/v1/chat/completions",
119            headers=headers,
120            json=payload,
121            timeout=30  # 30-second timeout
122        )
123        response.raise_for_status()  # Raise exception for non-200 responses
124        data = response.json()
125
126        # Extract the AI-generated content
127        ai_output = data.get("choices", [])[0].get("message", {}).get("content", "")
128        if not ai_output:
129            logger.warning(f"RelaxAI API returned no content for '{request.tool}'. Full response: {data}")
130            raise HTTPException(status_code=500, detail="RelaxAI API returned empty response content.")
131
132        return {"result": ai_output}  # Send AI output back to client
133
134    # --- Error Handling ---
135    except requests.exceptions.HTTPError as http_err:
136        logger.error(f"HTTP error from relax.ai API (Status: {response.status_code}): {http_err}. Body: {response.text}")
137        raise HTTPException(status_code=500, detail=f"Error from relaxAI API: {response.status_code} - {response.text}")
138
139    except requests.exceptions.ConnectionError as conn_err:
140        logger.error(f"Connection error to relax.ai API: {conn_err}")
141        raise HTTPException(status_code=500, detail=f"Network error connecting to relaxAI API: {str(conn_err)}")
142
143    except requests.exceptions.Timeout as timeout_err:
144        logger.error(f"Timeout error from relax.ai API: {timeout_err}")
145        raise HTTPException(status_code=504, detail=f"RelaxAI API did not respond in time: {str(timeout_err)}")
146
147    except IndexError:
148        logger.error(f"Unexpected response structure from relax.ai API for '{request.tool}'. Full response: {data}")
149        raise HTTPException(status_code=500, detail="Unexpected response structure from relaxAI API.")
150
151    except Exception as e:
152        logger.exception("Unexpected error during relaxAI API call processing:")
153        raise HTTPException(status_code=500, detail=f"Unexpected error: {str(e)}")

1fastapi
2uvicorn
3mysql-connector-python
4requests
5pydantic

1FROM python:3.11-slim
2
3WORKDIR /app
4COPY requirements.txt .
5RUN pip install --no-cache-dir -r requirements.txt
6
7# Copy the Python code
8COPY . .
9
10EXPOSE 8000
11CMD ["uvicorn", "app:app", "--host", "0.0.0.0", "--port", "8000"]

1npm create vite@latest relaxai-app --template react
2cd relaxai-app
3npm install axios

1// ---------- 1. State & Setup ----------
2import React, { useState } from 'react';
3import axios from 'axios';
4
5function App() {
6  const [inputText, setInputText] = useState('');
7  const [tool, setTool] = useState('summarizer');
8  const [result, setResult] = useState('');
9  const [loading, setLoading] = useState(false);
10  const [error, setError] = useState('');

1return (
2  <div style={{
3    padding: '20px',
4    maxWidth: '800px',
5    margin: 'auto',
6    fontFamily: 'Inter, Arial, sans-serif',
7    backgroundColor: '#1a1a1a',
8    color: '#ffffff',
9    minHeight: '100vh',
10    borderRadius: '8px',
11    boxShadow: '0 4px 8px rgba(0, 0, 0, 0.2)'
12  }}>
13
14    <h1 style={{ color: '#61dafb', textAlign: 'center', marginBottom: '30px' }}>
15      AI Writing Assistant
16    </h1>
17
18    {/* ---------- 2. Form & User Input ---------- */}
19    <form onSubmit={handleSubmit} style={{
20      display: 'flex',
21      flexDirection: 'column',
22      gap: '20px',
23      backgroundColor: '#282c34',
24      padding: '25px',
25      borderRadius: '8px',
26      boxShadow: '0 2px 4px rgba(0, 0, 0, 0.2)'
27    }}>
28      <div>
29        <label htmlFor="inputText" style={{ display: 'block', marginBottom: '8px' }}>
30          Enter your text:
31        </label>
32        <textarea
33          id="inputText"
34          rows="8"
35          value={inputText}
36          placeholder="Enter some text here..."
37          onChange={e => setInputText(e.target.value)}
38          style={{
39            width: '100%',
40            padding: '10px',
41            border: '1px solid #444',
42            borderRadius: '6px',
43            backgroundColor: '#3a3a3a',
44            color: '#ffffff',
45            resize: 'vertical'
46          }}
47        ></textarea>
48      </div>
49
50      <div>
51        <label htmlFor="toolSelect" style={{ display: 'block', marginBottom: '8px' }}>
52          Select Tool:
53        </label>
54        <select
55          id="toolSelect"
56          value={tool}
57          onChange={e => setTool(e.target.value)}
58          style={{
59            padding: '10px',
60            border: '1px solid #444',
61            borderRadius: '6px',
62            backgroundColor: '#3a3a3a',
63            color: '#ffffff',
64            cursor: 'pointer'
65          }}
66        >
67          <option value="summarizer">Summarizer</option>
68          <option value="rewriter">Rewriter (Polite Tone)</option>
69        </select>
70      </div>
71
72      <button
73        type="submit"
74        disabled={loading || !inputText.trim()}
75        style={{
76          padding: '12px 20px',
77          backgroundColor: '#61dafb',
78          color: '#1a1a1a',
79          border: 'none',
80          borderRadius: '6px',
81          cursor: loading || !inputText.trim() ? 'not-allowed' : 'pointer',
82          opacity: loading || !inputText.trim() ? 0.8 : 1,
83          fontWeight: 'bold',
84          transition: 'background-color 0.2s, opacity 0.2s',
85          boxShadow: '0 2px 4px rgba(0, 0, 0, 0.3)'
86        }}
87      >
88        {loading ? 'Processing...' : 'Process Text'}
89      </button>
90    </form>
91  </div>
92);

1// ---------- 3. API Call Logic ----------
2const handleSubmit = async (e) => {
3  e.preventDefault();
4  setLoading(true);
5  setResult('');
6  setError('');
7  try {
8    const backendUrl = import.meta.env.VITE_APP_BACKEND_URL || '';
9    const res = await axios.post(`${backendUrl}/process`, {
10      text: inputText,
11      tool
12    });
13    setResult(res.data.result);
14  } catch (err) {
15    console.error('Error calling backend:', err);
16    if (err.response?.data?.detail) {
17      setError(`Error: ${err.response.data.detail}`);
18    } else if (err.message) {
19      setError(`Network Error: ${err.message}`);
20    } else {
21      setError('Error processing request. Please try again.');
22    }
23  } finally {
24    setLoading(false);
25  }
26};

1{/* ---------- 4. Output Display ---------- */}
2      {error && (
3        <p style={{ color: '#ff6b6b', marginTop: '20px', textAlign: 'center' }}>
4          {error}
5        </p>
6      )}
7
8
9      <div style={{ marginTop: '40px', borderTop: '1px solid #444', paddingTop: '30px' }}>
10        <h2 style={{ color: '#61dafb', marginBottom: '15px' }}>Result:</h2>
11        {loading && <p style={{ color: '#aaa' }}>Waiting for AI response...</p>}
12        {result ? (
13          <pre style={{
14            whiteSpace: 'pre-wrap',
15            wordBreak: 'break-word',
16            backgroundColor: '#000000',
17            color: '#ffffff',
18            padding: '20px',
19            borderRadius: '8px',
20            border: '1px solid #555',
21            boxShadow: 'inset 0 1px 3px rgba(0, 0, 0, 0.4)'
22          }}>
23            {result}
24          </pre>
25        ) : (
26          !loading && !error && <p style={{ color: '#aaa' }}>No result yet. Enter text and select a tool.</p>
27        )}
28      </div>
29    </div>
30  );
31}
32
33
34export default App;

1VITE_APP_BACKEND_URL=http://<your-backend-loadbalancer-url>

1FROM node:18-alpine AS build
2WORKDIR /app
3COPY package.json package-lock.json ./
4RUN npm ci
5COPY . .
6RUN npm run build
7
8
9# Use a lightweight web server to serve the built files
10FROM node:18-alpine
11WORKDIR /app
12RUN npm install -g serve
13COPY --from=build /app/dist ./dist
14CMD ["serve", "-s", "dist", "-l", "80"]

1# Replace 'yourhub' with your Docker Hub username or registry
2docker build -t yourhub/relaxai-backend:latest .
3docker push yourhub/relaxai-backend:latest
4
5docker build -t yourhub/relaxai-frontend:latest .
6docker push yourhub/relaxai-frontend:latest

1kubectl create secret generic mysql-creds \
2  --from-literal=host=YOUR_MYSQL_HOST \
3  --from-literal=username=YOUR_MYSQL_USERNAME \
4  --from-literal=password=YOUR_MYSQL_PASSWORD \
5  --from-literal=database=ai_tools

1kubectl create secret generic relaxai-secrets \
2  --from-literal=relaxai-api-key=YOUR_RELAXAI_API_KEY

1apiVersion: apps/v1
2kind: Deployment
3metadata:
4  name: relaxai-backend
5spec:
6  replicas: 1
7  selector:
8    matchLabels: { app: relaxai-backend }
9  template:
10    metadata:
11      labels: { app: relaxai-backend }
12    spec:
13      containers:
14        - name: relaxai-backend
15          image: yourhub/relaxai-backend:latest
16          ports:
17            - containerPort: 8000
18          env:
19            - name: RELAXAI_API_KEY
20              valueFrom:
21                secretKeyRef:
22                  name: relaxai-secrets
23                  key: relaxai-api-key
24# --- New MySQL Environment Variables ---
25            - name: MYSQL_HOST
26              valueFrom:
27                secretKeyRef:
28                  name: mysql-creds
29                  key: host
30            - name: MYSQL_USER
31              valueFrom:
32                secretKeyRef:
33                  name: mysql-creds
34                  key: username
35            - name: MYSQL_PASSWORD
36              valueFrom:
37                secretKeyRef:
38                  name: mysql-creds
39                  key: password
40            - name: MYSQL_DATABASE
41              valueFrom:
42                secretKeyRef:
43                  name: mysql-creds
44                  key: database

1apiVersion: v1
2kind: Service
3metadata:
4  name: relaxai-backend
5spec:
6  selector:
7    app: relaxai-backend
8  ports:
9    - port:	 80
10      targetPort: 8000
11  type: LoadBalancer

1apiVersion: apps/v1
2kind: Deployment
3metadata:
4  name: relaxai-frontend
5spec:
6  replicas: 1
7  selector:
8    matchLabels: { app: relaxai-frontend }
9  template:
10    metadata:
11      labels: { app: relaxai-frontend }
12    spec:
13      containers:
14        - name: relaxai-frontend
15          image: yourhub/relaxai-frontend:latest
16          ports:
17            - containerPort: 80

1apiVersion: v1
2kind: Service
3metadata:
4  name: relaxai-frontend
5spec:
6  type: LoadBalancer
7  selector:
8    app: relaxai-frontend
9  ports:
10    - port: 80
11      targetPort: 80