Rails と人魚の話/rails-and-mermaid

1. Rails と人魚の話 森塚 真年(@sanfrecce_osaka) 2024/04/04 Omotesando.rb#96 #omotesandorb
2. 自己紹介 森塚 真年 @sanfrecce-osaka or @sanfrecce_osaka from: 大阪府枚方市 趣味: コミュニティ・勉強会 Machida.rb ・Hirakata.rb 株式会社エンペイ Ruby3.2/Rails7.0 Node.js v18/Vue.js 3.3/Vuetify 3.4 最近 Layout Cop を全部ドキュメント読んで設 定した
3. 本編
4. ER 図
5. 何使ってますか？
6. 選択肢 gem gem 以外 DB クライアント(e.g. table plus) rails-erd erd rails_erd_mermaid rails-mermaid_erd plant_erd
7. そもそもの要件 graphviz への依存がない エンジニア以外も触れるようにしたい エンペイではエンジニア以外も SQL を書いて いる
8. 選ばれたのは
9. rails-mermaid_erd でした
10. rails-mermaid_erd 導入の手順 Gemfile に gem "rails-mermaid_erd", group: :development を追加 bin/rails mermaid_erd Rails のER 図をMermaid で柔軟に生成できるGem を 作りました Repository Demo Page
11. できること ER 図の各種エクスポート・コピー Mermaid ・Markdown ・SVG ・PNG リレーションのプレビュー リレーションのコメントの表示 カラムの非表示 キーの表示 カラムコメントの表示 表示対象の絞り込み
12. できないこと テーブルのコメントの表示 mermaid のコメントとしてなら吐けるので PR 出す予定
13. 裏側の仕組み 1. で model の 定義から Hash を組み立て 2. の window.SCHEMA_DATA に 1 で組み立てた Hash を json に変換して bind 3. ファイルとして出力(JS 部分は cdn の Vue を使っ ているので html ファイル単体で動く) RailsMermaidErd::Builder.model_data templates/index.html.erb
14. ところで
15. そもそもの要件 graphviz への依存がない エンジニア以外も触れるようにしたい エンペイではエンジニア以外も SQL を書いて いる
16. 🤔
17. そうだ！
18. migration に hook させて git で 管理しよう！ %w(db:migrate db:schema:load).each do |task| Rake::Task[task].enhance do Rake::Task['mermaid_erd'].invoke if Rails.env.development? end end
19. あとはこうして models/documentation.rb module Documentation; end
20. こうして ActiveAdmin.register Documentation do actions :index controller do def index redirect_to admin_documentations_erd_path end end end
21. こうして config/routes.rb namespace :admin do namespace :documentations do resource :erd, only: :show, format: 'html' end end
22. こうじゃ！ config/mermaid_erd.yml result_path: app/views/admin/documentations/erds/show.html.erb
23. 最後に rails-mermaid_erd べんり migration に hook させて更新して git 管理すれば view として扱える activeadmin 等の管理画面の view ファイルとして 扱えば認証も解決 ( 今後は) 社内で ER 図 の勉強会 をやっていき！
24. ご清聴 ありがとうございました