Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/feakin/feakin-web
Feakin 是一个架构设计与可视化协作工具。Feakin is a architecture design and visual collaboration tool.
https://github.com/feakin/feakin-web
collaboration diagram-as-code
Last synced: about 2 months ago
JSON representation
Feakin 是一个架构设计与可视化协作工具。Feakin is a architecture design and visual collaboration tool.
- Host: GitHub
- URL: https://github.com/feakin/feakin-web
- Owner: feakin
- License: mpl-2.0
- Created: 2022-07-13T11:35:45.000Z (about 2 years ago)
- Default Branch: master
- Last Pushed: 2022-11-20T06:24:28.000Z (almost 2 years ago)
- Last Synced: 2024-04-16T08:12:16.567Z (5 months ago)
- Topics: collaboration, diagram-as-code
- Language: TypeScript
- Homepage: https://online.feakin.com/
- Size: 8.01 MB
- Stars: 94
- Watchers: 5
- Forks: 3
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- my-awesome - feakin/feakin-web - as-code pushed_at:2022-11 star:0.1k fork:0.0k Feakin 是一个架构设计与可视化协作工具。Feakin is a architecture design and visual collaboration tool. (TypeScript)
README
# Feakin
> Modernize architecture visualization assets management, based on Diagram-as-code, so you can create, share and edit diagram. Support for import Mermaid, PlantUML, Excalidraw, Dot and more.
[](https://github.com/feakin/feakin/actions/workflows/ci.yml) [](https://codecov.io/gh/feakin/feakin) 
[](https://app.codecov.io/gh/feakin/feakin)
Chinese introduction: Feakin 是一个架构资产可视化管理工具。基于[图表即代码](https://www.phodal.com/blog/diagram-as-code/) 的思想体系，支持导入 Mermaid, PlantUML, Excalidraw, Dot 等图形资产格式。
Core Technical:
- concepts: Collaboration (CRDT) + DSL (pest.rs) + Graph Engine + Editor Language (Monaco)
- stacks: Rust( + WASM) + React + TypeScript
特性：
- Graph
- [x] 跨图工具转换。支持导入 Mermaid, PlantUML, Excalidraw, Dot 等图形资产格式，并基于 Graph MIR 进行转换。
- [x] 广泛的图表格式导出。
- [x] Drawio
- [x] Excalidraw
- [x] 模板创建。支持创建模板，并基于 Graph MIR 进行转换，转换成其它图表格式。
- [ ] 多样化图形布局。支持 Dagre、ELK、Cola 等布局。
- [x] Dagre
- [ ] replace Grapvhiz to WASM
- [ ] 手绘风格。
- [x] Rough.js sample
- [x] Collaboration
- [x] Server
- [x] Protocol
- [x] CRDT
- [x] Editor
- [ ] DSL
- [x] FKL Syntax
- [x] FKL Parser
- [ ] FKL LSP
- [ ] Editor
- [x] Dot Language
- [ ] Fkl Language
## DSL Samples
```fkl
ContextMap TicketBooking {
Reservation <-> TicketContext;
}
Context TicketContext {
Aggregate Ticket, Reservation;
}
Entity Ticket {
Struct {
seat: String;
}
}
// binding;
impl CinemaCreated {
endpoint {
GET "/book/{id}";
authorization: Basic admin admin;
response: Cinema;
}
flow {
via UserRepository::getUser receive x: User;
via Kafak send User to "user.create";
}
}
```
## Demos
Try Online demo: [https://online.feakin.com/](https://online.feakin.com/) Or install `@feakin/cli` for diagrams converter:
```shell
npm install -g @feakin/cli
feakin --input software-development.md.drawio --output sd.excalidraw
```
## Todos
- [ ] Render
- [x] Layout Engine (TODO: split to standalone module)
- [x] [dagre](https://github.com/dagrejs/dagre)
- [ ] [ELK](https://github.com/kieler/elkjs)
- [ ] [cola.js](https://ialab.it.monash.edu/webcola/)
- [x] Canvas
- [x] [Konva.js](https://github.com/konvajs/konva), react: [react-konva](https://github.com/konvajs/react-konva)
- [x] Style
- [x] [roughjs](https://github.com/rough-stuff/rough): sketchy, hand-drawn-like, style
- [ ] Editor
- [x] text Editor with Monaco Editor
- [ ] interactive Editor with Graphical Editor
- [x] Parser
- [x] [Jison](https://github.com/zaach/jison) with Mermaid
- [ ] collaboration
- [ ] [Rope Architecture Model](https://blog.jetbrains.com/zh-hans/fleet/2022/02/fleet-below-deck-part-ii-breaking-down-the-editor/)
- [Rope](https://github.com/component/rope)
- [ ] [State Management](https://blog.jetbrains.com/zh-hans/fleet/2022/06/fleet-below-deck-part-iii-state-management/)
- [x] CLI
- [x] upgrade publish script
- [ ] Architecture Features
- [x] Playground: [https://online.feakin.com/](https://online.feakin.com/)
- [ ] [ComponentLess](https://componentless.com/) architecture
- [ ] WebComponent, like ``
- [ ] Templates
- [ ] DDD ?
- [ ] Layered Architecture
- [ ] Test Pyramid
- [x] Export and Import
- [x] MxGraph
- [x] Excalidraw
- [ ] PlantUML
- [ ] Libraries
- [ ] compatible Excalidraw libraries : https://libraries.excalidraw.com/?theme=light&sort=default
## Setup
We use nx.js for mono-repo architecture.
1. install
```shell
npm install --legacy-peer-deps
```
Note: nx.js use Craco, which will need `--legacy-peer-deps`.
2. development exporter, can just run by tests
## License
- Flow parser based on [mermaid.js](https://github.com/mermaid-js/)
- Excalidraw's type based on [excalidraw](https://github.com/excalidraw/excalidraw)
@2022 Thoughtworks This code is distributed under the MPL license. See `LICENSE` in this directory.