mermaid 다이어그램 에디터 : 클리앙

https://swkwon.github.io/mermaid-editor/

바이브 코딩으로 만들어봤습니다.

직접 코딩한건 1%정도 되는 것 같고, 나머지는 전부 시켰습니다. 심지어 github 업로드 까지도요.

3일 정도 걸렸습니다.

* 광고 없이 심플한 UI로 강력한 기능을 간단하게 사용하실 수 있습니다.

* mermaid 마크다운으로 다이어그램을 그릴 수 있습니다.

* 시퀀스 다이어그램, 클래스 다이어그램 등을 포함하여 22개의 다이어그램을 그릴 수 있습니다.

* URL로 다이어그램을 공유 할 수 있습니다.

* txt로 파일 저장 / 불러오기가 가능합니다.

* jpg, png, svg, pdf 파일로 저장 가능합니다.

* 마우스로 다이어그램 이동 / 확대 / 축소가 가능합니다.

* 키보드로 다이어그램 확대 / 축소 / 리셋이 가능합니다. (ctrl + +, ctrl + -, ctrl + 0)

* 키보드로 다이어그램 이동이 가능합니다. (ctrl + i, ctrl + k, ctrl + j, ctrl + l)

* 클립보드에 다이어그램 이미지를 저장할 수 있습니다.

* 마크다운 에디터 테마 9가지가 적용되었습니다.

* UI 다크모드가 가능합니다.

* 실수로 창을 닫아도 로컬스토리지에 저장되어 있어 다시 접속하면 마크다운이 남아 있습니다. (만료시간 1시간)

* 테마나 설정들이 로컬스토리지에 저장됩니다.

* github에 소스 공개되어 있습니다.

참고: 로컬스토리지는 브라우저나 컴퓨터가 바뀌면 접근 할 수 없는 저장소 입니다.

더 많은 기능을 추가할 예정입니다. 딱히 유료 다이어그램 프로그램을 사용하시지 않는다면 많이 사용해주세요.

사이트 헬프 버튼에 mermaid 문법에 대해 배울 수 있습니다.

여기에도 링크를 남기겠습니다.

---------- 추가 ----------

이 후 업데이트 사항있어 올립니다.

* 구글인증으로 로그인 시 클라우드에 다이어그램 저장/불러오기가 가능합니다.

* 모바일에서도 볼 수 있도록 반응형으로 변경하였습니다.

* 다이어그램 마크다운 키워드와 기호 자동완성 기능이 추가 되었습니다.