draw.io (diagrams.net) の細かいテクニック - Qiita
みんな大好き draw.io (diagrams.net) の細かいテクニックです。 ちなみに、2020年2月あたりから、セキュリティ上の理由でサイトのドメインを diagrams.net に名称変更し始めているので、アクセス先はこちらに変更したりしましょう。 非圧縮XML形式のデフォルト化 ダイアグラムをファイル保存すると、デフォルトでは圧縮されたXMLになっていますが、これだと差分の確認・バージョン管理がしづらいです。 メニューの「拡張 (Extras)」->「圧縮 (Compressed)」のチェックを外すと非圧縮形式になるので、新しいファイルを作るたびにこれを実行しても良いのですが、忘れないように非圧縮XML形式をデフォルトにすると良いでしょう。 メニューの 拡張 (Extras) -> Configuration で開く設定ダイアログに以下を記載すると、アプリの再読み込み以降は非
【12/24にGitLab対応!】テキストで自在に「描く」- KrokiではじめるDiagram as Code - Qiita
【12/24にGitLab対応!】テキストで自在に「描く」- KrokiではじめるDiagram as CodeMarkdownGitLabasciidocVisualStudioCodekroki これは、 NTTコミュニケーションズ Advent Calendar 2020 25日目の記事です。 昨日は @tnoyama さんの「TEKTONとArgoを比較してみた」でした。お楽しみいただけましたか？ Krokiとは 本記事では、テキストからの図表生成ツール Krokiを紹介します。最新バージョンは0.9.0です。 公式docs: Kroki! GitHub: yuzutech/kroki: Creates diagrams from textual descriptions! 概要 Kroki!は、テキストから統一的なAPIで、 UML C4 データ可視化 その他図表 を、PNG,
AWS アーキテクチャー図 構成図を自動生成するソリューションを紹介します | DevelopersIO
こんにちは。 ご機嫌いかがでしょうか。 "No human labor is no human error" が大好きなネクストモード株式会社 の吉井です。 今回は AWS Perspective を紹介します。 Developers.IO を読んでくださっている方々はシステム担当者(アプリもインフラも)が多いと想像しています。 みなさまは詳細度、解像度の高低はあれどアーキテクチャー図を作成していることと思います。 個人的な意見ですが、作成ドキュメントの弱点は ”更新されないことがある” ことにあると考えています。 変更管理を細かく行っている企業ならそんな心配は要らないかもしれませんが、大抵の場合システム稼働日数が増えれば増えるほどドキュメントは置いてけぼりになりがちです。 それはある意味理解ができてドキュメントは無くてもシステムは動くので、システム構成変更時のドキュメント更新の優先度が下
VSCodeがドローツールになるDraw.io Integrationがいい感じ！macOSでのワークアラウンドを紹介
Draw.ioというオンラインのドローツールがIDEのVisual Studio Code（VSCode）上で使えるようになったという報せを聞き及び、使ってみました。 具体的にはDraw.io IntegrationというExtensionがリリースされ、それをインストールするとDraw.ioがVisual Studio Code（VSCode）上で使えるようになります。 筆者は専らmacOSを使っていますので、macOS用のVisual Studio Code（VSCode）にDraw.io Integrationをインストールして使ってみたところ、Draw.io Integrationに関連づけられる.drawio、.dioといった拡張子のファイルを作成してもDraw.io Integrationが起動してこない。 ひょっとして機種依存の問題かとWindows版のVisual Stud
AWS 構成図を PlantUML で描画できる『AWS-PlantUML』の紹介 - サーバーワークスエンジニアブログ
技術4課の多田です. AWS 環境の構成図を書く機会で PowerPoint や Cacoo 等のサービスを使うことがあると思います.作図もコードで制御する方法もないかと思い調べてみたら,「AWS-PlantUML」というツールがありました.今回はこのツールを使って作図する方法と所感を書いていきます. milo-minderbinder/AWS-PlantUML 「AWS-PlantUML」とは 「AWS-PlantUML」とは,PlantUML 形式で AWS 構成図を書くためのツールになります.PlantUML の実行環境は調べればたくさん出てきますが,僕は普段 Visual Studio Code(以下,vscode)を使うため vscode で使う環境をセットアップしました. 参考URL PlantUML qjebbs/vscode-plantuml 「AWS-PlantUML」を
図を継続的に管理するためのベストプラクティス - WonderPlanet DEVELOPER BLOG
こんにちは。サーバエンジニアの桐島です。 今回は、図（フローチャート、シーケンス図など）をチームで継続的に管理するための個人的なベストプラクティスを紹介したいと思います。 図の有用性と、継続的な管理の必要性 図って便利ですよね。 以下の様な図があると、チーム内での認識合わせを正確に素早く行うことができます。 サーバ構成図 アプリ-サーバ間処理のシーケンス図 APIプログラムの複雑なロジックのフロー図 ER図 ただ、プロジェクトのドキュメントに含まれる図がすべてメンテナンスされ、最新の仕様と図がマッチし続けているケースは少ないのではないでしょうか。 図は有用なのですが、管理し続けなければその有用性を失い、いずれ削除される運命にあります。 図の継続的管理への課題 では、図が管理されない原因は何でしょうか。 具体的なケースを幾つか挙げてみます。 再編集できないフォーマットで図が作られている ホワ
drawio-desktop - Electron製。draw.io公式のドローツール MOONGIFT
ElectronでWebサイトをラッピングする系統のソフトウェアはとても多いです。限定されたセキュリティ範囲で使えるのは便利ですが、結局のところ単なるガワアプリでしかないという印象があります。 そんな中、drawio-desktopは違います。draw.ioがそのままデスクトップアプリケーションになったようなソフトウェアです。 drawio-desktopの使い方 既存の図を開くのか、新規作成するのか選択します。 新規作成の場合はテンプレートから選択します。 例えばこんな図をベースにできたりします。 パーツは多数提供されています。 パーツ同士を線で結んだりできます。 UML系のパーツもあります。 回転したりするのも簡単です。 drawio-desktopで作られた図はエクスポートしたり、画像タグで埋め込んだりできます。その際にdraw.ioが使われるのかと思いきや、dataURIで出力され
自律分散監視システムとそれを利用したネットワークグラフ可視化への挑戦 - Hatena Developer Blog
はじめに はてなサマーインターン2017の大規模システムコースの成果報告をします。 今年の大規模システムコースではメンターのid:masayoshiさんとid:y_uukiさんの下、自律分散監視システムとそれを利用したネットワークグラフの可視化に取り組みました。自律分散監視システムでは単純なクラスタリングによる死活状況の確認だけではなくアプリケーションレベルの疎通確認を行えるものを実現しました。またどのようにしてクラスタを形成するかという問題に取り組む内に、サービス間のネットワーク上のつながりを取得できるようになり、その情報でサーバー間の関係性の可視化を行いました。この記事では、それらの詳細を説明します。 はじめに 自律監視システムの実現 中央サーバー型の監視システム 自律分散監視システム アプリケーションレベルの相互監視 どうやってクラスタを形成するか？ 実験 ネットワークグラフの可視化
Atom と PlantUML で快適シーケンス図駆動開発ライフ | DevelopersIO
サーバーサイド開発担当のエンジニアが「設計と実装を進めようとしている」という背景で話を進めます。 PlantUMLは強い 「認識合わせ」という名目でホワイトボードに図を書いて会話することがよくあります。共通言語で会話してあいまいなところを少なくしたら、マネージャーも安心感がありますし、プログラマも自分がやるべきことに集中できますね。 …3日経ちました。あのとき描かれていたホワイトボードの図のとおりに、実装することになりました。認識の齟齬をなくしてくれた貴重な図です。写真に撮りました。どこに保存してたっけ。やっぱり変更したくなったらどうしましょう。またホワイトボードに書き起こす？DRYじゃないですねえ。 そこで、UML図 が登場します。表現したい図を電子データで作成、保存できて、あとで見るときも役に立ちますね。が、しかし、UML図はそれはそれでやや手間がかかるところもあります。作図を助けてく
Markdown風テキストでダイアグラムが描けるWebツール - Qiita
MarkDownDiagram Markdown風のテキストで、ER図やブロックダイアグラムのようなチャートを描けるツールです。 こちらにインスパイアされて、もうちょっと汎用的にダイアグラムを描けるツールを作りました。 もう保守されない画面遷移図は嫌なので、UI Flow図を簡単にマークダウンぽく書くエディタ作った 特徴としては Webブラウザのみでローカルで動作 配置はマウスでドラッグして編集できる CSSで色や装飾を制御可能 といったあたりです。 githubからclone/ダウンロードして使えます。 オンラインで試すのはこちらでどうぞ。 ローカルでブラウザのみで動作します。index.htmlをブラウザで開いてください。 Chrome推奨ですが、Safari,Firefoxでも動作します。タッチIFは未対応。 機能 テキストでブロックを記述し、ブロック間を線で繋ぐ描画 ブロックをマウ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Draw.ioで作った図を、Office系とかGoogle Workspace系で編集できる状態でインポートできないかな
Embed Diagrams