Okera
All work
Developer Tool · Code IntelligenceLive

CodeSight

See how your codebase actually fits together.

Role
Product Design & Full-Stack Engineering
Year
2026
Stack
8 technologies
codesight-client-hqpp.onrender.com/graph
Graph Area

Graph Explorer

Flow: Save AnalysisSave analysis
1Scan
2Select flow
3Explore
4Save
DashboardExplorerGraphControllerGraphServiceCodeAnalyzerProjectRepoCodeSightDb
(01)Overview© 2026

CodeSight turns an unfamiliar codebase into a living map. Point it at a project and it scans the source, builds a dependency graph, and lets you trace how a single user action travels across the entire stack — page, controller, service, repository, and database.

It's built on a clean, layered .NET architecture with a Blazor front end talking to a dedicated API. An interactive Cytoscape graph sits at the centre, paired with an AI insight panel that explains any node, flow, or endpoint in plain English.

Built with

  • Blazor
  • .NET 10
  • ASP.NET Core API
  • Clean Architecture
  • Cytoscape.js
  • MySQL · EF Core
  • Groq LLM
  • JWT Auth

Full-stack

Frontend → API → database flow tracing

AI-native

Plain-English node, flow & endpoint insights

5 layers

Clean .NET architecture, end to end

Any stack

Language-agnostic codebase scanning

(02)Capabilities© 2026

What it does

01

Interactive system graph

A force-directed Cytoscape graph renders the whole system. Zoom, search, and focus any node to watch its neighbourhood light up.

02

Frontend-to-backend flow tracing

Pick a flow or endpoint and CodeSight isolates the exact path a request takes across the stack, hiding everything that isn't part of it.

03

AI insight panel

One click explains any node, flow, or endpoint in plain English — an LLM reads the surrounding relationships and summarises what it does.

04

Endpoint explorer

Every HTTP endpoint, grouped by method, with inferred request and response types for stacks that expose them.

05

Hotspot detection

Degree-centrality scoring surfaces the most connected, highest-risk nodes so you can see where complexity concentrates.

06

Saved analysis history

Scans persist to a database, so you can revisit a project's structure and track how its shape changes over time.

(03)Inside the product© 2026
Dashboard

Saved analysis at a glance

Every scan persists to a database, so the dashboard surfaces saved projects, totals, and the latest analysis the moment you land.

codesight-client-hqpp.onrender.com
Dashboard

CodeSight Overview

Saved project analysis totals from your database.

Analyze New Project

Saved projects

12

Saved analyses

48

Graph nodes

1,204

Endpoints

186

Latest Save

Project

express-shop

Saved

2026-06-30 14:22

Average node count

98.4

Recent Projects

express-shop

Express

Open

OkeraWebsite

Next.js

Open

CodeSight.API

.NET

Open
Graph Explorer

Trace a single flow end to end

Pick a flow or endpoint and the graph isolates the exact path a request travels — then the AI panel explains the hotspot in plain English.

codesight-client-hqpp.onrender.com/graph
DashboardExplorerGraphControllerGraphServiceCodeAnalyzerProjectRepoCodeSightDb
AI Insight · GraphService

Central hub of the analysis flow — connects the controller to the repository and ranks among the graph's top hotspots.

Okera designs and builds full-stack products like this one — from first sketch to deployed system.