Skip to content

An AI-powered platform that explains, debugs, and visualizes code with interactive flowcharts, 3D models, and voice narration.

License

Notifications You must be signed in to change notification settings

anushkasark08/CodeClarity

Β 
Β 

OSCI-Project-Banner.png

CodeClarity

GitHub stars GitHub forks GitHub watchers

An AI-powered platform that explains, debugs, and visualizes code with interactive flowcharts, 3D models, and voice narration.

Line

πŸ’‘ Project Overview

CodeClarity is an intelligent AI-powered web platform that supports multiple programming languages (C, C++, Python, Java, JavaScript) and generates detailed, easy-to-understand code explanations.

The platform supports multiple comprehension levels (e.g., for 10-year-olds or 20-year-olds), making it accessible to all kinds of learners. It visualizes logic and flow with animated flowcharts, 3D models for arrays/matrices/trees/graphs, and includes a β€œWhy?” mode for line-by-line explanations.

It can:

  • Fix buggy code and explain the mistake.
  • Narrate code in natural voice.
  • Analyze complexity (time & space).
  • Execute code step-by-step in a sandbox.
  • Track code evolution over time.
  • Suggest smart optimizations with side-by-side comparisons.
  • Auto-generate quizzes, test cases, and summary files.

Line


πŸ“ Project Structure


CodeClarity/
β”œβ”€ .github/
β”‚  └─ workflows/
β”‚     └─ issue-create-automate-message.yml
β”œβ”€ CodeViz/
β”‚  β”œβ”€ public/
β”‚  β”‚  β”œβ”€ favicon.ico
β”‚  β”‚  └─ other assets...
β”‚  β”œβ”€ src/
β”‚  β”‚  β”œβ”€ assets/
β”‚  β”‚  β”œβ”€ components/
β”‚  β”‚  β”‚  β”œβ”€ features/
β”‚  β”‚  β”‚  β”œβ”€ layout/
β”‚  β”‚  β”‚  └─ ui/ ...
β”‚  β”‚  β”œβ”€ data/
β”‚  β”‚  β”œβ”€ hooks/
β”‚  β”‚  β”œβ”€ lib/
β”‚  β”‚  β”œβ”€ pages/
β”‚  β”‚  β”œβ”€ services/
β”‚  β”‚  └─ App.tsx, main.tsx, index.css, ...
β”‚  β”œβ”€ index.html
β”‚  β”œβ”€ package.json
β”‚  β”œβ”€ tsconfig.json
β”‚  └─ other assets and documentations
β”œβ”€ CODE_OF_CONDUCT.md
β”œβ”€ CONTRIBUTING.md
β”œβ”€ IDEA.md
β”œβ”€ License.md
β”œβ”€ OWNERSHIP.md
β”œβ”€ README.md
└─ SECURITY.md

✨ Features

🧠 Code Understanding

  • Multi-level explanations – Tailored for beginners, students, and advanced learners.
  • β€œWhy?” mode – Line-by-line or block-level reasoning behind the code.
  • Real-world analogies – Simplifies abstract concepts with relatable examples.

🎨 Visualization

  • Interactive flowcharts & diagrams – Auto-generated from logic and structure.
  • 3D data structure models – Arrays, matrices, trees, and graphs visualized in 3D.
  • Export-ready visuals – Save diagrams, charts, and summaries for reports or study.

πŸ“š Learning Tools

  • Auto-generated quizzes & test cases generator – Reinforce understanding instantly.

βš™οΈ Execution & Analysis

  • Secure sandbox – Step-by-step real-time execution with variable tracking.
  • Complexity analysis – Automatic time & space complexity insights.
  • Smart debugging & refactoring suggestions – Detects bugs, suggests fixes, and optimizations.

🌍 Accessibility & Sharing

  • πŸŽ™οΈ Voice narration – Natural speech explanations for auditory learners.

  • πŸ“€ Export – Save visuals, diagrams, and summaries for reports or study.

    πŸ”— Integrations

  • GitHub import – Analyze code directly from repositories.

  • Version tracking – Monitor and compare code evolution over time.

Line

πŸ” Ownership & Authorship

This project and its concept were originally created and are maintained by:

πŸ‘© Damacharla Sushma
πŸ—“οΈ Idea Creation: July 28, 2025
πŸ”— GitHub Profile

All rights reserved.
Unauthorized copying, redistribution, or reproduction of this project in any form is strictly prohibited without explicit written permission from the author.

Line

πŸ’‘ Contribution & Improvements

We welcome suggestions and contributions from the community to enhance CodeClarity.

You can contribute in two ways:

  1. Open an Issue – Describe the suggestion, bug, or improvement with clear expected behavior.
  2. Submit a Pull Request (PR) – Fork the repository, implement changes in a feature branch, and submit a Pull Request (PR) for review.

Quick PR steps

# 1. Fork this repository and clone your fork
fork β†’ git clone     
cd CodeClarity
# 2. Create a new branch
git checkout -b feature/your-feature-name
# 3. Make your edits
git add .
git commit -m "Commit Message Here"
# 4. Push your branch and open a PR
git push -u origin feature/your-feature-name
# 5. Open a PR from your fork

Line

πŸ“œ Code of Conduct

Please follow our Code of Conduct to maintain a welcoming community.

πŸ™Œ Getting Started

Clone this repo and start contributing!

git clone https://github.com/Sushma-1706/CodeClarity.git
cd CodeClarity
npm install
npm run dev

πŸ‘€ View the Code
πŸ”— GitHub Repository β†’

πŸ“„ License
This project is licensed under the MIT License.
You can use, modify, and distribute this project freely, but attribution is required.
β€œYou can do almost anything you want with this code, just don’t hold us liable, and please keep our names in it.”

πŸ“„ License

This project is licensed under the MIT License. See MIT License for details.

⭐ If you find this project useful, please give it a star to support development!

About

An AI-powered platform that explains, debugs, and visualizes code with interactive flowcharts, 3D models, and voice narration.

Resources

License

Code of conduct

Contributing

Security policy

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • TypeScript 95.7%
  • CSS 2.7%
  • JavaScript 1.2%
  • HTML 0.4%