PlantUML 编辑器

Source: Dev.to

Introduction

这是我在 dev.to 上的第一篇文章。很高兴加入这个社区。我看到这里有很多人分享他们很酷的软件，我也想做同样的事。

让我向你介绍我的 PlantUML 编辑器， 。这篇文章是 对的扩展。不过，我将在这里深入技术细节。希望能得到你的反馈。

PlantUML 编辑器是开源的： 。你可以克隆它，在本地运行，fork，甚至为它贡献代码。

我的日常工作经常涉及 PlantUML、系统、序列图和领域驱动设计。我不喜欢现有的工具，因为它们有广告并且需要安装/配置（尤其是桌面应用）。我想要一个基于网页的应用，免安装、免配置。以下是目前已经加入的功能。

Front‑End / Web Renderer

我需要的第一个功能是一个网页渲染器，能够在没有后端或服务器的情况下把 PlantUML 转换成图表。这得益于库 。

虽然它是网页渲染器，但仍然需要网络连接，因为 CheerpJ 运行时是从互联网加载的。未来我可能会把 CheerpJ 加载器部署到本地。

Back‑End / (Java) Server Renderer

网页渲染器速度较慢，正如我的第一次直播所示： 。
它也没有显示语法错误，导致调试困难。

多亏了 ，后端渲染成为可能，语法错误现在会以人性化的图片形式展示。

目前 PlantUML 编辑器支持两种渲染器：网页渲染和服务器渲染。

File Management System

图表是私有的，因为它们通过 Web Storage API 存储在浏览器本地。

Share as URL

图表默认是私有的，除非你将它们以 URL 形式分享。此功能不需要服务器；它使用 PlantUML 的编码/解码技术。

Responsive Layout with Mobile Tabs

如果用户收到共享的 URL 并在移动设备上打开，编辑器能够无缝工作，具备移动友好性。

Preview Panel (Light/Dark) Theme Toggler

你可以在代码编辑器和图表预览之间切换明亮和暗黑主题。

Multi‑tab Support

在同一浏览器的不同标签页中同时处理多个图表。每个标签页都有自己的 PlantUML 代码和预览图片，文件管理系统会跟踪所有内容。欢迎自行尝试！