mermaid-to-reactflow-converter

KO | EN

gitlite — search

#typescript #ai-agents #ai #dsh-plugin #deepseek-harness #open-source #cli #claude-code #codex #developer-tools #react #windows

mermaid-to-reactflow-converter

★ 66 Open GitHub ↗

mermaidjs to reactflow converter app example

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# mermaid to reactflow converver app

This simple application converts mermaid flow diagrams to reactflow diagrams.

> [!WARNING]  
> This is a work in progress and is not yet ready for production use.

## [⚡️ Play on StackBlitz](https://stackblitz.com/~/github.com/relliv/mermaid-to-reactflow-converter)

## 🚀 Quick Start

1. Install dependencies:
```bash
pnpm i

# or

npm i
```

2. Start the development server:
```bash
pnpm dev

# or

npm run dev
```

## 🎬 Preview

![Preview](https://raw.githubusercontent.com/relliv/mermaid-to-reactflow-converter/main/src/assets/images/mermaid-to-reactflow-converter-preview.gif)

## 📚 Resources

- [Mermaid](https://mermaid.js.org/): Markdown-like script language for generating charts from text via javascript.
  - [Mermaid Live Editor](https://mermaid-js.github.io/mermaid-live-editor/): An online editor for creating mermaid diagrams.
  - [Mermaid Flowcharts](https://mermaid.js.org/syntax/flowchart.html): Documentation for creating flowcharts with mermaid.
  - [Mermaid to JSON Example](https://github.com/relliv/mermaidjs-to-json-example): An example of converting mermaid diagrams to JSON (*only typescript*).
- [ReactFlow](https://reactflow.dev/): A library for building node-based graphs.
- [Monaco Editor](https://microsoft.github.io/monaco-editor/): A browser-based code editor.
  - [Monaco Editor Theme Loading](https://github.com/relliv/monaco-editor-textmate-theme-loading-example): An example of loading textmate themes for the Monaco Editor.

mermaid-to-reactflow-converter

Explore Similar Repositories

Was this content helpful?

Recent Feedback

Download README