htmlやJS、CSS、PHPのコードを自動整形してくれるツール

ソースコードにインデントが正しくつけられていないと、終了タグがどこだか分からなくなってコーディング中に思わぬ時間のロスをしてしまうことがあります。
そんな時にコードの整形ツールを使えば、あっという間に散らかったコードを読みやすく整形してくれます。

html整形ツール Source Code Beautifier

https://ctrlq.org/beautifier/

htmlをコピペすればインデントを整えてくれる、手軽なhtml整形ツールです。

Source Code Beautifier

html、JS、CSS整形ツール Dirty Markup

http://www.dirtymarkup.com/

html、JavaScript、CSSのコードを自動整形、補完してくれるツールです。
提供されたhtmlのインデントがスペースだったけどタブにしたい。
色んな人の手によって運用されてるうちにCSSが散らかってしまった。
そんな時にこのツールを使えば、ワンクリックできれいに整形されたコードを吐き出してくれます。

Dirty Markup

html、JS、CSS整形、圧縮、コンバートツール Beautify Converter

http://www.beautifyconverter.com/

html、JS、CSSの整形の他に、コードを軽量化してくれる圧縮(minify)ツールもあります。
また、コンバートツールも充実しており、特に個人的にありがたかったのがhtml→PHPへのコンバートです。
例えば、以下のようなhtmlのコードをPHPでechoするには、ダブルクォーテーションを文字列として認識させるために、バックスラッシュを入れる必要があるのですが、このツールを使えば一発で変換してくれるので手間が省けます。

コンバート前のhtml

<link rel="stylesheet" href="style.css" media="all" />

コンバート後のPHP

<?php
echo "<link rel=\"stylesheet\" href=\"style.css\" media=\"all\" />\n";
?>

Beautify Converter

htmlからPHPのコンバートツール

Sublime Textのhtml、JS、CSS整形プラグイン
HTML/CSS/JS Prettify

エディタにSublime Textをお使いなら、右クリで選択するだけでコードを整形してくれるプラグイン、HTML/CSS/JS Prettifyがおすすめです。
導入方法は以下の記事で詳しく紹介されています。

Sublime Text で CSS や HTML、Javascript のソースを整形するプラグイン

PHP整形ツール PHP Beautifier

http://flatsystems.net/php_beautifier.php

PHPのソースコードのインデントを整形して統一、開始タグや閉じタグが不足していた場合は補完してくれるツールです。

PHP Beautifier

RELATED POSTS