Hi :wave:, I'm creating a code explorer inspired b...
# share-your-work
Hi 👋, I'm creating a code explorer inspired by

Code bubbles

. The difference is that bubbles are not draggable, and everything has an automatic layout. Here is a video with the progress of the first weeks. You can give it a try to this really early version at https://minimalistidev2.netlify.app/
👍🏽 1
👍 9
That's cool! What are you using to navigate to the definitions? I built something similar in the past using ts-morph
ts-morph looks cool, for now I'm using the output of Acorn to navigate. The code is still pretty hardcoded but I'm using this
This is awesome! Could you make it usable for any programming language ? You could perhaps implement this UI ontop of VSCode.
Yeah, it could work for any language, for now it only works for javascript. I want to focus on a research phase to see what UX interactions are useful, so I'm building it as a SPA for now. I might work on a VSCode extension in the future 🤷‍♂️
👍 1
One thing that's not shown in the video is that the bubles open in the order that the functions are defined. A second comment is that the
function opens twice because I want to have a call tree and it will make more sense once live values are added.
One of my favorite features of editors is when I click a term and all its uses are highlighted, but why is the highlight constrained to a single file? I spend so much time looking at multiple files trying to trace where a value was defined or modified. Here is a demo of a multilevel highlight, looking forward to read your comments 😃
So function arguments know the variable passed in at the call site? What if the caller had multiple calls to the function with contradictory arguments?
Every function call will open a separate "bubble". Rn I'm in research mode exploring this option, and so far it feels good. It creates a call tree, instead of how we normally see code with a closer representation of the codebase instead of the runtime. Does it make sense @Kartik Agaram? Here is video that might make it easier to understand
I see. Do edits in one call get reflected in the other?
Ideally yes. But I'm focusing on a code explorer for now, with no editing ability. I want to make a semantic editing experience, whenever I get to that point
👍🏽 1