Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>Code Insights DashboardNew to Visual Studio Code? Get it now.
Code Insights Dashboard

Code Insights Dashboard

Ismail-Mouyahada

|
28 installs
| (0) | Free
Real-time code quality metrics dashboard
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Code Insights Dashboard

Amazigh Code Insights Logo

Overview

Code Insights Dashboard is a VS Code extension that provides real-time code quality metrics with a modern, user-friendly interface. Built by Ismail Mouyahada, this extension helps developers maintain high code quality standards by providing instant feedback on various code metrics.

Features

Real-time Metrics

  • Complexity Score: Analyzes cyclomatic complexity of your code
  • Readability Index: Evaluates code readability based on line length and nesting
  • Style Guide Compliance: Checks adherence to coding style guidelines
  • Comment Coverage: Tracks comment percentage in your code
  • Code Duplication: Identifies potential duplicate code blocks
  • Lines of Code: Monitors code size and growth

Visual Dashboard

  • Modern, responsive interface with Tailwind CSS
  • Color-coded status indicators
  • Clear metric descriptions
  • Real-time updates as you code

Installation

  1. Open VS Code
  2. Press Ctrl+P / Cmd+P
  3. Type ext install code-insights-dashboard
  4. Press Enter

Usage

  1. Open any code file in VS Code
  2. Press Ctrl+Shift+P / Cmd+Shift+P
  3. Type "Show Code Insights Dashboard"
  4. Press Enter

The dashboard will appear in a new panel, showing real-time metrics for your code.

Configuration

You can customize the extension's behavior through VS Code settings:

{
  "codeInsights.complexityThreshold": 15,
  "codeInsights.readabilityThreshold": 8
}

Available Settings

Setting Default Description
complexityThreshold 15 Maximum acceptable cyclomatic complexity
readabilityThreshold 8 Minimum acceptable readability score (0-10)

Metrics Explained

Complexity Score

Measures code complexity based on:

  • Control flow statements (if, for, while, etc.)
  • Logical operators
  • Switch cases
  • Exception handling

Readability Index

Evaluates code readability using:

  • Line length
  • Nesting depth
  • Variable naming conventions

Style Guide Violations

Checks for common style issues:

  • Trailing whitespace
  • Tab characters
  • Naming convention violations
  • Missing newlines

Development

Prerequisites

  • Node.js (>= 14.x)
  • npm
  • VS Code

Setup

git clone https://github.com/ismail-mouyahada/code-insights-dashboard
cd code-insights-dashboard
npm install

Build

npm run build

Debug

  1. Open in VS Code
  2. Press F5 to start debugging

Contributing

Contributions are welcome! Please read our Contributing Guide for details.

License

MIT License - see the LICENSE file for details.

Author

Ismail Mouyahada

Acknowledgments

  • VS Code Extension API Documentation
  • Tailwind CSS for the modern UI
  • Amazigh art and culture for logo inspiration

Support

For bugs, feature requests, or support questions:

  • Create an issue on GitHub
  • Contact: [Your Contact Information]

Changelog

v1.0.0

  • Initial release
  • Basic metrics implementation
  • Real-time dashboard
  • Tailwind CSS integration

Made with ❤️ by Ismail MOUYAHADA

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft