The Meta-Compiler: Hackathon Story
Inspiration: The Real Hackathon Bottleneck
Hackathons are about rapid innovation, but so much time is lost on the surrounding tasks: writing compelling descriptions, creating architecture diagrams, scripting a demo, and crafting a social media buzz. We've all been there – it's the final hours, the code is almost working, and you still have to create an entire presentation package from scratch. This "submission fatigue" steals focus from what truly matters: the hack itself.
We were inspired to solve this problem. What if you could "compile" all your submission materials just as you compile your code? That's the core idea behind The Meta-Compiler. It's not a code generator; it's an artifact generator. It takes your raw project idea and instantly produces all the high-quality documentation and presentation materials you need to impress the judges, freeing up your team to focus exclusively on building something amazing.
What We Learned: The Power of Structured AI
Building The Meta-Compiler was a deep dive into the practical application of large language models. Our biggest takeaway was the importance of prompt engineering and structured output.
Chained Prompts for Consistency
Our "aha!" moment was realizing we could create a consistent narrative across all generated assets. We first prompt the Gemini API to act as a solution architect and generate a technical stack in a strict JSON format. This JSON object then becomes the "source of truth," fed as context into all subsequent prompts. This ensures the description, diagram, and demo script are all perfectly aligned with the same underlying architecture.
The Nuances of Generative Syntax
Getting an AI to consistently generate valid Mermaid diagram code was a challenge. We learned to be incredibly specific in our instructions, adding rules about flowchart direction, subgraph usage, and even how to handle special characters in labels to prevent rendering errors. We specifically chose gemini-2.5-pro for this task due to its advanced reasoning capabilities.
Speed vs. Complexity
For most text-based generation (descriptions, scripts), gemini-2.5-flash provided the perfect balance of speed and quality. This taught us to select the right tool for the job, optimizing the user experience by delivering results quickly without sacrificing coherence.
How We Built It: A Lean, Mean, Generating Machine
We designed The Meta-Compiler to be a lightweight, fast, and powerful client-side application.
Frontend
Built with React and styled with Tailwind CSS for a modern, responsive, and developer-friendly interface.
Core AI Engine
The app communicates directly with the Gemini API using the @google/genai SDK. There's no complex backend; all the magic happens in the browser.
The Generation Pipeline
- A user enters their project idea. An optional "Refine with AI" feature helps polish the initial concept.
- Clicking "Generate" kicks off a multi-step process. First, it calls gemini-2.5-flash with a specific responseSchema to get a structured JSON object defining the project's tech stack.
- This tech stack object is then used as context for five parallel API calls to generate the project description, Mermaid diagram code (gemini-2.5-pro), demo script, and social media post. We use Promise.allSettled to handle these asynchronous requests gracefully.
- The results are rendered in a clean, organized UI. The Mermaid diagram is rendered client-side using the mermaid.js library, and we even added functionality to copy content or download the diagram as an SVG.
Challenges We Faced
Our primary challenge was prompt reliability. Initially, the generated Mermaid diagrams would fail to render about 20% of the time due to subtle syntax errors. We overcame this through iterative prompt refinement, studying the failure cases, and adding explicit, "CRITICAL" rules to the prompt to guide the model towards generating valid code.
Another challenge was managing the user experience during generation. Since multiple API calls are happening, we needed to provide clear feedback. We implemented a progress tracker that ticks off each generated asset as it completes, turning a potentially frustrating wait into an engaging "compilation" process. This ensures the user always knows what's happening behind the scenes.
Log in or sign up for Devpost to join the conversation.