この記事に関連するツール
ブラウザ上ですぐに試せます。記事の内容を確認しながら使うと、作業の流れをつかみやすくなります。
APIのJSONキーは snake_case、TypeScriptの変数は camelCase、CSSクラスやURLは kebab-case、環境変数は CONSTANT_CASE——開発では複数の命名規則が常に混在します。Case Converter は、識別子を1つ入力するだけで9種類の命名規則へ同時に変換して見比べられるブラウザ完結型のツールです。
対応する9種類の命名規則
| 規則 | 例 | 主な用途 |
|---|---|---|
| camelCase | helloWorld | JavaScript/TypeScriptの変数・関数 |
| PascalCase | HelloWorld | クラス名・型名・Reactコンポーネント |
| snake_case | hello_world | Python変数・DBカラム・APIのJSONキー |
| CONSTANT_CASE | HELLO_WORLD | 定数・環境変数 |
| kebab-case | hello-world | CSSクラス・URLスラッグ・ファイル名 |
| dot.case | hello.world | 設定キー・プロパティパス |
| path/case | hello/world | ファイルパス・ルーティング |
| Title Case | Hello World | 見出し・ドキュメントタイトル |
| Sentence case | Hello world | UI文言・説明文 |
2つのモード
クイック変換：1語を9規則で見比べる
入力欄に識別子を1つ入力すると、9種類すべての変換結果がリアルタイムで並びます。「このAPIレスポンスのキー、TypeScript側では何て名前にする？」のような日常の変換は、これで一目です。各結果はワンクリックでコピーできます。
一括変換：リストをまとめて1規則へ
複数行のリストを貼り付けて変換先の規則を選ぶと、全行を一括変換します。空行はそのまま保持されるため、貼り付け元のリストと行の対応がずれません。DBのカラム名一覧をTypeScriptのプロパティ名に直す、定数一覧を環境変数名に変換する、といった作業がまとめて終わります。
変換の賢さ：境界の検出ルール
単純な置換ではなく、単語境界を解析してから組み立て直すため、次のようなケースも正しく扱えます。
- 連続大文字（頭字語）:
HTTPServerError→http_server_error。HTTPを1つの単語として認識します - 数字の扱い:
base64Encode→base64_encode。数字は隣接する単語にくっついたまま分離されません - 混在した区切り:
user-profile_imageURLのようにハイフン・アンダースコア・大文字境界が混ざっていても、いったん単語に分解してから目的の規則で再構成します
入力データはブラウザの外に出ません
変換はすべてブラウザ内のJavaScriptで完結し、入力した識別子がサーバーへ送信されることはありません。社内APIのフィールド名や未公開のスキーマ情報でも安心して使えます。
よくある質問
連続する大文字（HTTPやURLなどの頭字語）はどう扱われますか？
HTTPServer は http と server の2語として認識されます。頭字語の連続大文字は「最後の大文字＋小文字」の直前で区切る規則で解析しているため、XMLHttpRequest も xml / http / request に正しく分解されます。
数字を含む識別子はどう変換されますか？
数字は隣接する文字と同じ単語として扱われます。base64Encode は base64 と encode の2語になり、snake_case では base64_encode です。数字だけが単独の単語として分離されることはありません。
複数行を一括で変換できますか？
できます。一括変換モードにリストを貼り付けて変換先の規則を選ぶだけです。空行は空行のまま保持されるため、元のリストとの行対応が崩れません。
入力した内容は外部に送信されますか？
いいえ。変換はすべてブラウザ内で完結し、入力内容がサーバーへ送られることはありません。