reactocular

/ˈrɪˈaktɒkjʊlə/
noun

1. of or connected to React and vision.
   "project anxiety caused by reactocular trauma"
   

adjective

1. visual, brutish, inelegant
   

Visual brutish component scan of React projects. reactocular visualizes your React component hierarcy using tangle and Graphviz

1 Minute Version

You can use reactocular from command-line if you have Graphviz and Leiningen like this:

lein run ../hsl/digitransit-ui/app

There is also a convenient uberjar available to download. You can use it like a regular Java app like this:

java -jar reactocular.jar ../hsl/digitransit-ui/app

The result is a set of files with various visualiations of your components. You can see that there is still work to do, in this project as well as the example :)

Component diagram with references between components. Shows also which components are «elementary» building blocks (blue), as well as «stateless» functional components (gray). A dark gray signifies «page».

(from Digitransit)

Module diagram with folder structure (solid black) and component references (solid blue)

(from Digitransit)

Also if you want to use the code from Clojure, add to your project.clj:

Backlog

• Stylize the graph
• Add overall statistics
• Add simple list view
• Check against other projects and improve

=======

License

Copyright © 2015 Markku Rontu

Distributed under the Eclipse Public License either version 1.0 or (at your option) any later version.