CodeTourでCodeのTourを作ってみた
使ってみようと思いながらなかなか手をつけていなかったCodeTour。GWなので使ってみることにしました。
CodeTourって?
CodeTourはVSCodeのExtensionで、コードのウォークスルーをVSCodeでそのまま作れるツールです。文字で表すとわかりづらいのですが、以下の場合に特に活躍しそうなツールです:
- 新しくプロジェクトにJoinした新人にコードを理解してもらう
- 自分のためにコード内にメモを残しておく
NotionだったりConfluenceだったり、いろんなツールを使ってコードに関するナレッジを残す工夫を人それぞれやっていると思うのですが、「コードそのものに残せたら良いのに...」と思ったことがあるはずです。そんなときに使える優れものです。
この記事では基本的な使い方だけ紹介しますが、ExtensionやGitHubのリポジトリを見たら細かい機能まで説明が載っているのでぜひ読んでみてください。
さっそく使ってみた様子
百聞は一見に如かずとやらなので、一連の流れを動画に収めてみました。(書いてるコメントはしょぼいですけど、雰囲気は伝わるはずです)
基本的な使い方
使い方に関しては本家のページが詳しく載っているので、ここではどういうときに何を使うと良さそうかというのを紹介しておきます。
Tourを作る
Tourを開始する
Tourを保存する
リポジトリ内で作ったTourは .tours
ディレクトリに ツアー名.tour
ファイルとして以下のキャプチャのように保存されます。これをリポジトリ管理下に置いておくのが基本的な運用方法になりそうです。
が、必ずしもリポジトリ配下に置けるとは限らないですし、ちょっとしたメモレベルのものを作っておきたいと思うかもしれません。そんなときにTourを外部にエクスポートしておくこともできます。
Tourを開く
リポジトリ内のTourは自動でVSCodeで開かれるのですが、リポジトリ外のTourを開くこともできます。しかも、URLから開くこともできます。ちょっと何を言っているかわかりづらいと思うので、これも動画でとってみました。
何がすごい(?)かというと、ローカルにTourのコードが無くてもこのTourが再生できるということです。動画で使っていた .tour
のファイルを見るとわかるのですが、なんとTourで使われたコードがそのままJSONに入っているので、コードが無くてもTourが再生できるのです。
ory_keto_relation-tuple_parse.tour · GitHub
他にすごそうな機能
基本的な機能は上で述べた通りですが、他にもすごい機能があります。
- Tour同士をリンクさせることができる(Linking Tours)
- 状況に応じてTourを表示するか否か、JavaScriptで制御できる(Conditional Tours)
- デフォルトで
isLinux
,isMac
,isWindows
という変数が用意されてるので、プラットフォーム別に表示するTourを容易に制御できる
- デフォルトで
- Tourからシェルコマンドを実行できる(Shell Commands)
- Tourをコードとどのように紐付けるか指定する(Versioning Tours)
- TourをBranchに紐付けるのか、Commitに紐付けるのか、Tagと紐付けるのか等指定できる(コードとTourの同期をとるためにかなり重要)
- コードとTourの同期が取れてなさそうならCIで検知してもらう(Maintaining Tours)
おわりに
- CodeTourを使ってみた
- コードベースへのオンボーディングで重宝しそう
- コードに対して自分のメモ用としても強力
- メンテナンス性についてもかなり考慮されている
これからがっつり使っていって、CodeTour力を高めていきます!