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 순서도로 변환하는 JavaScript 라이브러리 및 CLI js2flowchart는 JavaScript 코드를 추상 구문 트리로 파싱하고, 이를 바탕으로 흐름 트리를 만든 다음 SVG 순서도로 렌더링합니다. 클라이언트와 서버 모두에서 실행되며 ES6 문법을 지원합니다. JavaScript API를 사용하거나 파일 하나를 인수로 지정해 명령줄에서 결과를 생성할 수 있습니다.

js-code-to-svg-flowchart은(는) 무료로 사용할 수 있나요? 라이선스는 무엇인가요?

js-code-to-svg-flowchart은(는) MIT 라이선스의 오픈소스입니다. 상업용 제품에 사용하기 전에 라이선스 조건을 확인하세요.

js-code-to-svg-flowchart은(는) 아직 유지보수되고 있나요?

6개월 이상 커밋 없음. 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