【Brackets】ーショートカットキーを駆使して作業を効率化しよう

スポンサーリンク

 

この記事でわかること

  • Bracketsのショートカットキー
  • 拡張機能『Display Shortcuts』のインストール方法
  • 『Display Shortcuts』の使い方

編集の度にマウスでカチカチ…

マウス操作が続くとだんだん、マウスに手を伸ばすだけでイライラしますよね。

 

そこで便利なのがショートカットキー!!

Bracketsのショートカットキーを上手く使うと、驚くほど作業効率が上がります。

 

この記事内では、ショートカットキーを部門ごとに一覧にしたり、GIF動画を入れてみたり、かなり見やすく作りました。

 

また、後半ではBracketsのショートカットキーをアプリケーション内で一覧表示できる便利な拡張機能『Display Shortcuts』のことについても書いていますのでぜひ最後まで読んでいってください。

では早速、Bracketsのショートカットキーを紹介します。

スポンサーリンク

Bracketsのショートカットキー

まずは、基本のファイル操作関係のショートカットキーを紹介します

ファイル操作のショートカットキー

コマンド名ショートカットキー
新規作成Ctrl+N
保存Ctrl+S
名前を付けて保存Ctrl+Shift+S
すべて保存(開いてるファイルすべて)Ctrl+Alt+S
開くCtrl+O
最近使用したファイルを開くAlt+O
フォルダーを開くCtrl+Alt+O
クイック・オープンCtrl+Shift+O
閉じるCtrl+W
すべて閉じるCtrl+Shift+W
編集中のファイル切り替えCtrl+PageUP or Ctrl+PageDown
ファイル名の変更F2

クイック・オープンとは

Brackets便利機能の一つ、クイック・オープンは任意のファイルを簡単に素早く開くことができる機能です。

最短で開くには「Ctrl+Shift+O→カーソルキーでファイルを選択→Enter」。

これで、ファイルを開くときはマウス要らずですね(^^♪

Brackets_gif_1-min

最近使用したファイルを開く他の方法

最近使用したファイルを開く方法として紹介したのは「Alt+O」ですが、実は他にも開く方法がります。

  • Ctrl-Shift+Tab
  • Ctrl+Tab

の2つは「Alt+O」と同じような機能を持っています。

 

”同じような機能”なので厳密にいえば違います。

しかし、使用感としては全く変化ありません。

全部で3通りあるので自分に合ったやり方を試してみてください。

必ず覚えておきたいショートカットキー

コマンド名ショートカットキー
コピーCtrl+C
ペーストCtrl+V
一つ前の動作に戻るCtrl+Z
一つ前に戻ったけどやっぱりその動作、取り消しで…Ctrl+Y
カットCtrl+X

表のショートカットキーは、Bracketsだけでなく他のエディタにも使えるのでしっかり覚えておきましょう。

Brackets本体に関する表示設定

コマンド名ショートカット
サイドバーを表示(非表示)するCtrl+Alt+H
サイドバー・ツールバーを表示(非表示)するCtrl+Shift+2
拡張機能付きでリロードF5
拡張機能なしでリロードShift+F5
Bracketsを終了するCtrl+Q

「サイドバーを表示(非表示)する」と「サイドバー・ツールバーを表示(非表示)する」で、何が違うのという感じだと思います。

では実際に何が違うのか、確認していきましょう。

まずは、「サイドバーを表示(非表示)する」から

Brackets_gif_2

お次に「サイドバー・ツールバーを表示(非表示)する」をご覧ください。

Brackets_gif_3

分かりましたか?

『ライブ・プレビュー』のボタンがある(画面右側)ツールバーまで表示(非表示)するか否か、が違うところです。

Bracketsの表示設定

コマンド名ショートカットキー
フォントサイズを大きくするCtrl+(+キー)
フォントサイズを小さくするCtrl+(̠ーキー)
フォントサイズをリセットCtrl+0(ゼロ)

Brackets_gif_4

実際に票のショートカットキーをやるとこんな感じです。

『フォントサイズをリセット』は「表示→テーマ→フォントサイズ」で設定したサイズに戻ります。

ライブ・プレビュー

コマンド名ショートカットキー
ライブ・プレビューCtrl+Alt+P
ライブ・プレビューを強制的にリロードCtrl+Shift+R
ライブ・プレビューのハイライトCtrl+Shift+C

ライブ・プレビューに関するショートカットキーはぜひとも覚えて欲しいですね♪

これを覚えるだけでも作業スピードは格段に良くなります。

コーディング関係

コマンド名ショートカットキー
コードのヒントを表示Ctrl+Space
パラメーターヒントを表示Ctrl+Shift+Space
クイック編集Ctrl+E
クイックドキュメントCtrl+K
コメントの切り替えCtrl+/
インデントCtrl+[
インデント解除Ctrl+]
現在のコードを折りたたむ・展開する折りたたむ「Ctrl+Alt+[」 展開「Ctrl+]」
前の作業を繰り返しCtrl+D
行の消去Ctrl+D
行を入れ替えるCtrl+Shift+カーソルキー
検索Ctrl+F
ファイルを跨いで検索Ctrl+Shift+F
次を検索F3
前を検索Shift+F3

コーディング関係では、これだけのショートカットキーを覚えておけばまず問題ありません。

特に、コーディング中だけはマウス触りたくないですよね…。

スポンサーリンク

ショートカットキーを一覧化して見れる拡張機能『Display Shortcuts』

「ショートカットキーを見たいけどブラウザで検索するのめんどくさい」という場合はこちらの『Display Shortcuts』という拡張機能をインストールしておきましょう。

Brackets内で一覧化されるのでかなり使い勝手の良いおすすめの拡張機能です。

手順1 : 拡張機能を検索する画面を開こう

最初に赤線枠内の電気?みたいなアイコンをクリックします。

Brackets_img_1

画面が切り替わっていたら次に進みます。

手順2 : 『Display Shortcuts』をインストールしていこう

画面が切り替わったら、入手可能をクリックして検索から『Display Shortcuts』と検索。

必ずしも一番上に出てくるとは限りませんが、大体一番上に表示されています。
(念のため、確認はしてください)

名前が当たっていればそのまま『インストール』をクリックします。

その後、『インストール完了』になっていることを確認して『閉じる』でトップ画面に戻ってください。

実際に『Display Shortcuts』使ってみよう

『Display Shortcuts』を起動する際は、「Ctrl+Alt+/」で表示。

もう一度同じキーを入力すれば、非表示にできます。

このようにしっかり作動していれば問題ありません。

Bracketsショートカットキーのまとめ

みなさん、ショートカットキーは上手く使いこなすことが出来ましたか?

最初は慣れないキー操作に戸惑ってしまうかもしれませんが、慣れてくると確実に作業効率が上がるのでぜひ活用してください。

 

早く、ショートカットキーを覚えてマウスいらずで最速のコーディングを実現しましょう!!

Brackets_eye_catching_img_02
最新情報をチェックしよう!