Record and share your terminal sessions, the right way

그냥.. 이미지에요

가끔 기술 블로그들 보면 동영상으로 터미널 화면을 설명하는데, youtube나 vimeo가 아니 화면에 복사/붙여넣기가 가능한 영상을 올리시는 분들이 있습니다. asciinema라는 녹화 프로그램&공유서비스인데요, 가끔 요긴하게 쓰일 것 같아 글로 작성해둡니다.

생긴지는 좀 된 서비스같네요. 리눅스/맥 환경만 지원하며 apt, brew 등으로 간편하게 설치할 수 있습니다.

Linux

#> apt-get install asciinema

Macos

#> brew isntall asciinema

옵션을 보면 .. rec, play, cat, upload, auth 정도로 옵션을 주어서 녹화할껀지, 볼껀지, 업로드할껀지 등을 고를 수 있습니다.

#> asciinema
usage: asciinema [-h] [--version] {rec,play,cat,upload,auth} ...

Record and share your terminal sessions, the right way.

positional arguments:
  {rec,play,cat,upload,auth}
    rec                 Record terminal session
    play                Replay terminal session
    cat                 Print full output of terminal session
    upload              Upload locally saved terminal session to asciinema.org
    auth                Manage recordings on asciinema.org account

optional arguments:
  -h, --help            show this help message and exit
  --version             show program's version number and exit

example usage:
  Record terminal and upload it to asciinema.org:
    asciinema rec
  Record terminal to local file:
    asciinema rec demo.cast
  Record terminal and upload it to asciinema.org, specifying title:
    asciinema rec -t "My git tutorial"
  Record terminal to local file, limiting idle time to max 2.5 sec:
    asciinema rec -i 2.5 demo.cast
  Replay terminal recording from local file:
    asciinema play demo.cast
  Replay terminal recording hosted on asciinema.org:
    asciinema play https://asciinema.org/a/difqlgx86ym6emrmd8u62yqu8
  Print full output of recorded session:
    asciinema cat demo.cast

이런 형태로 .cast 파일로 저장할 수 있습니다.

#> asciinema rec test.cast

(-t 옵션으로 타이틀만 지정해줄 시 asciinema 홈페이지로 업로드하여 cdn 처럼 사용할 수 있습니다. )

보통은 asciinema 사이트로 올리거나 .cast 파일 저장 후 따로 올려서 사용하는데요, 어렵지 않습니다.

cast 파일은 asciinema player로 재생이 가능하며 공식 git에서 플레이어 js/css를 배포하고 있습니다. 웹 페이지에서 로드해준 후 아래와 같이 태그 형태로 불러주면 잘 로드됩니다.

js, css 다운로드 : https://github.com/asciinema/asciinema-player/releases

<asciinema-player src="/cast/xxxxxx.cast"></asciinema-player>