はじめに
みなさんこんにちは！Amazon CodeCatalyst(以降はCodeCatalystと記載します)のソースリポジトリにてドキュメント管理をする中で、図・画像のMarkdown表示機能についてわかったことをご紹介していきたいと思います。
CodeCatalystとは
AWS公式が提供するドキュメントによると、CodeCatalystについて以下の記載があります。
Amazon CodeCatalyst は、ソフトウェア開発プロセスに継続的インテグレーションとデプロイの方法を採用するソフトウェア開発チーム向けの統合サービスです。 CodeCatalyst 必要なツールがすべて 1 か所にまとめられています。継続的インテグレーション/継続的デリバリー (CI/CD) ツールを使用して、作業の計画、コードの共同作成、アプリケーションの構築、テスト、デプロイを行うことができます。
ソフトウェア開発に必要な機能を備えており、タスクの管理・ソースコードの管理・ワークフローの実行等が可能となっています。
図・画像のMarkdown表示機能についてわかったこと
それでは図・画像のMarkdown表示機能についてわかったことを紹介していきます。今回は以下2点について確認しました。
- Mermaid形式の図の表示
- 画像の表示
Mermaid形式の図の表示
Mermaid形式の以下図をCodeCatalystで表示してみます。
```mermaid
graph LR
A-->B-->C-->D
```
GitHubなどのMermaidに対応するMarkdown表示機能では次のように図として表示されます。
一方、CodeCatalystの画面は以下になります。図は表示されず、コードがそのまま表示されました。
画像の表示
画像の表示はインターネット上の画像を参照する場合とリポジトリ内の画像を参照する場合で結果が異なりました。
以下画像をCodeCatalystにて表示してみます。
引用元
インターネット上の画像を参照する場合
引用元のサイトより画像のリンクを取得し、ドキュメント内で参照します。
サンプルコードは以下になります。
# インターネット上の画像を参照する場合
CodeCatalystの仕組みを以下に示します。
CodeCatalystの画面は以下になります。インターネット上の画像を参照する場合は、画像が表示されました。
リポジトリ内の画像を参照する場合
同じ画像をリポジトリ内に保存し、ドキュメント内で参照します。
サンプルコードは以下になります。
# リポジトリ内の画像を参照する場合
CodeCatalystの仕組みを以下に示します。
CodeCatalystの画面は以下になります。リポジトリ内の画像を参照する場合は、画像が表示されませんでした。
現状のCodeCatalystで図・画像をプレビュー表示するためには、一度インターネット上に画像を公開し、そのリンクを参照するなどの回避策をとる必要がありそうです。
まとめ
いかがだったでしょうか。今回はCodeCatalystのソースリポジトリにおける図や画像のプレビュー表示についてご紹介しました。この記事が誰かのお役に立てますと幸いです。
- AWS は、米国その他の諸国における Amazon.com, Inc. またはその関連会社の商標です。
- その他、記載されている会社名および商品・製品・サービス名は、各社の商標または登録商標です。