Groq RAG Chatbot

Certainly! We can set up a basic AI chatbot with simulated RAG capabilities using the GroqCloud API. This example will include: 1. A simple HTML interface. 2. Frontend JavaScript to handle user input and display messages. 3. A Node.js backend to: * Serve the static files. * Implement a very basic simulated RAG by selecting predefined text snippets based on keywords in the user's query. * Call the GroqCloud API securely using the provided API key. * Send the AI's response back to the frontend. { "name": "groq-rag-chatbot", "version": "1.0.0", "description": "A simple RAG chatbot using GroqCloud API", "main": "server.js", "scripts": { "start": "node server.js" }, "dependencies": { "node-fetch": "^3.3.2" } } import http from 'http'; import fs from 'fs'; import path from 'path'; import { fileURLToPath } from 'url'; import fetch from 'node-fetch'; const __filename = fileURLToPath(import.meta.url); const __dirname = path.dirname(__filename); const GROQ_API_KEY = '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'; // Replace with your actual key if different const GROQ_API_URL = 'https://api.groq.com/openai/v1/chat/completions'; const MODEL_NAME = 'llama3-8b-8192'; // Or another available Groq model // --- Simulated RAG Documents --- const documents = [ "Groq is a company that builds LPU™ inference engines.", "LPU stands for Language Processing Unit.", "LPUs are designed for high-speed inference for large language models.", "GroqCloud is a platform providing access to Groq's LPUs.", "RAG stands for Retrieval Augmented Generation.", "RAG systems combine retrieval of information with language model generation.", "This chatbot uses GroqCloud for generating responses.", "The API key is used to authenticate with the GroqCloud API.", "Groq was founded by Jonathan Ross.", "Groq's LPUs offer low latency and high throughput for AI inference." ]; function retrieveContext(query) { const keywords = query.toLowerCase().split(/\s+/).filter(word => word.length > 2); // Filter short words const relevantDocs = new Set(); documents.forEach(doc => { const docLower = doc.toLowerCase(); if (keywords.some(keyword => docLower.includes(keyword))) { relevantDocs.add(doc); } }); return Array.from(relevantDocs).join("\n"); } // --- End Simulated RAG Documents --- const server = http.createServer(async (req, res) => { if (req.method === 'GET') { let filePath = '.' + req.url; if (filePath === './') { filePath = './index.html'; } const extname = String(path.extname(filePath)).toLowerCase(); const mimeTypes = { '.html': 'text/html', '.js': 'text/javascript', '.css': 'text/css', '.json': 'application/json', '.png': 'image/png', '.jpg': 'image/jpg', '.gif': 'image/gif', '.svg': 'image/svg+xml', '.wav': 'audio/wav', '.mp4': 'video/mp4', '.woff': 'application/font-woff', '.ttf': 'application/font-ttf', '.eot': 'application/vnd.ms-fontobject', '.otf': 'application/font-otf', '.wasm': 'application/wasm' }; const contentType = mimeTypes[extname] || 'application/octet-stream'; fs.readFile(path.join(__dirname, filePath), (err, content) => { if (err) { if (err.code == 'ENOENT') { res.writeHead(404); res.end('File not found: ' + filePath); } else { res.writeHead(500); res.end('Server Error: ' + err.code); } } else { res.writeHead(200, { 'Content-Type': contentType }); res.end(content, 'utf-8'); } }); } else if (req.method === 'POST' && req.url === '/chat') { let body = ''; req.on('data', chunk => { body += chunk.toString(); }); req.on('end', async () => { try { const { message } = JSON.parse(body); // --- RAG Step --- const context = retrieveContext(message); // --- End RAG Step --- const messages = [ { role: "system", content: `You are a helpful AI assistant. Use the provided context to answer the user's question. If you don't know the answer based on the context, say so. Context: ${context}` }, { role: "user", content: message } ]; const groqResponse = await fetch(GROQ_API_URL, { method: 'POST', headers: { 'Content-Type': 'application/json', 'Authorization': `Bearer ${GROQ_API_KEY}` }, body: JSON.stringify({ model: MODEL_NAME, messages: messages, temperature: 0.7, max_tokens: 1024 }) }); if (!groqResponse.ok) { const errorBody = await groqResponse.text(); throw new Error(`Groq API error: ${groqResponse.status} ${groqResponse.statusText} - ${errorBody}`); } const data = await groqResponse.json(); const botMessage = data.choices[0]?.message?.content || "Sorry, I couldn't get a response from the AI."; res.writeHead(200, { 'Content-Type': 'application/json' }); res.end(JSON.stringify({ reply: botMessage })); } catch (error) { console.error('Error processing chat message:', error); res.writeHead(500, { 'Content-Type': 'application/json' }); res.end(JSON.stringify({ reply: 'An error occurred while processing your request.' })); } }); } else { res.writeHead(405); // Method Not Allowed res.end('Method Not Allowed'); } }); const PORT = process.env.PORT || 3000; server.listen(PORT, () => { console.log(`Server running on port ${PORT}`); }); Groq RAG Chatbot

Hello! Ask me about Groq or LPUs.

body { font-family: sans-serif; margin: 0; padding: 20px; background-color: #f4f4f4; display: flex; justify-content: center; align-items: center; min-height: 100vh; } .chat-container { width: 100%; max-width: 600px; background-color: #fff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); border-radius: 8px; overflow: hidden; display: flex; flex-direction: column; height: 80vh; } .chat-box { flex-grow: 1; padding: 15px; overflow-y: auto; display: flex; flex-direction: column; } .message { margin-bottom: 10px; padding: 8px 12px; border-radius: 5px; max-width: 80%; } .user-message { align-self: flex-end; background-color: #007bff; color: white; } .bot-message { align-self: flex-start; background-color: #e9e9eb; color: #333; } .chat-input { display: flex; padding: 15px; border-top: 1px solid #eee; } .chat-input input[type="text"] { flex-grow: 1; padding: 10px; border: 1px solid #ccc; border-radius: 4px; margin-right: 10px; font-size: 1rem; } .chat-input button { padding: 10px 20px; background-color: #28a745; color: white; border: none; border-radius: 4px; cursor: pointer; font-size: 1rem; } .chat-input button:hover { background-color: #218838; } const chatForm = document.getElementById('chatForm'); const userInput = document.getElementById('userInput'); const chatBox = document.getElementById('chatBox'); chatForm.addEventListener('submit', async (e) => { e.preventDefault(); const message = userInput.value.trim(); if (!message) return; appendMessage(message, 'user-message'); userInput.value = ''; try { const response = await fetch('/chat', { method: 'POST', headers: { 'Content-Type': 'application/json', }, body: JSON.stringify({ message: message }), }); if (!response.ok) { throw new Error(`HTTP error! status: ${response.status}`); } const data = await response.json(); appendMessage(data.reply, 'bot-message'); } catch (error) { console.error('Error sending message:', error); appendMessage('Sorry, something went wrong.', 'bot-message'); } }); function appendMessage(text, type) { const messageElement = document.createElement('div'); messageElement.classList.add('message', type); const p = document.createElement('p'); p.textContent = text; messageElement.appendChild(p); chatBox.appendChild(messageElement); chatBox.scrollTop = chatBox.scrollHeight; // Auto-scroll to bottom } This sets up a basic chat interface and a backend server that uses a simple keyword-based retrieval from a small set of predefined documents to augment the prompt sent to the Groq API. To run this, you would typically: 1. Save the files as specified. 2. Install dependencies (`npm install`). 3. Start the server (`npm start`). In the WebContainer environment, the `npm install` and `npm start` steps will be handled automatically.