卓上のVRから行動のVRへ

VR、web全般のこと、日々勉強中。(yoshioのブログ)1年後にやっててよかったなと思うのを目標に

macテキストエディター bracketsでHTMLのタグを綺麗に整形する簡単な方法

brackets最高です。

macでは、昔からCotEditorを使っていますが、数年前からコーディングは、adobe Dreamweaverではなく、atombracketsを使っていましたが、atomは、自分には、使い勝手が悪く、プラグインを入れるたびに重くなるので、現在では、bracketsがエディターとしては、最高の位置におります。

adobe Dreamweaverは、CC入っているけど、使ってない。。。 CotEditorは、メモ書きなんかには、使っている軽量で最高なエディタです

話それましたが、普段愛用しているbracketsですが、なるべくプラグインは入れないようにして使っていますが、どうしてもhtmlコーディングの際は不便なところも多いので、幾つかプラグインを入れています。

今回は、久々にプラグインを入れて感動したので、ご報告

何が問題?タグをコピペとかで使っていると整形が乱れます。

例えば、

  • あああああ
  • あああああ

こんなのです。 醜い。 まあ、個人的なものならいいですが、納品となると、、、 手で一つ一つやってたら日が暮れます。こまった

ボタン一つで自動で整形してくれるプラグインがあった。Beautifyです

bracketsで、ファイル>機能拡張マネージャで、入手可能タブにする 検索窓に、Beautify で検索

Beautify.ioではありません

Beautifyです 地球のマークところ、ダウンロード数がすごい数になっているやつです

Beautifyの使い方

簡単です、編集>Beautify

これだけです。

先ほどのが、

<div>
    <div>
        <ul>
            <li>あああああ</li>
            <li>あああああ</li>
        </ul>
    </div>
</div>

簡単です。 保存されたファイルの種類を見て、整形しているようなので、新規のまま保存していない場合は保存してからやってみてください。 HTML以外では、まだ試していないので、どこまで対応できるのかわかりませんが、HTMLなら使えそうです。

brackets & Beautify最高!