メインコンテンツまでスキップ

Productivity

便利ツールやショートカットなど生産性向上に役立つ情報をまとめます。
慣れないかもしれませんが頑張ってツールやショートカットを使うクセをつけると効率が上がります。
ここでは以下想定のノウハウをまとめています。

  • WinPCでWebアプリを開発するエンジニア
    • PCはWindows
    • ブラウザはChrome
    • IDEはVSCode
    • ターミナルはWindows Terminal(中身はPowerShell)
    • その他、File ExplorerやZoomなど多用

検索ワードはコピペで

検索の際に単語ワードのソースが手元にある場合は、必ずコピペで検索してください。
例えば以下のようなケースです。

  • 仕様書に記載している文言をコードで検索する(テーブル項目名、APIのエンドポイントなど)
  • エラー原因を調べるために、エラー発生箇所のファイル名を検索する、メソッド名を検索する。
  • Lintエラー原因を調べるために、Lintエラーの種類、メッセージを検索する。

自分で検索ワードをタイピングするのは極力避けてください。タイピングミスにより検索がうまく行かず時間を浪費するのを避けるためです。
また「思い込や勘違いで、そもそも別のスペルの単語を調べてしまう」ケースもコピペ検索なら防止できます。
検索によって不明点を調査・解決するという作業に加えて、「検索ワードにミスがないかを確認する」という余分な作業を増やさないためにも、検索ワードはコピペしてください。

コピーの際に役立つショートカットなどの方法を以下に記載します。

  • カーソル移動で選択する
    • Confluence・VSCode・Excelなどのエディタ上などでカーソルの移動を使って検索ワードを選択できます。
    • 検索ワードの直前にカーソルをあわせてShiftを押しっぱなしにして検索ワードの終点までカーソルを移動してCtrl+cでコピーします。
    • カーソル移動では以下と組み合わせると効率的に検索ワードを選択できます。
      • Ctrlを押しっぱなしにして単語区切りの移動
      • Homeで行頭までの移動
      • Endで行末までの移動
      • で一行下まで移動
      • で一行上まで移動
  • ダブルクリックで選択する
    • エディタの他に、カーソルがないブラウザでも使える方法です
    • 選択したい検索ワードをダブルクリックすると、単語が選択状態になります、これでCtrl+cでコピーします。
    • 選択範囲が検索ワードの範囲と異なる場合は、Shiftを押しっぱなしにして左右十字キー( )で選択範囲を調整できます。
    • 左右十字キーでの選択範囲調整は以下と組み合わせると効率的に検索ワードを選択できます。
      • Ctrlを押しっぱなしにして単語区切りの移動
      • Homeで行頭までの移動
      • Endで行末までの移動
      • で一行下まで移動
      • で一行上まで移動

ショートカット:Windows

Windowsの移動系

  • ディスプレイの切り替え:Win+p
    • 複製/拡張などの切り替えができます。
    • ノートPCをディスプレイに繋ぐ/外す行為は1日1回以上あると思います。またプレゼンなどの場合に素早くディスプレイを切り替えられると便利です。
  • 仮想デスクトップの切り替え
    • 単一ディスプレイの時に複数のデスクトップを使うことで作業効率が上がります。複数ディスプレイ使う場合はあまり使わないかもしれません。
    • Win+Ctrl+d:新規作成
    • Win+Ctrl+F4:削除
    • Win+Ctrl+:1つ右へ移動
    • Win+Ctrl+:1つ左へ移動
  • アプリの切り替え
    • windowsのタスクバーのN番目に表示されているアプリに切り替える(または新規で開く):Win+数字
      • 毎日使うアプリはタスクバーにピン留めしておくと、このショートカットが使えるので便利です。
    • アプリを切り替える:Alt+Tab
      • 複数のアプリを開いている時に、アプリを切り替えられます。
      • 2つのアプリを行き来する場合(仕様書を見ながら実装する場合など)、Alt+Tabを連続で押すとカチャカチャ切り替えられます。
  • アプリの表示位置の切り替え
    • 以下を組み合わせると複数ディスプレイ利用時でも、マウスを使うことなくアプリの表示位置を制御できます。特に1ディスプレイ目は自分だけに表示して、2ディスプレイ目を誰かに共有している場合などに便利です。
    • 1ディスプレイ内で
      • 全画面表示:Win+
      • 最小化:Win+
      • 右寄せ:Win+
      • 左寄せ:Win+
    • 複数ディスプレイの時に
      • 2ディスプレイ目に移動:Win+Shift+
      • 1ディスプレイ目に移動:Win+Shift+

