JavaScript Calculator project, executable diagram

Hi all,
As part of my #100DaysOfCode challenge I am writing a ‘executable diagram’, and one of the examples of the project is a JavaScript Calculator that pass all the tests of freeCodeCamp :smile: .

I am really happy with it and I wanted to share it:


  • The diagram is executable in the sense that is a representation of the state machine that control the logic of the program.

  • If you write in the console: show='path' you can see all the states/edges visited during the execution

  • To go back to only highligth the current state/edge write in the console: show='currentPath'

  • Is posible to move the diagram (‘click and drag’), zoom in (‘double click’ the diagram) and zoom out (shift + ‘double click’ the diagram)

Cheers and happy coding :slightly_smiling_face:

Hey there,

that’s a very cool project, great work!

My ideas:

  • on a small screen, it is hard to use; you could stack the 3 sections on top of each other
1 Like

I never thought of using a small screen :open_mouth: ( the smallest viewport I tested was 800x1080)

Thanks for you feedback :slightly_smiling_face:

Cheers and happy coding