Ash AI — The Story Behind ROBYY
Inspiration
I've always been fascinated by the rapid evolution of AI technology — the idea that a machine can understand human language, analyze complex documents, and respond intelligently in real time feels nothing short of magical. That fascination became the spark for Ash AI. I wanted to go beyond just using AI tools — I wanted to build one. One that was meaningful, practical, and accessible to students like me who are navigating an overwhelming amount of information every day. The question I asked myself was simple:
"What if every student had access to a brilliant, always-available AI companion?"
That question became ROBYY.
How I Built It
Ash AI was built using a modern, full-stack web technology approach:
React + Vite — for a fast, responsive, and component-driven frontend TypeScript — for type-safe, reliable code Google Gemini AI (gemini-2.0-flash) — as the core intelligence behind ROBYY Firebase Hosting — for seamless, scalable deployment Firebase Authentication — for secure Google sign-in Web Speech API — for voice command and speech-to-text functionality
The architecture follows a clean separation of concerns:
geminiService.ts handles all AI API communication useVoice.ts manages voice recognition firebase.ts handles authentication and backend services
What I Learned
Building Ash AI was a crash course in real-world development. Here's what I picked up along the way:
Firebase & Hosting — how to configure, deploy, and manage a live web application on Firebase Hosting, including setting up authorized domains for authentication Gemini AI Integration — how to structure multi-turn conversations, handle document context, and pass inline data like PDFs to a generative AI model Voice Recognition — how to implement real-time speech-to-text using the Web Speech API and handle browser compatibility React & Vite — how to build a scalable component architecture and configure environment variables correctly for production builds API Security — the importance of securing API keys and the real-world consequences of exposing them in public repositories
Challenges I Faced
No project comes without its battles. Here are the toughest ones:
- API Key Security Early on, GitHub's secret scanning flagged my Google API key as exposed in the repository. This was my first real lesson in API security — I had to learn about environment variables, .gitignore, and key rotation on the fly.
- Deployment Differences My app ran perfectly in Google AI Studio but showed a blank page on GitHub Pages and later on Firebase Hosting. The root cause? Environment variables work differently in Vite (import.meta.env) vs Node.js (process.env), and GitHub Pages can't handle single-page app routing without extra configuration.
- API Quota Exhaustion During testing and deployment, I hit quota limits on the Gemini API free tier across multiple projects. This taught me how to manage API keys effectively and plan for rate limiting in production apps.
- Firebase Authentication Domain Issues After switching to a new hosting URL, Google sign-in stopped working because the new domain wasn't added to Firebase's authorized domains list — a subtle but critical configuration step.
What's Next
Secure API key management using Firebase Functions as a backend proxy Mobile-responsive design improvements Custom domain deployment Memory and personalization features for returning users Usage tracking and premium tier support
Built with curiosity, persistence, and a lot of debugging. — Ashish Kumar Rai
Log in or sign up for Devpost to join the conversation.