Chrome

  • タブを切り替える:Ctrl+TabCtrl+Shift+Tab(逆方向)
  • タブを新規で開く:Ctrl+t
  • タブを閉じる:Ctrl+w
  • 直前に閉じたタブを開く:Ctrl+Shift+t
    • 間違えて閉じた場合に復活する時などに便利です
  • 別Windowsを開く:Ctrl+n
  • 別Windowsをシークレットウインドウで開く:Ctrl+Shift+w
    • ローカルストレージなどを使っている場合、シークレットウインドウで開くとログイン情報などが引き継がれないので便利です。
  • アドレスバーにフォーカス(検索):Ctrl+l
    • ブラウザの内部にフォーカスがある時に、アドレスバーにフォーカスを移動できます。今検索しているキーワードとは別のキーワードで検索したい時などに使います。
    • 検索ワードタイピング中に候補を選択:
      • 検索ワードを打っている途中に、Chromeがコンボボックス形式で候補を表示してくれるので上下キーで選択しEnterを押すと、タイピングの手間を省けます。
    • 検索を終了する:Esc
      • フォーカスを画面に戻して、画面スクロールなど別操作に戻りたい時に便利です
  • ページ内検索:Ctrl+f
    • 次の該当箇所にフォーカスを移動する:Enter
    • 前の該当箇所にフォーカスを移動する:Enter
    • ページ内検索を終了する:Esc
      • フォーカスを画面に戻して、画面スクロールなど別操作に戻りたい時に便利です
  • 画面スクロール
    • 小さくスクロール:(下へ)、(上へ)
    • 大きくスクロール:space(下へ)、Shift+space(上へ)
    • 一番上にスクロール:home
    • 一番下にスクロール:end
  • 開発者ツールを表示:F12 (連打で表非表示切り替え)
  • 開発者ツールのコンソール表示:esc(連打で表示/非表示切り替え)

File Explorer

  • 新規で開く:WIN+e
  • 既に開いている状態で、新規で開く(カレントディレクトリを継承):Ctl+n
  • 閉じる:Ctl+w
  • アドレスバーにフォーカス移動:Alt+l
  • 該当ファイルに移動:英数字を入力
  • 親フォルダへ移動:Alt+
  • アドレスバーの履歴操作
    • 一つ前に戻る:Alt+
    • 一つ先に進む:Alt+
  • ファイル名の変更:F2

VSCode:起動

  • タスクバーピン留め
    • タスクバーにピン留めしておくと、Win+数字で起動できます
    • 既にVSCodeを開いていて、新しく別で開きたい時はWin+N+数字で起動できます

VScode:リポジトリ切り替え

  • Project Manager(VSCodeのエクステンション)を導入すると、主要リポジトリ間の移動も楽になります。フロントエンド/バックエンド/インフラ、または複数のマイクロサービスなどの複数リポジトリのコードを行き来しながら実装する場合でも、Alt+Shift+pで簡単にリポジトリを切り替えられます。

VSCode:移動系

  • パネル間の移動
    • サイドバーへ:Ctrl+0
    • サイドバーのエクスプローラーへ:Ctrl+Shift+e
    • サイドバーのソース管理へ:Ctrl+Shift+gからのg
    • エディタ1つ目へ:Ctrl+1
      • サイドバーにフォーカスを当てて操作した後に、コードの編集に戻る時に良く使います。
    • エディタ2つ目へ:Ctrl+2
      • ボリュームのあるファイルを左右に分割して、それぞれのエディタで別々の箇所を編集する場合などはCtrl+1Ctrl+2で切り替えができて便利です。
    • ボトムバー:Ctrl+j
    • ボトムバーのターミナルへ:Ctrl+@
  • ファイル間の移動
    • ファイルを開く
      • ファイル名で検索:Ctrl+p
      • 以下のような方法もあります
        • エクスプローラーにフォーカスを当てる:Ctrl+Shift+e
        • 十字キーで対象ファイルへ移動してEnterを押す
    • ファイルを閉じる:Ctrl+w
  • ファイル内の移動
    • 単語単位で移動:Ctrl+Ctrl+
    • カーソル行の先頭へ:Home
    • カーソル行の末尾へ:End
    • 上へスクロール:Ctrl+
    • 下へスクロール:Ctrl+
  • 関数間の移動
    • 関数を呼び出している箇所にカーソルがある場合に、関数定義へ移動:F12
    • 関数のIF定義にカーソルがある場合に、関数実装へ移動:Ctrl+F12
      • モックと本実装など実装が2つ以上ある場合は、モダールで候補一覧が表示されるので、十字キーで選択してEnterを押すと移動できます
    • カーソル位置の戻る:Atl+
    • カーソル位置の進む:Atl+
    • 3層構造で処理を追っていく時は、以下のようにソートカットを駆使して移動できます
      • handler層
        • ↓:F12
      • usecase層のIF
        • ↑:Alt+
        • ↓:Ctrl+F12Alt+
      • usecase層の実装
        • ↑:Alt+
        • ↓:F12Alt+
      • repository層のIF
        • ↑:Alt+
        • ↓:Ctrl+F12Alt+
      • repository層の実装

