コード整形ツール

ArrayKitのコード整形ツールは、貼り付けたコード、クエリ、設定ファイルを整えて、読みやすく、レビューやコミットをしやすくします。MySQL、PostgreSQL、SQL Server、SQLite、BigQuery、Oracleのクエリは「SQL フォーマッター」でレイアウトを整え、JavaScript・TypeScript・JSXの整形やJavaScriptの圧縮は「JS / TS フォーマッター」で行い、スタイルシートとマークアップは「CSS / SCSS フォーマッター」、「HTML フォーマッター」、「XML フォーマッター」できれいにできます。設定ファイルでは、「YAML ↔ JSON」、「INI から JSON への変換」、「dotenv から JSON への変換」が双方向に変換し、「TOML 整形・変換ツール」はTOMLを整形してJSONとの間で相互に変換します。「GraphQL フォーマッター」、「OpenAPI / Swagger フォーマッター」、「Dockerfile フォーマッター」、「MongoDB クエリフォーマッター」はAPI定義、コンテナのファイル、データベースのクエリを扱い、「SVG オプティマイザー」はアイコンから編集ソフトが残した不要な記述を取り除きます。ドキュメント作成では、「Markdown プレビュー」が入力に合わせてGitHub形式のMarkdownを表示し、「HTML to Markdown 変換ツール」がページやスニペットを変換し、「Mermaid 図レンダラー」がフローチャートやシーケンス図をSVGで描きます。仕上がりの確認には、「正規表現テスター」でパターンを試し、「テキスト比較」で2つのバージョンを比べ、「コントラストチェッカー」で色の組み合わせを確かめ、「CSS カラー変換」と「CSS単位変換ツール」で色やCSSの単位を変換できます。フロントエンド、バックエンド、DevOpsのエンジニアやテクニカルライター向けに作られています。すべてブラウザー内で動作するので、コードはお使いの端末にとどまり、何もアップロードされません。

• YAML ↔ JSON — YAMLをJSONに、またその逆に変換します。
• Markdown プレビュー — MarkdownをHTMLにレンダリングし、ライブプレビューします。
• 正規表現テスター — 正規表現をライブでテストし、マッチ、グループ、フラグを確認します。
• CSS カラー変換 — HEX、RGB、HSL 間で変換し、ライブスウォッチを表示します。
• テキスト比較 — 2つのテキストを行単位で比較し、追加と削除を確認します。
• MDX 変換ツール — MDXをテキストとしてレンダリングし、HTML → MDX 変換やMDXリテラルへのエスケープを行います。
• CSS / SCSS フォーマッター — CSS/SCSS/LESS の整形・圧縮、プロパティの並べ替え、重複の除去を行います。
• JS / TS フォーマッター — JavaScript・TypeScript・JSX/TSX を Prettier のオプションで整形。素の JavaScript は圧縮もできます。
• HTML フォーマッター — HTMLの整形・圧縮、インラインCSS/JSの整形、結果のプレビューを行います。
• XML フォーマッター — XMLの整形・圧縮・検証を行い、XML ↔ JSON を変換します。
• SQL フォーマッター — MySQL、PostgreSQL、SQL Server、SQLite、BigQuery、Oracle 向けにSQLを整形します。
• GraphQL フォーマッター — GraphQLのクエリやスキーマを整形・圧縮し、構文を検証してオペレーションを抽出します。
• Dockerfile フォーマッター — Dockerfileを整形し、ベストプラクティスやlintの提案を表示します。
• MongoDB クエリフォーマッター — MongoDBシェルのクエリと集約パイプラインを整形します。
• コントラストチェッカー — 2色間のWCAGコントラスト比とAA/AAA合格を確認します。
• Mermaid 図レンダラー — Mermaid図（フロー、シーケンス、ガント）をブラウザ内でSVGにレンダリングします。
• SVG オプティマイザー — SVGを圧縮: コメント、メタデータ、エディタの残骸を削除し、空白をまとめます。
• MongoDB クエリ整形ツール — MongoDB のクエリや find() 文をブラウザ内で整形・インデントします。
• MongoDB 集計整形ツール — MongoDB の集計パイプラインをブラウザ内で整形・インデントします。
• MongoDB エクスプローラー — MongoDB のドキュメントやコレクションのサンプルを調べ、フィールドのスキーマと型を推測します。
• OpenAPI / Swagger フォーマッター — OpenAPI / Swagger 仕様（JSON または YAML）を整形・検証し、パスと操作の数を数えます。
• CSS単位変換ツール — px・rem・em・pt・% をリアルタイムに相互変換します。
• glob to regex 変換ツール — globパターンをJavaScriptのregexに変換し、パスでテストできます。
• HTML to Markdown 変換ツール — HTMLをきれいで読みやすいMarkdownに変換します。
• TOML 整形・変換ツール — TOMLを整形・検証し、JSONと相互変換します。
• logfmt to JSON コンバーター — logfmt の key=value ログを JSON に、また JSON から logfmt に変換します。
• dotenv から JSON への変換 — .env ファイルを JSON オブジェクトに、JSON を .env に相互変換できます。
• CSV から Markdown テーブルへの変換 — CSV や TSV を GitHub 形式の Markdown テーブルに変換できます。
• INI から JSON への変換 — INI 設定を JSON に、JSON を INI に、セクションやコメントごと相互変換できます。
• Markdown テーブル生成 — 編集可能グリッドで Markdown テーブルを作成し多形式に書き出し
• データ容量変換 — バイトを KB・MB・GB や KiB・MiB・GiB に一度に変換
• Properties to JSON — Java の .properties を JSON に、またその逆にブラウザで変換。

