ブックマークしておくと便利!Web制作に役立つさまざまなツールが一箇所で利用できる -SmallDev.tools
Post on:2021年9月15日
CSSやJavaScriptのミニファイ(軽量化)、HTMLやCSSやJavaScriptやSQLのフォーマッター、各種エンコード・デコード、ダミーテキスト・ダミーデータ・ダミー画像・クレジットカードのジェネレーター、diff(ファイル比較)など、Web制作に役立つツールがまとめて利用できるSmallDev.toolsを紹介します。
いろいろなツールが揃っているので、ブックマークしておくと便利です。
![Web制作に役立つさまざまなツールが一箇所で利用できる -SmallDev.tools](http://coliss.com/wp-content/uploads-202103/2021090410-01.png)
SmallDev.tools
smalldev-tools -GitHub
SmallDev.toolsの特徴
SmallDev.toolsは、Web制作に役立つさまざまなツールが一箇所でまとめて利用できる便利サイトです。完全に無料で利用でき、登録など面倒なことは一切ありません。
- 最小限のインターフェース🤩
- 電光石火の速さ⚡
- 広告はなし💩
- プライバシーフリー🔐(データはすべて、サーバーに保存されません)
- ワンストップソリューション🔥
- ワンクリックで出力を共有可能♻️
2021年9月現在、23種類のツールが利用できます。その中からいくつか紹介します。
まずは、CSSを軽量化するミニファイ。
「Input」にCSSをコピペして、「Compress CSS」をクリックすると、不要なスペースやセミコロンや空白行を削除し、CSSを軽量化するためのさまざまなロジックを実行します。軽量化されたCSSは「Output」に表示されます。
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-202103/2021090410-02.png)
CSSのフォーマッターは、インデントのタブ・スペースの数を揃え、行の文字数などを揃えて、CSSを整形します。
CSSのコードの見た目を整えるために使用したり、ミニファイされたCSSを読みやすくするために使用します。
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-202103/2021090410-03.png)
HTMLとJavaScriptにも同様のフォーマッターが利用できます。
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-202103/2021090410-04.png)
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-202103/2021090410-05.png)
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-202103/2021090410-06.png)
Diffは、2つのテキスト間の差異を表示するツールです。もちろん、CSSやHTMLなどのコードにも対応しており、日本語でも機能しました。
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-202103/2021090410-07.png)
デコード・エンコードのツールも揃っています。
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-202103/2021090410-08.png)
ダミーテキスト・ダミーデータ・ダミー画像・クレジットカードのジェネレーターも利用できます。
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-202103/2021090410-09.png)
sponsors