コーディング時に「アノテーションコメント」を使ってコードを見やすく管理する

アノテーションコメントとは
コードを書いていく上で「適度にコメントを残しておくと、読みやすいコードになる」とよく聞きます。
ただ、コメントの数が多くなってくると「コードの説明をしているコメント」「あとでしたいタスクをメモ書きしているコメント」「なにか理由があって変更してはいけない場所を示している注意書きコメント」などさまざまな種類のコメントが出てきます。
下記のように先頭に「タグ」のような記述を追加しておくと、「そもそもこのコメントは何の目的で残しているのか?」が分かって、把握しやすくなります。
// TODO: あとで引数を追加するまた、あとからファイル検索をしたり拡張機能を使うことで、残タスクの把握もできます。
このように先頭にタグを付けるコメントを「アノテーションコメント(注釈コメント)」と呼びます。
使うタグ名を決めておかないと逆に見にくくなる
たとえば「TODO:」「TODOS:」「TASK:」「CHECK:」のように似たような役割のタグが混在していると、逆に混乱してしまします。
使う数はできる限り少なくして、統一しておかないとあとで検索するときにも不便です。
アノテーションコメントを便利に使うためのVisual Studio Code拡張機能
Visual Studio Codeの拡張機能を使えば、アノテーションコメントをさらに便利に使えます。
Better Comments
Better Commentsはアノテーションコメントに装飾を追加できる拡張機能です。
すべて同じ色でもタグのおかげで把握はしやすくなっていますが、色分けされることでさらに把握しやすくなります。
ミニマップにも表示されますし、コードを流し見するときにも目に付きやすくなります。
Todo Tree
Todo Treeはアノテーションコメントの一覧を表示できる拡張機能です。
「TODO:」はあとから行うタスク用のコメントですが、これを一覧で表示させることで残タスクがすぐ把握できます。
アノテーションコメントの色分けもできますが、Better Commentsの方が機能が多いので、色分けは片方に集約した方が管理しやすいです。



Local by FlywheelでWordPressのローカル開発環境構築のハードルが一気に下がる
iTerm2でさらに細かい機能の設定ができる環境設定の「Advanced」タブ
gulp-sass 5の「does not have a default Sass compiler」エラーを解消する
JavaScriptのforEach内で「continue」や「break」のような動作をさせる方法
アイコンフォントをPCにインストールしている場合は、コーディング後の確認に注意
SourceTreeで環境設定の「カスタムアクション」「アップデート」「高度な設定」が選択できない
W3 Total Cacheをレスポンシブデザインのテーマで使用する時の注意ポイント!!【WordPress】
Visual Studio Codeの設定を複数の端末間で同期する「Settings Sync」機能の使い方
Google Maps APIをローカル開発環境で使用するときの制限設定方法
Google Chromeでinput要素の補完機能を使うと背景に色がついてしまう問題
AirPodsで片耳を外しても再生が止まらないようにする方法
MacのKeynoteにハイライトされた状態でコードを貼り付ける方法
iTerm2でマウスやトラックパッドの操作を設定できる環境設定の「Pointer」タブ
DeepLで「インターネット接続に問題があります」と表示されて翻訳できないときに確認すること
Ulyssesの「第2のエディタ」表示を使って2つのシートを横並びに表示する
AlfredでKarabiner-Elementsのプロファイルを切り替えるWorkflowの作り方
瞑想をするならApple Watchにも対応している「Insight Timer」がオススメ!
Google Maps APIでマップの見た目をカスタマイズする方法
記事内の画像にマウスホバーした時に画像が半透明になる意味はあるのか?
Finderで選択したフォルダをターミナルで開く方法まとめ
Bartender 4のShow for Updates機能を使って、AirPodsに接続しているときだけ「ToothFairy」のアイコンを表示させる
Google Chromeでタブのグループ化機能を使う方法
カーソルハイライトや入力したキーの表示など、デモに便利な機能が使える「Mouseposé」
WordPressでショートコードを作成する方法
Gitで1行しか変更していないはずのに全行変更した判定になってしまう