Bogdan-Lyashenko/js-code-to-svg-flowchart

これは何？

主な機能

• 01JavaScript（ES6）のソースコードを、ブラウザーまたはNode.js上でSVGフローチャートに変換します。
• 02ローカルのJSファイルからSVGファイルを生成するCLIを提供します。
• 03import/export、クラス、関数の依存関係など、あらかじめ定義された抽象化レベルを利用できます。
• 04独自の抽象化レベルとフローツリーの修飾子を定義できます。
• 05チャートのフォーカス、ぼかし、ブロックの破棄を制御できます。
• 06複数のカラーテーマを備え、独自のスタイル設定にも対応しています。

ユースケース

• モジュールや関数の仕組みを図で示してドキュメント化する。
• 制御フローを段階的に確認し、なじみのないコードベースを理解する。
• 高レベルの構造から詳細なロジックへと移るプレゼンテーション用スライドを生成する。
• 有効なJS構文で記述されたプロセスのフローチャートを作成する。

クイックスタート

1. 1

   NPMからパッケージをインストールする

   yarn add js2flowchart
2. 2

   CLIをどこからでも使えるようにグローバルインストールする

   yarn global add js2flowchart
3. 3

   JSファイルからSVGフローチャートを生成する

   js2flowchart main.js

使う前に知っておきたいこと

• !複数ファイルのサポートは、このライブラリではなく別プロジェクトのCodecrumbsで対応するとドキュメントに記載されています。
• !最後のコードのプッシュは2023年10月のため、メンテナンスのペースが遅い可能性があります。
• !READMEには、例に示されたもの以外のコードでどのようなフローチャートが出力されるか記載されていません。

トピック

よくある質問

js-code-to-svg-flowchart とは？

JSコードをSVGフローチャートに変換する、抽象化レベルやブロック修飾子、テーマに対応したライブラリとCLI。 js2flowchartはJavaScriptコードを解析して抽象構文木を作成し、そこからフローツリーを構築してSVGフローチャートとして描画します。クライアントとサーバーの両方で動作し、ES6構文に対応しています。JavaScript APIから、またはコマンドラインで単一のファイルを指定して出力を生成できます。

js-code-to-svg-flowchart は無料で使えますか？ライセンスは？

js-code-to-svg-flowchart は MIT ライセンスのオープンソースです。商用製品で使う前にライセンス条件を確認してください。

js-code-to-svg-flowchart は今もメンテナンスされていますか？

半年以上コミットなし。js-code-to-svg-flowchart の最終コミットは 2023年10月2日 です。

js-code-to-svg-flowchart は何に使えますか？

モジュールや関数の仕組みを図で示してドキュメント化する。 制御フローを段階的に確認し、なじみのないコードベースを理解する。 高レベルの構造から詳細なロジックへと移るプレゼンテーション用スライドを生成する。 有効なJS構文で記述されたプロセスのフローチャートを作成する。

js-code-to-svg-flowchart のインストール方法は？

NPMからパッケージをインストールする: yarn add js2flowchart CLIをどこからでも使えるようにグローバルインストールする: yarn global add js2flowchart JSファイルからSVGフローチャートを生成する: js2flowchart main.js

js-code-to-svg-flowchart はどこで入手できますか？

ソースコードとインストール手順は GitHub にあります：https://github.com/Bogdan-Lyashenko/js-code-to-svg-flowchart