|
|
<!DOCTYPE html> |
|
|
<html lang="en" class="bg0 text-fg0 dark"> |
|
|
<head> |
|
|
<meta charset="UTF-8" /> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> |
|
|
<title>Documentation - MoA Chat</title> |
|
|
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/tailwind.min.css" rel="stylesheet"> |
|
|
<link rel="stylesheet" href="/static/style.css" /> |
|
|
</head> |
|
|
<body class="bg0 text-fg0 transition-colors duration-300 flex flex-col min-h-screen"> |
|
|
|
|
|
|
|
|
<header class="flex items-center justify-between p-4 bg1 shadow-md sticky top-0 z-50"> |
|
|
<h1 class="text-2xl font-bold">Documentation</h1> |
|
|
<div class="space-x-2 flex items-center"> |
|
|
<a href="/" id="chatButton" class="px-3 py-1 rounded bg-blue hover:bg-purple text-fg0 transition">← Chat</a> |
|
|
<button id="langToggle" class="px-3 py-1 rounded bg-blue hover:bg-purple text-fg0 transition">🌐</button> |
|
|
<button id="themeToggle" class="px-3 py-1 rounded bg-blue hover:bg-purple text-fg0 transition">🌙</button> |
|
|
</div> |
|
|
</header> |
|
|
|
|
|
|
|
|
<main class="flex-1 overflow-y-auto p-6 space-y-8 flex flex-col items-center"> |
|
|
|
|
|
<div class="w-full max-w-3xl space-y-8"> |
|
|
|
|
|
|
|
|
<section id="en" class="space-y-8"> |
|
|
|
|
|
<div class="space-y-4"> |
|
|
<h2 class="text-xl font-semibold">What is MoA Chat?</h2> |
|
|
<p> |
|
|
MoA Chat is a minimalistic, self-hostable AI chat platform based on the Mixture of Agents (MoA) architecture. |
|
|
It queries multiple AI models (LLMs) simultaneously and combines their answers into a final response. |
|
|
</p> |
|
|
</div> |
|
|
|
|
|
<div class="space-y-4"> |
|
|
<h2 class="text-xl font-semibold">How It Works</h2> |
|
|
<img src="https://github.com/togethercomputer/MoA/raw/main/assets/moa-explained.png" alt="MoA Architecture" class="rounded shadow-lg mx-auto max-w-md"> |
|
|
<p> |
|
|
Three models (LLM-A, LLM-B, LLM-C) answer the prompt individually. A fourth model (LLM-D) acts as an aggregator, |
|
|
synthesizing the responses into a single high-quality answer. |
|
|
</p> |
|
|
</div> |
|
|
|
|
|
<div class="space-y-4"> |
|
|
<h2 class="text-xl font-semibold">Features</h2> |
|
|
<ul class="list-disc list-inside space-y-2"> |
|
|
<li>🔹 Modern, responsive, and fast web UI</li> |
|
|
<li>🔹 Gruvbox Material theming with auto light/dark mode</li> |
|
|
<li>🔹 Parallel API querying for faster responses</li> |
|
|
<li>🔹 Dynamic model loading — no hardcoding needed</li> |
|
|
<li>🔹 100% free and self-hostable</li> |
|
|
</ul> |
|
|
</div> |
|
|
|
|
|
<div class="space-y-4"> |
|
|
<h2 class="text-xl font-semibold">How to Self-Host</h2> |
|
|
|
|
|
<p>Clone the repository:</p> |
|
|
<pre class="bg-statusline1 p-4 rounded overflow-x-auto"><code>git clone https://github.com/your-repo/moa-chat.git |
|
|
cd moa-chat</code></pre> |
|
|
|
|
|
<p>Deploy to Hugging Face Spaces or locally via Docker:</p> |
|
|
<pre class="bg-statusline1 p-4 rounded overflow-x-auto"><code>docker build -t moa-chat . |
|
|
docker run -p 7860:7860 moa-chat</code></pre> |
|
|
|
|
|
<p>Create your API keys and add them to Hugging Face Secrets:</p> |
|
|
<pre class="bg-statusline1 p-4 rounded overflow-x-auto"><code>OPENROUTER_API_KEY=your-openrouter-key |
|
|
GROK_API_KEY=your-grok-key |
|
|
TOGETHER_API_KEY=your-together-key |
|
|
GROQ_API_KEY=your-groq-key</code></pre> |
|
|
|
|
|
<p>To add more models, edit <code>llm/model_config.json</code>:</p> |
|
|
<pre class="bg-statusline1 p-4 rounded overflow-x-auto"><code>{ |
|
|
"providers": { |
|
|
"openrouter": { |
|
|
"url": "https://openrouter.ai/api/v1/chat/completions", |
|
|
"key_env": "OPENROUTER_API_KEY" |
|
|
} |
|
|
}, |
|
|
"models": { |
|
|
"deepseek/deepseek-chat-v3-0324:free": "openrouter" |
|
|
} |
|
|
}</code></pre> |
|
|
<p>No backend code modification needed after updating the config.</p> |
|
|
|
|
|
</div> |
|
|
|
|
|
<div class="space-y-4"> |
|
|
<h2 class="text-xl font-semibold">License</h2> |
|
|
<p>Licensed under <strong>Apache 2.0</strong>.</p> |
|
|
</div> |
|
|
|
|
|
<div class="space-y-4"> |
|
|
<h2 class="text-xl font-semibold">Credits</h2> |
|
|
<p>Inspired by <a href="https://github.com/togethercomputer/MoA" target="_blank" class="text-blue hover:text-purple underline">Together MoA</a>. Built with ❤️ in Panamá.</p> |
|
|
</div> |
|
|
|
|
|
</section> |
|
|
|
|
|
|
|
|
<section id="es" class="space-y-8 hidden"> |
|
|
|
|
|
<div class="space-y-4"> |
|
|
<h2 class="text-xl font-semibold">¿Qué es MoA Chat?</h2> |
|
|
<p> |
|
|
MoA Chat es una plataforma minimalista de chat de IA, basada en la arquitectura Mixture of Agents (MoA). |
|
|
Permite consultar múltiples modelos de lenguaje (LLMs) simultáneamente y combinar sus respuestas. |
|
|
</p> |
|
|
</div> |
|
|
|
|
|
<div class="space-y-4"> |
|
|
<h2 class="text-xl font-semibold">¿Cómo Funciona?</h2> |
|
|
<img src="https://github.com/togethercomputer/MoA/raw/main/assets/moa-explained.png" alt="Arquitectura MoA" class="rounded shadow-lg mx-auto max-w-md"> |
|
|
<p> |
|
|
Tres modelos (LLM-A, LLM-B, LLM-C) responden. El modelo LLM-D agrega y sintetiza las respuestas en una final coherente. |
|
|
</p> |
|
|
</div> |
|
|
|
|
|
<div class="space-y-4"> |
|
|
<h2 class="text-xl font-semibold">Características</h2> |
|
|
<ul class="list-disc list-inside space-y-2"> |
|
|
<li>🔹 UI moderna y rápida</li> |
|
|
<li>🔹 Tematización Gruvbox con modo claro/oscuro automático</li> |
|
|
<li>🔹 Consultas paralelas para mayor rapidez</li> |
|
|
<li>🔹 Soporte dinámico de modelos</li> |
|
|
<li>🔹 100% autohospedable</li> |
|
|
</ul> |
|
|
</div> |
|
|
|
|
|
<div class="space-y-4"> |
|
|
<h2 class="text-xl font-semibold">Cómo Autohospedarlo</h2> |
|
|
|
|
|
<p>Clona el repositorio:</p> |
|
|
<pre class="bg-statusline1 p-4 rounded overflow-x-auto"><code>git clone https://github.com/your-repo/moa-chat.git |
|
|
cd moa-chat</code></pre> |
|
|
|
|
|
<p>Despliega en Hugging Face o corre localmente con Docker:</p> |
|
|
<pre class="bg-statusline1 p-4 rounded overflow-x-auto"><code>docker build -t moa-chat . |
|
|
docker run -p 7860:7860 moa-chat</code></pre> |
|
|
|
|
|
<p>Agrega tus llaves API en Hugging Face Secrets:</p> |
|
|
<pre class="bg-statusline1 p-4 rounded overflow-x-auto"><code>OPENROUTER_API_KEY=tu-clave |
|
|
GROK_API_KEY=tu-clave |
|
|
TOGETHER_API_KEY=tu-clave |
|
|
GROQ_API_KEY=tu-clave</code></pre> |
|
|
|
|
|
<p>Edita <code>llm/model_config.json</code> para añadir modelos nuevos.</p> |
|
|
|
|
|
</div> |
|
|
|
|
|
<div class="space-y-4"> |
|
|
<h2 class="text-xl font-semibold">Licencia</h2> |
|
|
<p>Licenciado bajo <strong>Apache 2.0</strong>.</p> |
|
|
</div> |
|
|
|
|
|
<div class="space-y-4"> |
|
|
<h2 class="text-xl font-semibold">Créditos</h2> |
|
|
<p>Inspirado por <a href="https://github.com/togethercomputer/MoA" target="_blank" class="text-blue hover:text-purple underline">Together MoA</a>. Construido con ❤️ en Panamá.</p> |
|
|
</div> |
|
|
|
|
|
</section> |
|
|
|
|
|
</div> |
|
|
|
|
|
</main> |
|
|
|
|
|
<script src="/static/docs.js"></script> |
|
|
|
|
|
</body> |
|
|
</html> |
|
|
|
