HackMate-AI

Your AI Co-Founder for Building Winning Hackathon Projects.

Comment

HackMate AI

Inspiration

Hackathons are exciting, but many participants lose valuable time brainstorming ideas, organizing tasks, and preparing a clear execution plan. I wanted to create an AI-powered co-founder that helps teams move from an initial idea to a structured, hackathon-ready project within minutes.

What it does

HackMate AI is an intelligent assistant that helps hackathon participants generate a complete Hackathon Canvas.

It can:

  • Generate innovative project ideas.
  • Create an MVP roadmap.
  • Suggest the best technology stack.
  • Recommend team roles.
  • Build a 48-hour execution plan.
  • Suggest monetization strategies.
  • Provide winning tips.
  • Export the generated canvas as Markdown or PDF.

How we built it

HackMate AI was built using:

  • React + Vite for the frontend.
  • Google Gemini API for AI-powered generation.
  • Local Storage to save chat history and generated canvases.
  • html2pdf.js for PDF export.
  • React Icons for a clean and modern interface.
  • Custom UI/UX focused on hackathon productivity.

The application communicates with Gemini, processes AI responses, validates structured JSON, and converts it into an interactive Hackathon Canvas.

Challenges we ran into

During development I faced several technical challenges:

  • Handling inconsistent AI responses and validating generated JSON.
  • Designing a clean interface that remains easy to use under hackathon pressure.
  • Managing API rate limits and temporary service unavailability.
  • Supporting editable canvas sections while keeping exported files consistent.
  • Integrating PDF export without breaking the application layout.

Accomplishments that I am proud of

  • Built a complete AI-powered Hackathon Canvas generator.
  • Designed an intuitive and responsive user interface.
  • Added Markdown and PDF export.
  • Created editable project planning sections.
  • Successfully integrated Google Gemini AI into the workflow.

What I learned

Throughout this project I learned:

  • Prompt engineering for structured AI outputs.
  • Building reliable AI-assisted applications.
  • Error handling for LLM responses.
  • Frontend architecture using React.
  • Deploying modern web applications with Vercel.

I also learned the importance of designing AI tools that improve productivity while keeping the user in full control of the generated content.

Built With

  • React
  • Vite
  • JavaScript
  • Google Gemini API
  • HTML
  • CSS
  • html2pdf.js
  • React Icons

AI Assistance

During development I used AI coding assistants including OpenAI ChatGPT (GPT-5.6) and OpenAI Codex to help with brainstorming, debugging, code refactoring, interface improvements, and documentation. All architecture, integration, testing, and final implementation decisions were reviewed and completed by the project developer.

Built With

Share this project:

Updates