OVERVIEW

A visualization of the application structure. See, read & learn the code, effortlessly.

An invaluable tool for developers who will be able to immediately see the layout of the application folder and how the files within connect with one another.

Table of contents

• Getting started
• Usage
• Built with
• Authors
• License

Getting started

Go to the chosen app directory on the CLI, then install the following -

yarn global add app-overview
-or-
npm install -g app-overview

Once installation is complete, input your entry point like so -

overview index.js
-or-
overview src/index.js

This will build the config file and begin the visualization. Once complete, the visual file will open in your default browser. Click the menu and choose a view.

Unfoldable tree view

Radial view

Hover to track connections

Alternatively, you can go to YourAppDirectory/visual/overview.html.

If you would like to reset/delete the Visual folder, simply enter overview -r in your CLI to remove the contents.

Enjoy!

Usage

• overview _.js - Set entry file point + begin visualization
• overview -r - Remove Visual folder + reset
• overview -h - Menu/help
• overview -p - View current path

Built with

• d3 - Data driven visualization
• node - Modular CLI config & system filing
• webpack - Bundling application for npm consumption
• npm - Packaging, versioning & publishing
• command line args - Parsing CLI options

Authors

• Achim Bode - Data Visualization/D3 - achimbode
• Karsten Balogh - Parsing/Data Algorithms - karstenba
• Nikita Kudryavtsev - Data Visualization/D3/Front-End - palevoo
• Rainier Louis - CLI Environment/NPM - rainierlouis

License

This project is licensed under the MIT License - see the LICENSE.md file for details