Logix: Learn Logically

Inspiration

As a computer science learner, I noticed that most coding platforms only focus on running code, not on understanding the logic behind it. Debugging, analyzing algorithmic complexity, or identifying unused code can be overwhelming, especially for beginners. I wanted to create something that feels like a personal AI tutor — always available to explain, analyze, and guide logically. That vision led me to build Logix: Learn Logically.


What it does

Logix is an AI-powered learning companion that combines multiple tools into one platform:

  • Code Playground → Write, analyze, and execute code in multiple languages with real-time feedback and AI-powered bug detection.
  • Algorithmic Complexity Analyzer → Provides detailed time and space complexity for best, average, and worst cases, with explanations like:
    [ O(n), \quad O(n \log n), \quad O(n^2) ]
    and visual charts to make concepts more intuitive.
  • Unused Code Detection → Finds unused files, functions, and exports in JavaScript/TypeScript projects, complete with a dashboard, CLI tool, and JSON export.
  • Logix AI Chatbot → A computer science–focused chatbot that answers questions, explains algorithms, and provides code snippets with markdown and code formatting.
  • Study Materials Library → Curated notes on fundamental CS topics, examples, and practice problems.
  • User Profiles & Authentication → Firebase-powered sign-up/login system with profile management and progress tracking.

How I built it

  • Frontend: Next.js + React with ShadCN UI and Tailwind CSS for a modern, responsive, dark-mode-first interface.
  • Language: TypeScript for reliability and scalability.
  • Code Playground: Built using react-simple-code-editor + prismjs for live editing and syntax highlighting.
  • AI Integration: Powered by Google Gemini via Genkit to deliver code explanations, bug detection, and conversational learning.
  • Algorithm Analysis: Combined static code analysis with AI-generated explanations and visualized results using recharts.
  • Unused Code Detection: Implemented with the TypeScript Compiler API, extended to handle Next.js-specific conventions.
  • Authentication & Database: Managed with Firebase Authentication and Firestore, secured with role-based access rules.
  • Content System: Study resources stored as Markdown/TS files, rendered with react-markdown and syntax highlighting libraries.

Challenges I ran into

  • AI hallucinations → Tuning prompts and adding fallback logic to keep explanations reliable.
  • Static analysis difficulties → Handling dynamic imports and Next.js conventions for unused code detection.
  • Balancing features with simplicity → Keeping the interface approachable while offering advanced functionality.
  • Integration hurdles → Stitching together Firebase, Genkit, and Next.js with proper security and environment management.

Accomplishments that I'm proud of

  • Built a working AI-assisted code playground that not only executes code but teaches the logic behind it.
  • Developed a unique unused code detection tool with CLI and dashboard support.
  • Designed a CS-focused chatbot with markdown/code block support and conversation history.
  • Delivered a modern, dark-mode-first UI that’s visually appealing and intuitive.
  • Compiled a comprehensive CS study library that complements the interactive tools.
  • Deployed a public version of Logix for learners to explore.

What I learned

  • How to integrate Genkit + Google Gemini into a full-stack learning application.
  • Insights into static analysis and framework-specific quirks (like Next.js).
  • Best practices in UI/UX design for educational platforms.
  • Firebase’s advantages and limits in real-time apps with authentication.
  • The importance of modular code and documentation in complex, multi-feature projects.

What's next for Logix: Learn Logically

  • Add support for more languages (C++, Java, Go, and beyond).
  • Enable real-time collaborative coding for group learning.
  • Gamify learning with challenges, points, and leaderboards.
  • Add voice interaction for a natural AI tutoring experience.
  • Develop a mobile version for on-the-go learning.
  • Collaborate with educators to create structured courses powered by Logix.

Logix is my attempt to make learning computer science more logical, interactive, and personalized — one step closer to having an AI tutor for every learner.

Built With

Share this project:

Updates