CodeSahayatri

Codebase Navigator for Intern, New Grad Developers.

Comment

Inspiration

As interns, it can be challenging to quickly grasp a complex codebase. To address this, we developed a tool that analyzes a codebase, visualizes function dependencies in an intuitive way, and integrates Mistral AI for interactive code exploration.

What it does

CodeSahayatri is an interactive tool designed to analyze a codebase and generate a dynamic visualization of function dependencies. It extracts function definitions and their relationships from a selected repository, presenting them as an interactive network graph. Users can click on any node to view the corresponding source code in a draggable, resizable panel, with animated arrows illustrating both outgoing and incoming call flows. Additionally, CodeSahayatri features Sahayatri, an AI-powered chatbot that answers questions about the codebase, enabling developers to quickly understand complex systems.

How we built it

Code Sahayatri started as an ambitious idea—to create a tool that transforms how developers explore and understand complex codebases. We built it with a modern tech stack, combining React and TypeScript with D3.js and React Force Graph to bring code structures to life through interactive visualizations.

One of the most exciting aspects was integrating GitHub's API to provide real-time insights into repositories. This allows developers to see how a codebase evolves, track commits instantly, and navigate project structures effortlessly. To make the tool truly intelligent, we incorporated OpenAI's GPT-4.o, helping developers interpret unfamiliar code by providing meaningful explanations. Framer Motion adds smooth animations, while Tailwind CSS brings a sleek, cyberpunk-inspired design that merges aesthetics with usability.

Challenges we ran into

Building Code Sahayatri came with its fair share of challenges. One of the toughest was optimizing graph visualizations for massive repositories—thousands of files meant potential performance bottlenecks. Initially, the visualizations struggled under heavy loads, so we implemented intelligent node clustering and lazy loading to strike a balance between detail and performance.

Another challenge was making AI responses contextually aware of a repository's structure. A generic AI response wasn’t enough—we needed it to truly understand code relationships. To solve this, we developed a custom prompt engineering system that maintains repository context while delivering relevant insights. Keeping the UI smooth and responsive, especially while handling real-time commit history tracking, was another tricky problem. Careful state management and optimization helped ensure a seamless experience.

Accomplishments that we're proud of

We’re incredibly proud of what we’ve built. Code Sahayatri isn’t just visually compelling—it’s a genuinely useful tool that helps developers, especially beginners and interns, navigate complex codebases with ease. Some of our key achievements include AI-powered code exploration that provides meaningful insights into unfamiliar code, real-time directory search and commit tracking, making it easier to trace changes, a well-structured, interactive visualization system that enhances understanding, and a cyberpunk-inspired UI with dynamic animations that improve user experience. More than anything, we’re proud that Code Sahayatri makes learning and exploring codebases more accessible and engaging for developers at all levels.

What we learned

This project taught us valuable lessons about scaling interactive visualizations, optimizing API calls, and managing complex state in React and TypeScript. Working with GitHub’s API deepened our understanding of repository architecture, and building a real-time search system improved our approach to type safety and performance optimizations. We also learned that making technical tools intuitive is just as important as making them powerful. A great developer tool should not only have advanced features but also provide a seamless user experience that makes exploration effortless.

What's next for CodeSahayatri

We have ambitious plans for the future and are working on several improvements: advanced code analysis using machine learning to identify patterns and suggest improvements, integration with more version control platforms beyond GitHub, collaborative features that allow teams to share insights and annotate code, AI-powered documentation generation to simplify complex code structures, performance optimizations for handling enterprise-scale repositories, custom visualization themes and layouts for different types of projects, and integration with popular IDEs to make Code Sahayatri part of a developer’s daily workflow. Our vision is to make Code Sahayatri an essential tool for developers, helping them navigate and understand codebases more effectively. We believe this project has the potential to reshape the way developers interact with code, making it more accessible, insightful, and efficient.

Built With

Share this project:

Updates