VSCodeでMermaidを扱う為の便利な拡張機能あれこれ - Qiita
はじめに Mermaid とは、コードベースでガントチャートやフロー図などの作図が可能となるJavaScriptのライブラリです。 2022年にGitHubやQiitaでもサポートされるようになり、Markdownの中に専用のコードを書くことで図の挿入が出来るようになりました。 Include diagrams in your Markdown files with Mermaid 【Mermaidの紹介】Qiitaでダイアグラム・チャートが簡単に書けるようになりました！ 例えば、QiitaでMermaidを使ってガントチャートを書いてみると以下のようになります。 ※スケジュールは架空のものです コードを展開 ```mermaid gantt title ○○サービススケジュール dateFormat YYYY-MM-DD section ﾏｲﾙｽﾄｰﾝ 実装 : done, milest
mermaidチート表｜ききよ
あちこち調べまわるのに疲れたので自分用に作成します。 (7/10更新[途中上げ) mermaidとはmd(マークダウン)形式の時、図が描けるやつ(ざっくり) githubがこれに対応したので、readme.mdが画期的になったとかなんとか。 左に打ち込んだコードが右みたいな図になる mermaidの導入VScodeの拡張機能ですべて済む。 Markdown Preview Mermaid最低限これだけあればおｋ。 Markdown Preview Enhancedも加えるとGithubとかmermaid公式の色合いになるぞ。 書き方.mdに書くのが前提。 ```mermaid 【この間に書く】 ````(Shift+@)で上のように囲むとその間だけその言語対応になる。 場合から使い分けるmermaid いくつか種類があるので、使い分けに。 なお、 ```mermaid ```は省略する。
簡単にできるDDDのモデリング - ドメイン駆動設計 - little hands' lab
DDDではよく「モデリングが重要だ！」と言われますが、どのようにモデリングすればいいのかがわからず、一歩を踏み出せないことは多いのではないでしょうか。 そんな方のために、本記事ではDDDにおいてシンプルで成果が出しやすいモデリング手法について紹介します。 (本記事は、YouTube動画「10分でわかるドメインモデリング」の内容をもとにした解説記事です。) DDDの目的 DDDの目的から確認しましょう。 DDDの目的は2つ。 ①機能性を高めること これは、役に立つものを作ること、言い換えると「作ったけど使えない」を避けることです。 そのために、ドメインモデリングを行い、ソフトウェアを適用して役立てようとしている現実世界の領域(これの領域をDDDでは「ドメイン」と呼びます)について理解を深め、解決策を検討することを目指します。 ②保守性を高めること これは、長期間開発しても機能拡張が容易であり
GitHubで使えるようになった Mermaid の便利なところ
はじめに GitHub で Mermaid がサポートされました。 Mermaid は図やグラフを描画するの独自の記法を持ちます。 その記法を Markdown のコードブロック中に記述するだけで図を描画できるのが便利です。 ...便利なのですが、記法が独特なことや機能が豊富なことから、とっつきにくいところもあります。 弊社[1]では みんチャレ 開発の情報共有ツールとして esa.io を活用しており、 esa も Mermaid をサポートしており以前から活用していました。 この記事では、私がこれまでに活用してきた中から特に便利だと感じた機能を紹介します。 ちなみに Zenn も Mermaid をサポートしているため図を描画できます。 Gantt ガントチャートです。 私が Mermaid を使いたいと思ったきっかけの機能です。 まずは、一番シンプルな例を書きます。 gantt Co
VS Codeを極める！ MarkdownやGitにもオススメの拡張機能9選 - ICS MEDIA
「Visual Studio Code（略称：VS Code）」はMicrosoftが提供している無償で高機能なエディターです。標準でも十分な機能は備わっていますが、拡張機能をインストールすることで、より使いやすく自分にあったエディターにカスタマイズできます。 前回の記事では、「HTMLコーダー」「フロントエンジニア」に役立つ拡張機能を紹介しました。本記事では、開発者全般の方に役立つ拡張機能を紹介します。 エディターを強化する拡張機能 1. Clipboard Ring テキストを「コピー」や「切り取り（カット）」したものを「貼り付け（ペースト）」する場合に、この拡張機能を入れることで複数件の内容を記憶できます。ctrl+shift+v（⌘+shift+v）を押すごとに過去の情報に切り替えられます。デフォルトでは10件の情報を記憶できますが、設定を変更することで記憶する件数を増やすことも可
Diagramly - Draw Diagrams Online
Flowchart Maker and Online Diagram Software draw.io is free online diagram software. You can use it as a flowchart maker, network diagram software, to create UML online, as an ER diagram tool, to design database schema, to build BPMN online, as a circuit diagram maker, and more. draw.io can import .vsdx, Gliffy™ and Lucidchart™ files . Loading... Please ensure JavaScript is enabled.
Redmine で技術仕様書を書こう
はじめまして！ 株式会社 Aiming の土井です！ エンジニアをやっております！ 今回の開発者ブログでは、情報共有ツールとしての UML の活用方法について、現場での取り組みをご紹介させていただければと思います！ 技術仕様書の“図” どうやって書いてますか？ 株式会社 Aiming では、プロジェクトの Wiki やバグトラッキングに Redmine をメインに使っています。みなさんも既にご存知だったり、実際にバリバリ活用されていることとおもいます。 また、企画仕様書、技術仕様書などは Redmine の Wiki やエクセルに代表されるオフィススイート等を活用して作成しますが… 図の表現を求められるような仕様書を作る時に、どうやって作成しようか悩んだことはありませんか？ 標準ペイントソフトで頑張って作成 オフィススイートに含まれる、ドローツールを使って図を作成、画像吐き出し というケー
UMLの手軽で有効な利用方法
1. はじめに オブジェクト指向モデリング言語として誕生したUML（Unified Modeling Language）は、今日、ソフトウエア業界で広く利用されています。しかし、読者の中には「UMLを使ったことが無い」または「使ってみたが効果が無かった」という方もいらっしゃるのではないでしょうか。 そこで、本連載では、UMLの導入に敷居の高さを感じている方を対象に、UMLを用いたモデル（以降、UMLモデル）の、手軽で有効的な利用方法を、筆者の経験を交えて紹介します。 なお、UML仕様に基づいた厳密で正確なモデルの作成方法や、モデル駆動開発の方法といった、敷居が高いトピックについては解説しません。もっと根本的なUMLモデルの活用方法を紹介します。 2. モデリングとモデルのメリット 2.1. コミュニケーション・ツールとしてのUML UMLモデルについて解説する前に、そもそも「モデリング」や
【連載】ゼロから始めるUMLモデリング講座 | エンタープライズ | マイコミジャーナル
Copyright (C) Mainichi Communications Inc. All rights reserved. 掲載記事の無断転載を禁じます
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Real World PlantUML
Does software modeling pay? - Empirical studies in UML (presentation)