Code Diagram

Code Diagram

A Diagram tool that lives inside VS Code

Install VSCode Extension

Problem: Reading codes is hard

As a software engineer, I often find myself at the middle of a large and complex codebase, trying to understand how a feature works. My usual approach is just tracing those function calls and piecing together a mental map of the code.

It can be overwhelming to keep track of everything when dealing with codes that spanning numerous files, along with various "if..else.." conditions.

Often the case, I found myself lost in the codebase, and have to start over again.

Solution: Why not draw a diagram?

That's my 1st thought, but I don't want to leave my code editor, switching to another tool and
losing my "codes" context

So then, I thought, why not build a diagram tool that lives inside VS Code?

The tool: Code Diagram

1. This is how it looks inside VS Code

Code Diagram

2. To draw a box, just select your codes and "Snip it"

3. Share it anywhere outside VS Code with a link

Try the below diagrams (which I created inside VS Code)

Give it a try if you're interested!

Love to hear your feedback. My email is feel free to drop me an email!