「Visual Studio Code（通称：VS Code／VSコード）」を使っていると、「Prettier」という自動整形ツールが有用であると知りました。実はすでにVSコードの拡張機能としてインストールしており、便利機能として使っていたので、改めてその概要や役割を確認してみます🧐
Prettierって何？
このWebデザインのオフ会で「Prettier」っていうVSコードの拡張機能入れたんだけど、これ今ひとつ役割がわかってないんだよね。どういうものなんだろう？
「プリティア」って読むのかな？ 「プリキュア」ならわかるんだけどね〜。
誰が「プリキュア」の話をしろって言った！😤 変身はしないけどな、Prettierはコードを一瞬で「キレイに変身」させるぞ！（多分・・😅）
読み方は「プリティア」であってますよ。変身ヒロインではありませんが、散らかったコードを静かに整えてくれる存在ですね。だから初心者ほど、早めに頼って大丈夫です。
Prettierの主な特徴
Prettier（プリティア）は、コードを自動でキレイに整えてくれるツールです。
HTMLやCSS、JavaScriptなどのコードを、
- インデント
- 改行
- スペース
といったルールに従って、自動的に整形してくれます。
一言で言うと
「コードの見た目を、機械に任せるためのツール」
VSコードには標準の整形機能（HTML言語機能）もありますが、Prettierは整形に特化した拡張機能で、より強力に統一してくれるのが特徴です。
あ、このズバッと整えてくれるのが「Prettier」なんだ〜。これ便利だよね。
ここまで綺麗にしてくれるのは助かるなぁ。そういやVSコードの標準にも整形機能（HTML言語機能）があるってことだけど、わざわざPrettierって入れる意味あるの？
標準機能は最低限、Prettierは「全部まとめて任せる用」だ。考えなくていいってのは、地味にデカいんだぜ（・・って通りがかった登山者が言ってた気がする😆）
ざっくり違いを言うとこんな感じです。
●HTML言語機能（VS Code標準）
- VS Codeに最初から入ってる
- HTMLの編集を助ける機能の一部として「整形」もできる
- 基本は「読みやすくするために最低限整える」
●Prettier（拡張機能）
- 追加で入れる専用フォーマッター（Formatter）※
- 整形に特化していて、より強力に統一する
- チーム開発でも「全員同じ見た目」を作れる
※「整形」や「形式を整える」などの意味を指す「フォーマット（format）」を行うソフトウェアや機能
なるほど。整形に特化していて、チーム作業で使いやすいんだね。将来的なことを考えたら、確かに今から慣れておいたほうが良さそうだね。
これは入れておかないと損って感じかな。私も入れておこうっと。
（・・・で、結局どう入れるんだ？😅） おい、ロボット！ 早くわからないニンゲンに入れ方を教えてやれよな😤
Prettierの導入（インストール方法）
Prettierは、VSコードの拡張機能として簡単に導入できます。
手順
- VSコードの左側メニューから 拡張機能 を開く
- 検索欄に
Prettierと入力 - 「Prettier – Code formatter」 を選択
- 「インストール」をクリック
これだけで完了です。特別な設定をしなくても、すぐに使えます。
これはカンタンだね〜。助かるよ。
（・・・こんなカンタンな方法だったのか😅） フン……だから言っただろ。道具は「難しそう」に見えるだけだ。使ってみりゃ、拍子抜けすることも多いんだぜ😤
だよね。最初から完璧に理解しなくても、入れて使ってみるだけでも、十分だなって思うよ。
その姿勢で大丈夫ですよ。道具は「理解してから使う」ものではなく、「使いながら理解していく」ものです。Prettierも、まずは頼って、必要になったら少しずつ知っていけば十分です。
まとめ：初心者が導入すべき理由
横文字のよくわからなそうな拡張機能だし、「初心者のうちから入れていいの？」と思いましたが、どうやら初心者こそ向いている機能だそうです。
理由①：余計なことで悩まなくて済む
- インデントがズレた
- 改行が汚い
- 自分の書き方が悪いのか不安
こうした悩みを、Prettierがまとめて引き受けてくれます。
理由②：あとから直す必要がなくなる
最初からこまめに整形していくと、
- 後でまとめて直す必要がない
- コードが読み返しやすい
- 学習のストレスが減る
というメリットがあります。
理由③：将来そのまま使い続けられる
Prettierは、JavaScript等の他の言語でも使われる、「ほぼ必須の定番ツール」とのこと。「最初から慣れておく」という意味でも、早めに導入して問題ないそうです。
こういう定番ツールを使いこなしつつ、引き続きプログラミングの勉強にも注力していこうと思います。ではでは😃