VSCode:その他

  • 行コピー:Ctrl+c
    • カーソルがある行でCtrl+cすると行がコピーされます。行の全選択して...などは不要です。
  • 行移動:Atl+Atl+
    • カーソルがある行を上下に移動できます。行を切り取って貼り付け...などは不要です。
    • 複数行選択して塊ごと移動することもできます。
  • 行数を指定して移動:Ctrl+g > 行番号入力
    • エラー箇所を参照する場合などに良く使います。スタックトレースから行番号を見つけて、Ctrl+gで移動する感じです。
  • 行削除:Ctrl+Shift+K
    • 行を最初から最後まで選択してdelete...などは不要です。
  • コメントアウト/イン:Ctrl+/
    • 選択範囲をコメントアウト/インします。複数行選択しても一発でコメントアウト/インできます。行先頭に移動して//を入力して...などは不要です。
  • 全ファイル検索:Ctrl+Shift+f
  • 同じ文字列を選択:Ctrl+d
    • 一括で修正したい場合などに使います。複数箇所で同じ文字列を選択して、マルチカーソルで一括で修正できます。
  • ファイル内検索:Ctrl+f
    • 大文字/小文字の区別、単語区切りの区別などを指定して検索できます。
  • ファイル名変更:f2
  • 変数・関数などの名前変更:f2
    • 参照箇所が別ファイルも含めて一括置換されるので便利です。手作業で変数名を変更して、参照先を割り出して修正...などは不要です。
  • 型情報など表示:Ctrl+k i
    • マウスをホバーすると出てくる型情報などをショートカッドで表示できます。ホバーだとマウスを使う必要があるし、ホバーしてからしばらく待たないと表示されないので、そういう場合に便利です。
  • 問題の解決(コード自動修正):Ctrl+.
    • 修正方法がが表示されるので、それを選択すると自動で修正してくれます。Lintエラーやフォーマッターエラー、ReactのHooksのdepsのエラー解消などに良く使います。

ターミナル・シェル

以下Windows Terminalのショートカットです。

  • タブを開く:Ctrl+Shift+t
  • タブの切り替え:Ctrl+TabCtrl+Shift+Tab(逆方向)
  • 分割ペインを開く:Alt+Shift+d
  • 分割ペイン間の移動:Alt+Alt+
  • タブ・ペインを閉じる:Ctrl+Shift+w

以下Powershellのショートカットです。

  • 入力補完:Tab
    • ディレクトリ移動などの場合、cd wなどディレクトリの頭文字を打ってからTabを押すとcd workspaceなどと保管が聞きます
    • スペルミスを避けながら効率的にコマンドを入力できるます
  • 実行履歴を辿る:
    • 直前に実行したコマンドを再度実行することが多々あると思うので、その場合はで履歴を遡ることで実行できます
  • 実行履歴から検索:Ctrl+r
    • 直前に実行したコマンドを再度実行することが多々あると思います。で辿るのが手間な場合は検索して実行可能です
  • 単語区切りで移動:Ctrl+Ctrl+
  • 行頭に移動:Home
  • 行末に移動:End
  • カーソル左の単語を削除:Ctrl+BackSpace
  • カーソル右の単語を削除:Ctrl+Delete
  • カーソルから先頭までを削除:Ctrl+Home
  • カーソルから行末までを削除:Ctrl+End
  • カーソルを削除:Esc
  • 実行中のコマンドを強制終了:Ctrl+c
  • 画面クリア:Ctrl+l,clearコマンド
    • ターミナルでの実行コマンドと結果を一旦クリアしたい時に使います

