# Node 18+ npx create-next-app ai-site cd ai-site "use client"; import { useState } from "react"; export default function Home() { const [messages, setMessages] = useState<{role:"user"|"assistant";content:string}[]>([]); const [input, setInput] = useState(""); async function send() { const userMsg = { role: "user" as const, content: input }; setMessages(prev => [...prev, userMsg]); setInput(""); const res = await fetch("/api/chat", { method: "POST", headers: {"Content-Type":"application/json"}, body: JSON.stringify({ messages: [...messages, userMsg] }) }); const reader = res.body!.getReader(); let assistantText = ""; for (;;) { const { value, done } = await reader.read(); if (done) break; assistantText += new TextDecoder().decode(value); // Optional: stream partial text to UI setMessages(prev => { const base = prev.filter(m => m.role !== "assistant"); return [...base, { role: "assistant", content: assistantText }]; }); } } return (

My AI Website

{messages.map((m, i) => (

{m.role === "user" ? "You" : "AI"}: {m.content}

))}

setInput(e.target.value)} placeholder="Ask something…" style={{flex:1, padding:12, border:"1px solid #ddd", borderRadius:8}} /> Send

); } import { NextRequest } from "next/server"; export const runtime = "edge"; // or 'nodejs' export async function POST(req: NextRequest) { const { messages } = await req.json(); const apiKey = process.env.OPENAI_API_KEY; // set in your hosting dashboard, never in the client if (!apiKey) return new Response("Missing OPENAI_API_KEY", { status: 500 }); const r = await fetch("https://api.openai.com/v1/chat/completions", { method: "POST", headers: { "Authorization": `Bearer ${apiKey}`, "Content-Type": "application/json" }, body: JSON.stringify({ model: "gpt-4o-mini", messages, stream: true, }) }); if (!r.ok || !r.body) { const text = await r.text().catch(()=> "Upstream error"); return new Response(text, { status: 502 }); } // Pipe the OpenAI stream straight through return new Response(r.body, { headers: { "Content-Type": "text/plain; charset=utf-8", "Cache-Control": "no-cache", } }); } npm run dev // 1) embed(query) -> vector // 2) db.similaritySearch(vector, k=5) -> docs // 3) build a system prompt: "Use ONLY the provided docs..."