よくある質問

ArrayKitのコード整形ツールで何ができますか。

コードの整形や圧縮、SQLのレイアウト調整、Dockerfileのリント、GraphQL・MongoDBのクエリ・OpenAPI仕様・TOMLの整形ができます。さらに、YAML・TOML・INI・.env・Javaの.properties・logfmt・JSONの間での設定の変換、MarkdownとMDXのプレビュー、HTMLやCSVからMarkdownへの変換、Markdownの表の作成、Mermaid図の描画にも対応します。手早い確認用には「正規表現テスター」、「glob to regex 変換ツール」、「テキスト比較」、「コントラストチェッカー」、「MongoDB エクスプローラー」があり、CSSの色・CSSの単位・データ容量の変換ツールもそろっています。

どの言語を整形・圧縮できますか。

CSS・SCSS・LESS、HTML、XML、GraphQLは整形と圧縮の両方ができ、JavaScript・TypeScript・JSX・TSXは整形でき、通常のJavaScriptは圧縮もできます。「SQL フォーマッター」はMySQL、PostgreSQL、SQL Server、SQLite、BigQuery、Oracleに対応しています。Dockerfile、MongoDBのクエリ、OpenAPI仕様には「Dockerfile フォーマッター」、「MongoDB クエリフォーマッター」、「OpenAPI / Swagger フォーマッター」という専用のツールがあり、「SVG オプティマイザー」はSVGのマークアップを小さくします。JSONには、JSONツールのカテゴリーに専用のフォーマッターとビューアーがあります。

非公開のコードや社外秘のコードを貼り付けても安全ですか。

はい。どのフォーマッターと変換ツールもブラウザー内で動作するため、ソースコード、SQL、設定ファイル、.envファイルの値はお使いの端末上で処理され、サーバーにアップロードされることはありません。社外秘のコードも、お使いのコンピューターの外に出すことなく整形できます。

整形すると、コードの動作が変わりますか。

整形（ビューティファイ）で変わるのは、インデント、改行、スペース、引用符のスタイルといった見た目だけです。圧縮（ミニファイ）は空白とコメントを取り除いてファイルを小さくし、JavaScriptではコード自体も短くまとめます。一部のオプションは意図的に内容を変えます。CSSプロパティの並べ替えは順序を入れ替え、重複した宣言の削除は各プロパティの最後の値だけを残すため、意図して書いたフォールバックが消えることがあります。結果は「テキスト比較」で見比べ、公開前にテストしてください。

YAML・TOML・INI・.env・JSONの間で設定ファイルを変換するには、どうすればよいですか。

対応する変換ツールを選びます。「YAML ↔ JSON」と「TOML 整形・変換ツール」は双方向に変換でき、「INI から JSON への変換」は[セクション]を入れ子のオブジェクトに変換して元に戻すこともでき、「dotenv から JSON への変換」は引用符付きの値、コメント、exportの接頭辞を処理しながら.envファイルとJSONを相互に変換します。「Properties to JSON」はdb.hostのようなドット区切りのキーを入れ子にでき、「logfmt to JSON コンバーター」はkey=value形式のログ行をJSONオブジェクトに変換し、逆の変換もできます。