| <!DOCTYPE html> |
| <html lang="en"> |
| <head> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <title>Backend Structure | GeminiGuard</title> |
| <script src="https://cdn.tailwindcss.com"></script> |
| <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script> |
| <style> |
| .tree-node { |
| position: relative; |
| padding-left: 1.5rem; |
| } |
| .tree-node::before { |
| content: ""; |
| position: absolute; |
| left: 0.5rem; |
| top: 0; |
| bottom: 0; |
| width: 2px; |
| background-color: #E5E7EB; |
| } |
| .tree-item::before { |
| content: ""; |
| position: absolute; |
| left: 0.25rem; |
| top: 0.75rem; |
| width: 0.5rem; |
| height: 0.5rem; |
| border-radius: 50%; |
| background-color: #3B82F6; |
| } |
| .animate-float { |
| animation: float 3s ease-in-out infinite; |
| } |
| @keyframes float { |
| 0%, 100% { transform: translateY(0); } |
| 50% { transform: translateY(-10px); } |
| } |
| </style> |
| </head> |
| <body class="bg-gray-50"> |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12"> |
| <div class="text-center mb-12"> |
| <h1 class="text-4xl font-bold text-gray-900 mb-4">GeminiGuard Backend Architecture</h1> |
| <p class="text-xl text-gray-600 max-w-3xl mx-auto">Production-ready Python 3.11 + FastAPI structure with Redis, PostgreSQL and FAISS integration</p> |
| </div> |
|
|
| <div class="grid grid-cols-1 lg:grid-cols-3 gap-8 mb-12"> |
| |
| <div class="bg-white rounded-xl shadow-md overflow-hidden lg:col-span-1"> |
| <div class="p-6 border-b border-gray-200"> |
| <h2 class="text-xl font-semibold text-gray-800">Directory Structure</h2> |
| </div> |
| <div class="p-6"> |
| <div class="space-y-1 font-mono text-sm"> |
| <div class="tree-node"> |
| <div class="tree-item relative pl-4 py-1 text-blue-600 font-bold">backend/</div> |
| <div class="tree-node"> |
| <div class="tree-item relative pl-4 py-1">main.py</div> |
| <div class="tree-item relative pl-4 py-1">routes/</div> |
| <div class="tree-node"> |
| <div class="tree-item relative pl-4 py-1">chat.py</div> |
| <div class="tree-item relative pl-4 py-1">faq.py</div> |
| <div class="tree-item relative pl-4 py-1">escalate.py</div> |
| </div> |
| <div class="tree-item relative pl-4 py-1">services/</div> |
| <div class="tree-node"> |
| <div class="tree-item relative pl-4 py-1">gemini_service.py</div> |
| <div class="tree-item relative pl-4 py-1">faiss_service.py</div> |
| <div class="tree-item relative pl-4 py-1">redis_service.py</div> |
| </div> |
| <div class="tree-item relative pl-4 py-1">models/</div> |
| <div class="tree-node"> |
| <div class="tree-item relative pl-4 py-1">chat_models.py</div> |
| <div class="tree-item relative pl-4 py-1">escalation_models.py</div> |
| </div> |
| <div class="tree-item relative pl-4 py-1">database/</div> |
| <div class="tree-node"> |
| <div class="tree-item relative pl-4 py-1">postgres.py</div> |
| <div class="tree-item relative pl-4 py-1">redis.py</div> |
| </div> |
| <div class="tree-item relative pl-4 py-1">requirements.txt</div> |
| <div class="tree-item relative pl-4 py-1">Dockerfile</div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
|
|
| |
| <div class="lg:col-span-2"> |
| <div class="bg-white rounded-xl shadow-md overflow-hidden mb-6"> |
| <div class="p-6 border-b border-gray-200"> |
| <h2 class="text-xl font-semibold text-gray-800">Core Components</h2> |
| </div> |
| <div class="p-6"> |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-6"> |
| |
| <div class="bg-blue-50 rounded-lg p-4"> |
| <div class="flex items-center mb-3"> |
| <div class="bg-blue-100 p-2 rounded-full mr-3"> |
| <i data-feather="cpu" class="text-blue-600"></i> |
| </div> |
| <h3 class="font-semibold text-gray-800">Gemini Service</h3> |
| </div> |
| <p class="text-sm text-gray-600 mb-2">Handles all Gemini API interactions:</p> |
| <ul class="text-xs text-gray-700 space-y-1"> |
| <li class="flex items-start"> |
| <i data-feather="check" class="w-4 h-4 mr-2 text-green-500 mt-0.5"></i> |
| <span>Streaming chat completions</span> |
| </li> |
| <li class="flex items-start"> |
| <i data-feather="check" class="w-4 h-4 mr-2 text-green-500 mt-0.5"></i> |
| <span>Embedding generation</span> |
| </li> |
| <li class="flex items-start"> |
| <i data-feather="check" class="w-4 h-4 mr-2 text-green-500 mt-0.5"></i> |
| <span>Token counting and rate limiting</span> |
| </li> |
| </ul> |
| </div> |
|
|
| |
| <div class="bg-green-50 rounded-lg p-4"> |
| <div class="flex items-center mb-3"> |
| <div class="bg-green-100 p-2 rounded-full mr-3"> |
| <i data-feather="database" class="text-green-600"></i> |
| </div> |
| <h3 class="font-semibold text-gray-800">FAISS Service</h3> |
| </div> |
| <p class="text-sm text-gray-600 mb-2">Manages vector operations:</p> |
| <ul class="text-xs text-gray-700 space-y-1"> |
| <li class="flex items-start"> |
| <i data-feather="check" class="w-4 h-4 mr-2 text-green-500 mt-0.5"></i> |
| <span>Index creation from FAQs</span> |
| </li> |
| <li class="flex items-start"> |
| <i data-feather="check" class="w-4 h-4 mr-2 text-green-500 mt-0.5"></i> |
| <span>Nearest neighbor search</span> |
| </li> |
| <li class="flex items-start"> |
| <i data-feather="check" class="w-4 h-4 mr-2 text-green-500 mt-0.5"></i> |
| <span>Index persistence to disk</span> |
| </li> |
| </ul> |
| </div> |
|
|
| |
| <div class="bg-red-50 rounded-lg p-4"> |
| <div class="flex items-center mb-3"> |
| <div class="bg-red-100 p-2 rounded-full mr-3"> |
| <i data-feather="hard-drive" class="text-red-600"></i> |
| </div> |
| <h3 class="font-semibold text-gray-800">Redis Service</h3> |
| </div> |
| <p class="text-sm text-gray-600 mb-2">Session state management:</p> |
| <ul class="text-xs text-gray-700 space-y-1"> |
| <li class="flex items-start"> |
| <i data-feather="check" class="w-4 h-4 mr-2 text-green-500 mt-0.5"></i> |
| <span>WebSocket session storage</span> |
| </li> |
| <li class="flex items-start"> |
| <i data-feather="check" class="w-4 h-4 mr-2 text-green-500 mt-0.5"></i> |
| <span>Rate limiting counters</span> |
| </li> |
| <li class="flex items-start"> |
| <i data-feather="check" class="w-4 h-4 mr-2 text-green-500 mt-0.5"></i> |
| <span>Cache for frequent queries</span> |
| </li> |
| </ul> |
| </div> |
|
|
| |
| <div class="bg-purple-50 rounded-lg p-4"> |
| <div class="flex items-center mb-3"> |
| <div class="bg-purple-100 p-2 rounded-full mr-3"> |
| <i data-feather="archive" class="text-purple-600"></i> |
| </div> |
| <h3 class="font-semibold text-gray-800">PostgreSQL Service</h3> |
| </div> |
| <p class="text-sm text-gray-600 mb-2">Ticket persistence:</p> |
| <ul class="text-xs text-gray-700 space-y-1"> |
| <li class="flex items-start"> |
| <i data-feather="check" class="w-4 h-4 mr-2 text-green-500 mt-0.5"></i> |
| <span>Escalation ticket storage</span> |
| </li> |
| <li class="flex items-start"> |
| <i data-feather="check" class="w-4 h-4 mr-2 text-green-500 mt-0.5"></i> |
| <span>Status tracking</span> |
| </li> |
| <li class="flex items-start"> |
| <i data-feather="check" class="w-4 h-4 mr-2 text-green-500 mt-0.5"></i> |
| <span>Audit logging</span> |
| </li> |
| </ul> |
| </div> |
| </div> |
| </div> |
| </div> |
|
|
| |
| <div class="bg-white rounded-xl shadow-md overflow-hidden"> |
| <div class="p-6 border-b border-gray-200"> |
| <h2 class="text-xl font-semibold text-gray-800">Code Highlights</h2> |
| </div> |
| <div class="p-6"> |
| <div class="mb-6"> |
| <h3 class="font-medium text-gray-800 mb-2">WebSocket Chat Endpoint (routes/chat.py)</h3> |
| <div class="bg-gray-900 rounded-lg p-4 text-xs text-gray-300 overflow-x-auto"> |
| <pre><code>@router.websocket("/chat/stream") |
| async def websocket_chat(websocket: WebSocket): |
| await websocket.accept() |
| session_id = str(uuid.uuid4()) |
| |
| try: |
| while True: |
| data = await websocket.receive_json() |
| |
| if data["type"] == "user_message": |
| # Generate stream from Gemini with RAG context |
| async for chunk in gemini_service.stream_response( |
| message=data["content"], |
| session_id=session_id |
| ): |
| await websocket.send_json({ |
| "type": "assistant_chunk", |
| "chunk": chunk |
| }) |
| |
| await websocket.send_json({ |
| "type": "assistant_done", |
| "content": "Stream complete" |
| }) |
| except WebSocketDisconnect: |
| await redis_service.clear_session(session_id)</code></pre> |
| </div> |
| </div> |
|
|
| <div> |
| <h3 class="font-medium text-gray-800 mb-2">FAISS Index Creation (services/faiss_service.py)</h3> |
| <div class="bg-gray-900 rounded-lg p-4 text-xs text-gray-300 overflow-x-auto"> |
| <pre><code>async def create_index_from_documents(docs: List[str]): |
| # Generate embeddings using Gemini |
| embeddings = await gemini_service.generate_embeddings(docs) |
| |
| # Convert to numpy array |
| vectors = np.array(embeddings).astype('float32') |
| |
| # Create FAISS index |
| dimension = vectors.shape[1] |
| index = faiss.IndexFlatL2(dimension) |
| index.add(vectors) |
| |
| # Save index to disk |
| faiss.write_index(index, "faiss_index.index") |
| |
| # Store document metadata in Redis |
| await redis_service.store_documents( |
| [{"id": str(uuid.uuid4()), "text": doc} for doc in docs] |
| )</code></pre> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
|
|
| <div class="bg-blue-50 rounded-xl p-6 text-center"> |
| <h3 class="text-2xl font-bold text-gray-800 mb-4">Ready to Implement?</h3> |
| <p class="text-gray-600 mb-6">This architecture is optimized for high-performance AI support with minimal latency.</p> |
| <button class="inline-flex items-center px-6 py-3 bg-blue-600 text-white rounded-lg font-semibold hover:bg-blue-700 transition"> |
| <i data-feather="download" class="w-5 h-5 mr-2"></i> |
| Download Complete Backend |
| </button> |
| </div> |
| </div> |
|
|
| <script> |
| feather.replace(); |
| </script> |
| </body> |
| </html> |
|
|