Confluence

  • 編集開始:e
    • ページ観覧時にeを押すと編集モードに切り替わります
    • マウスで右上の編集ボタンをクリックして...などは不要です
  • 検索開始:/
    • マウスで右上の検索窓をクリックして...などは不要です
  • 編集中
    • 保存して編集モードを抜ける:Ctrl+Enter
    • 日付を入力://
    • 箇条書きを入力:-+Space
      • 左上の箇条書きボタンをクリックして...などは不要です
    • セクションタイトルを入力:#をヘッダーレベル分だけ+Space
      • 左上のタイトルボタンをクリックして...などは不要です
    • 補足情報を入力:/情報+Enter
    • テーブルを入力:/表+Enter
    • コードスニペットを入力:```
    • 表の編集
      • 下に行追加:Alt+Ctrl+
      • 右に列追加:Alt+Ctrl+
  • その他ポイント
    • ページタイトルがh1レベルなので、ページ直下のセクションタイトルはh2にしてください
    • 表には必ず行番号を付けてください
      • 誰かとページを一緒に見ながら議論する時に、番号があったほうが特定しやすいからです
    • 章立て(セクションタイトルの構成)だけで、ページの趣旨と構成がわかるようにしてください

Zoom

すばやく議論を進めるには、ショートカットでのアクションが便利です

  • ミュート/ミュート解除:Alt+a
    • 通常ミュートで発言時に解除する場合などに便利です。
  • 画面共有:Alt+s
    • 何かを見せながら議論する時に便利です。
  • カメラオン/オフ:Alt+v

Excel

  • シート
    • 追加:Alt+IW
    • 削除:Alt+EL
    • 名前変更:Alt+HOR
    • 移動(→):Alt+PageDown
    • 移動(←):Alt+PageUp
    • 選択:Ctrl+Space
    • 追加:Alt+IR ※IはInsert、RはRow
    • 削除:Alt+EDR+Enter
    • 選択:Shift+Space ※半角入力の状態で
    • 追加:Alt+IC ※IはInsert、RはColumn
    • 削除:Alt+EDC+Enter
  • 貼り付け
    • 値:Alt+ESVEnter
    • 書式:Alt+ESTEnter
  • 編集
    • 背景色:Alt+HH
    • 文字>色:Alt+HFC ※Font Color
    • 文字>大きさ:Alt+HFS ※Font Size
    • 左寄せ:Alt+HAL ※Align Left
    • 中央寄せ:Alt+HAC ※Align Center
    • 右寄せ:Alt+HAR ※Align Right
    • 罫線>大枠:Alt+HBS
    • 罫線>格子枠:Alt+HBA
    • 幅調整:Alt+HOI
  • 移動
    • ↑:Shift+Enter
    • ↓:Enter
    • ←:Shift+Tab
    • →:Tab

ツール

ランチャーアプリ

WindowsならKeypirinha、MacならAlfredをおすすめします。
両者ともブラウザのブックマークが開けるので便利です。

日々使うサイトなどは、ブックマークで以下のように登録しておくと便利です。
「XXX開いて」と言われた時も、ブックマークを辿らずにコマンド一発で開けます。 プロジェクトごとにプレフィックスをつけると便利です(ここではt_

  • t_backlog:プロジェクトのプロダクトバックログ。
  • t_board:プロダクトのタスクボード(Trelloなど)
  • t_wiki:プロダクトのWiki(OneNoteやJiraなど)
  • t_portal_devt_portal_testt_portal_prd:プロダクトのポータルサイト(環境ごとにサフィックスをつけると便利です)
  • t_db:プロダクトのデータベース(AWSマネコン > DynamoDBなど)
  • t_log:プロダクトのログ監視ツール(Datadogなど)
  • t_bugs:プロダクトのバグ一覧(Jiraなど)
  • t_schedule:プロダクトのスケジュール(Outlookなど)
  • t_zoom:プロダクトのZoom(ブラウザでZoomを断りなく開けるように設定しておくと、t_zoomだけでZoomに入れるようになるので便利です)
  • t_mr:プロダクトのマージリクエスト一覧(GitLabのマージリクエスト一覧、リポジトリごとにサフィックスをつけるて登録するのも便利です)

KeypirinhaはWindowsのスタートメニューも起動できます。サクラエディタのショートカットをスタートメニュー用ディレクトリ(C:\ProgramData\Microsoft\Windows\Start Menu\Programs配下)に配置しておくと、パッとサクラエディタを開いてメモを取れたりして便利です。

クリップボード履歴

WindowsならWin+v、MacならClipyをおすすめします。
複数箇所のコピペを1つ1つやっているなら、上記ツールを使ってまとめてコピーしてペーストしたほうが効率的です。

ターミナル

※ターミナルは好みが色々あると思うので以下居以外にも自分のお好みのツールを探してみてください。
WindowsならWindows Terminal、MacならWrapをおすすめします。
プロンプトとしてstarshipもおすすめです。