This is my first post on dev.to. I'm happy to join this community. I saw a lot of people here sharing their cool software, so I want to do the same.
Let me introduce you to my PlantUML Editor, https://plantuml.aristorinjuang.com/. This post is an extension of https://aristorinjuang.com/plantuml-editor.html. However, I'll go into more technical details here. I hope I'll get your feedback.
This PlantUML Editor is open-source, https://github.com/aristorinjuang/plantuml-editor. So, you can clone it, run it locally, make a copy (fork), or even contribute to it.
My daily work often involves PlantUML, Systems, Sequences, and most often, Domain-Driven Design. However, I didn't like the tools currently available. The main issues are the ads and the installation or setup required (especially for the desktop app). Do you feel the same? So I created the new one and made it open-source.
What I wanted was a web-based application, because the goal is not to require any installation or setup. So far, a number of features have been added that have made me comfortable working with PlantUML Editor and confident enough to share it here. However, this tool is far from perfect. But I hope it can at least solve your problem.
Front-End / Web Renderer
The first feature I needed to achieve was a web renderer. The ability to render PlantUML into diagrams without requiring any back-end or server. Thanks to this library, https://github.com/plantuml/plantuml.js, which made it possible.
Even if it is a web renderer, it still requires an internet connection, because the CheerpJ runtime itself is loaded from the internet. Maybe in the future I will host the CheerpJ loader locally.
Back-End / (Java) Server Renderer
The first issue I encountered with Web Renderer was that it was slow. You can see how I met this issue on my first live streaming, https://youtube.com/live/Q7MZbhyOMwM.
The second issue was that the web renderer didn't show syntax errors. I didn't know which line had syntax errors. The Console couldn't help much. It was a bad experience.
Thanks to https://www.plantuml.com/plantuml, which made back-end rendering possible. It was showing the syntax errors as a result or image (human-friendly).
Currently, PlantUML Editor has two types of renderers: web and server.
File Management System
Our work or diagrams are private; only you can see your work because it is stored locally in your web browser via the Web Storage API.
Share as URL
Our diagrams are private, unless you share them as URLs. No server needed for this feature. Only using the encode/decode PlantUML technique.
Responsive Layout with Mobile Tabs
What if the user receives the shared URL and views it on mobile? No problem. The PlantUML Editor is mobile-friendly.
Preview Panel (Light/Dark) Theme Toggler
I code in a dark theme, as well as for viewing diagrams.
Multi-tab Support
We can work on multiple diagrams in different tabs in the same web browser. Each tab contains different PlantUML code and preview images. The File Management System can keep track of our work properly. If you do not believe that, try it by yourself!
Top comments (0)