テキストエディタを入れて、次はどうしたらいいのか分からない初心者向け。
最低限入れたい機能を書いているので、他の記事も読んでどんどん自分が使いやすいようにカスタマイズしてください。
目次
ないと暴れたくなる
Emmet
EmmetというHTML補完機能は絶対に便利。
「!」書いてtabキー(テキストエディタによる)を押すと以下のHTMLが全て書かれる。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> </body> </html>
超便利じゃない?
他にも「ul>li*3」って書いてtabキー押すと以下のHTMLが書かれる。
<ul> <li></li> <li></li> <li></li> </ul>
Emmet入れる。
https://docs.emmet.io/cheat-sheet/
半角全角スペースの表示
スペースが空いているかどうかはプログラムを書く上では重要になる。
半日悩んだ挙句、たった1つの全角スペースが混じっていただけだったなんてことはよく聞くし、自分も経験した。
コードは英語で書くけど、コメントを書くときに日本語を使うし、半角と全角のスペースがそれぞれ可視化されるプラグインなり、設定なりをしておいてほしい。
以下の写真は我のテキストエディタの例。
絶対にいる。
文字色(テーマ)
我はテーマを入れて文字色と背景を以下のように変えている。
ただランキングで上位だったから採用してみて、そのままになっている。
長時間PC画面を見るなら背景は暗めの方が目が楽。
CSSの色がコード上に表示されるやつ
ホームページのデザインを自分でいじることがあるなら、便利。
16進数で色を指定しても人間にはどんな色か我にはさっぱり分からないから、色を表示してくれると便利。
生産性の向上
日本語化
英語のままでも別に困らない。
即時反映
BracketsではライブプレビューというHTML、CSSの変更を即時で反映して表示する機能がある。
あると便利ではあるが普通に画面でリロードをかけるのが癖になってる。
テキストエディタのショートカット
複数検索・選択とか、行複製、改行ショートカットを我は使うために覚えている。
テキストエディタによって初期状態でのショートカットキーが異なるので、ググってほしい。
慣れると、wordを触ってても不便を感じるようになる。
終わり
他の記事では入れるプラグインの数が多すぎて、結局どれを入れたらいいのか分からなくなることが多いので書きました。
とりあえず最低限これだけ入れておいて後から追加するように我はしています。