Skip to content

Understanding code is tough. Nested conditionals, loops, recursion -- the abstraction can be hard to visualize. This Visual Studio Code extension generates a control flow diagram to help students visualize their code. Devpost: https://devpost.com/software/visualize-control-flow

License

Notifications You must be signed in to change notification settings

AronZeng/visualize-control-flow

 
 

Repository files navigation

Visualize Control Flow

Want to visualize the control flow of your code? Using this extension, you can generate a diagram that shows the control flow of your code. This is great particularly for students to see their code's logic in a diagram. We use a UML Activity Diagram format, making these diagrams easy to view. Currently supports visualizing control flow of Python code. Actively developed by @evank28 and @AronZeng as part of #VSCodeHackathon.

Links: GitHub, VS Code Marketplace

Features

Adds new commands:

Visualize Control Flow: Visualize Open File

Visualize Open File

Usage

  • With the extension installed, open the Command Pallete in Visual Studio Code (Ctr + Shift + P).
  • Select Visualize Control Flow: Visualize Open File with a Python (.py) file open.

Requirements

  • TypeScript

Known Issues

Where do we start?!

  • Limited Control Flow Logic is Supported
  • Not dynamic yet

About

Understanding code is tough. Nested conditionals, loops, recursion -- the abstraction can be hard to visualize. This Visual Studio Code extension generates a control flow diagram to help students visualize their code. Devpost: https://devpost.com/software/visualize-control-flow

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 93.8%
  • TypeScript 6.0%
  • Other 0.2%