コーディングする際に便利なショートカット

弊社で働き始めて早3週間目に突入しました!

今日の仕事は新たにデザインカンプからの文字起こし、画像の書き出しなどでした。

最初のときに比べるとPhotoshopの使い方に慣れてきたと思います。

これもお忙しいなか操作方法や知識を教えていただいた先輩のおかげですm(_ _)m

感謝しています(>人<;)

 

さて、そろそろ本題に入ります!

ちなみに私はVisual Studio Code(VScode)というエディタを使っています。

マイクロソフトが開発したもので軽量だと言われています!

また、便利な機能がデフォルトで付いていてプラグインを入れることによって更に便利になります^^

 

ここでコーディングにおける便利なショートカットについてお話しします。

これも先輩に教えていただいたものですが、これらを知っているのと知らないとではコーディングにかかる時間が結構変わると思います。

コーダーはコードを書くのが仕事ですが、いかに書くコードを少なくするか考えるのが大事だと教えていただきました。

つまり、出来るだけ「コピー」「複製」を駆使していくことで手打ちによるミスも防げますし時間短縮につながります。

 

 

「cmd」+  D     で複数単語選択

一番便利だと思うのがこちらです^^

例えば<li>を範囲指定してcmd+Dを押すと他にも<li>があると押す分だけ選択範囲が増えていきます。

ちなみにこれはとばしたいというときは「K」を押すととばせて

行き過ぎた場合は「U」を押すと一つ前に戻せます。

選択した後は→または←を押すと一斉にカーソルが動いて一気にクラス名を付けられたり、逆に消したりと色々と応用が効きます!

 

「option」 +  「shift」 + ↓ で行の複製

わざわざコピーしなくてもこの操作で複製できます

 

「cmd」 +  「return(enter)」 でカーソル行の下に空行を挿入

これも覚えておくととても便利です!!

(カーソルを行末まで持っていって改行しなくてもいいので)

※逆に「cmd」 + 「shift」 + 「return(enter)」で上に空行を挿入

 

「option」 +  ↑または↓  で行の入れ替え

書く場所を間違えた時などは瞬時に入れ替え出来るので便利

 

「cmd」 + →または← でカーソルを単語の先頭、行末に移動

応用して「shift」も加えると選択が一気にできます!

 

 

とりあえず私が特に便利だと思ったものを書いてみました。

説明下手でうまく伝わらないかも知れませんが・・・

これらを使うようになってからコーディングが早くなったと思います・・・!

使ってみないと覚えられないのでこれからもどんどん使っていこうと思います^^

コメント

タイトルとURLをコピーしました