DevSage

Inspiration

There was a large amount of random projects on our computers that we worked on, but we forgot what they were about. Some projects are worth keeping, others not so. DevSage helps us (and others) quickly figure out what each project is doing without having to manually read every file.

What it does

DevSage lets you upload an entire project folder, then uses a FastAPI backend and OpenAI’s GPT-4 to analyze and generate high-level documentation. It gives you a quick overview of what your codebase does, so you can decide if it’s worth picking back up.

How we built it

We built a full-stack app from scratch:

Frontend: Built using Next.js, TypeScript, Tailwind CSS, and Radix UI components. The UI parses the folder structure, previews files, and shows documentation results.
Backend: A custom Python FastAPI server that accepts zipped folders, unpacks them, reads the contents, and prompts the OpenAI API for a summary.
AI: We used OpenAI API
We also used tools like JSZip, scroll areas, and drag-and-drop directory uploads. ## Challenges we ran into There were many challenges. One was trying to setup the python backend. Initially we figured the project was simple, meaning we just had to prompt gpt for every file that was read, but this quickly ate up GPT's budget and caused long load times. So we had to think smarter. Taking inspiration from Cursor, we decided to batch files together into groups and prompt GPT with only the most relevant chunks. We also built a lightweight filtering mechanism that skips over dependencies and focuses on core files like source code, configs, and documentation.

Another problem was trying to handle drag-and-drop uploads of entire directories in the browser. Since browsers don't natively support this well, we had to manually walk through the file tree using low-level APIs, and re-construct the folder structure ourselves, then zip it all client-side using JSZip.

Finally, connecting the frontend, backend, and API layers, brought many challenges.

Accomplishments that we're proud of

We're proud of choosing an idea thats manageable for our first time at a hackathon within a short period of time, so we had more time coding. We're proud of the fact that our project showed some real problems when it came to optimizing performance, which gave us more experience. We're proud of the fact that our project has a somewhat practical application to people who keep a backlog of projects and are interested in deleting them. We're proud of using various languages/frameworks/APIs, and integrating them into one decent product. We're proud of the fact that we used A.I in a more creative way than a simple ChatBot, by chaining prompts.

What we learned

We learned how to build a full-stack app that combines various tools we have amateur experience with into a single working product. For example, FastAPI, file handling in the browser, drag-and-drop directory support, and JSZip. We learned how to communicate with a backend via FormData, and how to invoke and parse responses fro the OpenAI API. We also gained better understanding of prompt-design, meaning how to batch, summarize, and guide GPT to produce structured and useful results.