Athex.Doc

💡 Inspiration

In today's information-heavy world, we spend countless hours sifting through dense documents—research papers, technical manuals, and legal contracts—trying to find specific information or understand complex concepts. We wanted to build a tool that acts as a highly intelligent, specialized analyst. A tool that doesn't just "search" a document, but actually understands its context and can converse about it intelligently. The inspiration for Athex.Doc was to create a premium, deterministic AI assistant that makes interacting with documents as easy as asking a colleague.

🛠️ How we built it

Athex.Doc is built on a modern, high-performance web stack:

• Frontend: We used Next.js 16 with the App Router and React to build a lightning-fast, server-rendered application. The UI is crafted with Tailwind CSS, focusing on a premium, glassmorphic design and micro-interactions to create a deeply engaging user experience.
• Backend & Database: We leverage Next.js API routes for secure backend processing, connected to a MongoDB database via the Prisma ORM for robust user and session data management.
• AI Engine: The core intelligence is powered by the Google Gemini API, utilizing advanced prompt engineering and streaming responses to provide real-time, deterministic analysis of uploaded documents.
• State & Utilities: We implemented Zustand for lightweight client-side state management and idb-keyval for fast local storage caching.
• Deployment: The entire platform is seamlessly deployed and hosted on Vercel utilizing Edge functions for low-latency AI responses.

🚧 Challenges we ran into

• Next.js Middleware & Edge Runtime: We encountered significant deployment challenges when protecting our routes using Next.js middleware on Vercel's Edge network, particularly with JWT verification dependencies (jose). We had to architect a robust server-side layout authentication pattern to ensure secure access without breaking edge compatibility.
• Streaming AI Responses: Ensuring a smooth, typewriter-like streaming experience from the Gemini API into a dynamic markdown renderer (handling complex formatting like tables and code blocks) required careful state management and UI optimization.
• Complex UI/UX Constraints: Building a chat interface that feels both highly technical ("deterministic analyst") and visually beautiful required many iterations on typography (intermingling Inter, Cormorant Garamond, and JetBrains Mono) and custom SVG iconography.

🎓 What we learned

• Deepened our understanding of Next.js Server Components vs. Client Components, and how to effectively manage authentication state across them.
• Mastered the intricacies of deploying full-stack AI applications on Vercel, including navigating build caching and Webpack/Turbopack dependency resolutions (specifically with Prisma and ESM modules).
• Learned how to effectively integrate and stream data from the Google Gemini API, optimizing system prompts for highly specific, document-grounded answers.

🚀 What's next for Athex.Doc

We plan to introduce multi-document chat (analyzing several documents simultaneously to find cross-references), add support for more complex file types (like OCR for scanned PDFs), and build a collaborative workspace feature so teams can analyze documents together in

Built With

• google-gemini-api
• mongodb
• next.js
• prisma
• react
• tailwind-css
• typescript
• vercel