codecrumbs [active development phase, stay tuned!] 
What · Demo · Get started · Features · codecrumbs.io · Support · Contribute
What
Leave "breadcrumbs" in source code via comments to see "clear picture" how main features of your application work. Support of multiple modules and languages: JavaScript, TypeScript, [Java, Ruby, Python] (implementation in progress). Share your knowledge with export&import feature.
Demo
Check out standalone version running here with defined trail of codecrumbs.
Get started
Install codecrumbs globally or in devDependencies:
yarn add codecrumbs -D
Add command with entry file and source directory to scripts section in your package.json. Change -e (entry point file), -d (directory) params to match paths inside your project.
// package.json
...
"scripts": {
"start:cc": "codecrumbs -e src/index.js -d src"
}
Run yarn start:cc from the terminal. Go to http://localhost:2018/# in the browser to check it out.
Features
Breadcrumbs
Leave breadcrumbs by simply putting a comment in code, diagram wil be updated on the fly!
Write //cc:here is breadcrumb to put a simple breadcrumb in the code. cc (stands for "codecrumb") is the prefix which used by the parser, and here is breadcrumb is a title of our first breadcrumb.
Trail of breadcrumbs
Also, you can create “trail of breadcrumbs” — basically, a sequence of codecrumbs which follow some data flow (e.g. user login, or form submit, etc.).
To create a codecrumb as part of a trail you write: //cc:signin#3;enable route where signin is the trail ID, #3 is order number of step, enable route is a title describing the step.
Check out the introduction article here for more details.
Export & import (learn and share your knowledge)
So let’s say you put together some trail of codecrumbs describing some important flow inside the project. How you can share it with others? Simply download the json file of codecrumbs store, send it to the friend, he/she uploads it to the codecrumbs and can see same you just saw!

WIP
Next features are developing:
- multi languages support - support of java, ruby, python, etc.
- eject codecrumbs - ability to remove all "breadcrumbs" from source code in "one click"
Support
If you like this project and believe it makes sense, please, put a ⭐ or tweet about it - it will show your support and motivate me 👊. Thanks!
Contribute
When contributing to this repository, please first discuss the change you wish to make via issue, email, or any other method with the owner of this repository before making a change. Ideas and suggestions are welcome. To start development environment run:
yarn && yarn start
