開發契機：某個週一早晨的絕望
「有人知道這個系統的全貌嗎？」
在週初的會議上，我拋出的這一問，換來的是全體團隊成員的沈默。
我們手頭上有的，是一個經過多年增補、變得如同「陳年老滷汁」般龐大的資料庫。最新的 ER 圖哪裡也找不到，唯一正確的答案只有正在運作中的「代碼 (DDL)」。
任務內容是逐一在編輯器中打開資料表定義，並在腦中構建關聯性。
「啊，原來這不是透過 user_id 而是用 owner_id 連接的啊……」每當有這種發現時，我都感覺到自己身為工程師的高貴時間正在融化消失。
「要是貼上 SQL 就能瞬間產出美觀的 ER 圖就好了。」
抱著這種想法，我試著尋找現有的工具。但有的工具要求「將 SQL 上傳到伺服器」，存在安保疑慮；有的則需要「安裝專用軟體」，不符合我想隨開隨用的需求。
身為工程師的自尊，絕不允許我將具高度機密性的專案設計資訊，傳送到來路不明的伺服器。「要一個 100% 安全、即刻可用，且完全在瀏覽器端完結的 ER 圖生成器。」 決定打造這個連我自己都最想要的工具，便是 SQL to ER 圖 轉換工具 開發的起點。
技術挑戰：在瀏覽器這個「孤獨環境」中的戰鬥
不使用強大的後端函式庫，僅憑瀏覽器上的 JavaScript 進行 SQL 解析，是一連串比想像中還要繁瑣的作業。
1. 與「SQL 方言」永無止境的追逐戰
SQL 存在著 MySQL 或 PostgreSQL 等各種「方言」。
起初我自視甚高地認為「CREATE TABLE 語句大概都大同小異吧」，但一旦開始實作，便發現有如山一般的模式需要考量：資料欄定義的精細寫法、行內撰寫的約束條件等等。
不斷修改正規表示式並進行測試，接著又在另一種模式的 SQL 中出錯。
在反覆循環中，我逐漸開發出一個能「理解 SQL 的心情」的解析器 (Parser)。
2. 救世主 Mermaid.js
如何將解析出的資料轉化為「圖表」？解決這個難題的是 Mermaid.js。
將工程師在 Markdown 中常用的這款工具作為引擎，完成了一條「SQL → 中間資料 → Mermaid 語法 → SVG」的簡潔轉換線。
erDiagram
USER ||--o{ POST : writes
USER {
string username
string email
}拜此機制所賜，使用者不僅能將圖表保存為圖片，還能複製生成的「代碼」直接流用到 GitHub 的文件中，產生了額外的便利性。
對安全性的「執著」
開發這款工具時最無法妥協的，就是「資料絕不跨出瀏覽器一步」。
開發過程中，曾多次產生「在後端處理會比較輕鬆吧」的誘惑，但每次我都會停下腳步，心想「那不是我自己想用的工具」。
不產生通訊。因此，您可以毫不猶豫地貼上公司機密的 DML 或 DDL。
我相信這份安心感，正是工具本質上的價值。
結語
SQL to ER 圖轉換工具，是源自於我個人「好麻煩」這種情緒的產物。
開發者原本應該面對的，不是文件的潤稿，而應該是更好的系統設計。
如果這款工具能送到因為「沒有設計圖」而感到徬徨的人手中，成為一束光芒，那對我而言是再高興不過的事了。
來吧，貼上手邊的 SQL，開始為您的設計進行「對答案」吧。