asciinemaでコンソール操作を記事に貼り付け

概要

asciinema はターミナルの操作をテキストベースで録画し、軽量な .cast ファイルとして保存・再生／埋め込みできるツールです。動画ではなくテキストなのでファイルサイズが小さく、Qiita やドキュメントへの埋め込みも簡単に行えます。

ここでは紹介しませんが、aggというツールでgifへの変換も行えます。詳細は公式ページをご覧ください。

asciinema公式/Getting started

---

インストール

Ubuntu / Debian系

sudo apt update
sudo apt install asciinema

macOS（Homebrew）

brew update
brew install asciinema

汎用（pipx）

pipx install asciinema

---

録画の手順

1. ターミナルで録画開始

   asciinema rec session.cast
   

2. 通常の操作を行う
3. 録画終了は Ctrl+D もしくは exit

---

録画ファイルの公開

1. asciinema.org にアップロード（初回のみ認証が必要）

   asciinema auth
   asciinema upload session.cast
   

2. アップロード後に表示される URL（例：https://asciinema.org/a/12345）を開く
   Macなら⌘+URLクリック

---

Qiita への埋め込み

Shareをクリックすると下部にあるEmbed the playerセクションに以下のようなスクリプトがあるので、これを記事中に貼り付けるだけでプレイヤーが表示されます。

<script src="https://asciinema.org/a/4ADo6PVjhi0kJtSd2vBKPYejo.js" id="asciicast-4ADo6PVjhi0kJtSd2vBKPYejo" async="true"></script>

---

まとめ

1. パッケージマネージャー or pipx でインストール
2. asciinema rec で録画、Ctrl+D で終了
3. asciinema upload
4. <script> タグを Qiita に貼り付けて完了

これだけで、Qiita 記事内にターミナル操作のライブ記録を埋め込めます。

注意：プロンプトが出てしまうので、ユーザー名やホスト名など重要な情報を録画して公開しないようにご注意ください。