Code Formatter & Beautifier
Tempel atau buka file, tekan Format, dan dapatkan kode yang rapi. Bahasa terdeteksi otomatis — JavaScript, TypeScript, CSS, HTML, JSON, XML, SQL, YAML, Markdown, dan GraphQL, semuanya di browser Anda.
Semua berjalan di browser Anda — kode Anda tidak pernah diunggah ke server mana pun.
Lebar baris berlaku untuk JavaScript, TypeScript, CSS, SCSS, LESS, HTML, YAML, Markdown, dan GraphQL. Pemformatan tidak memeriksa logika, tipe, maupun aturan gaya.
Bahasa dideteksi begitu Anda menambahkan kode.
Letakkan file kode di sini (maks. 5 MB), tempel teks, atau muat contoh. Tekan Ctrl+Enter untuk memformat.
Format dan rapikan kode di browser Anda
Kode yang disalin dari bundle yang sudah diminify, log, pesan obrolan, atau proyek lama sulit dibaca dan lebih sulit lagi ditinjau. Code Formatter ini mengembalikannya menjadi teks yang rapi dengan indentasi konsisten hanya dengan satu klik. Tempel kodenya, tekan Format (atau Ctrl+Enter), dan hasilnya muncul di samping aslinya, lengkap dengan nomor baris di kedua sisi agar mudah dibandingkan sekilas.
Alat ini mendukung format yang paling sering dijumpai pengembang: JavaScript dengan JSX, TypeScript dengan TSX, CSS, SCSS, dan LESS, HTML beserta skrip dan gaya inline-nya, JSON, XML, SQL untuk tiga belas dialek, YAML, Markdown, dan GraphQL. Secara bawaan bahasa dideteksi otomatis, dari nama file saat Anda membuka file dan dari teksnya saat Anda menempel. Jika teks bisa berarti beberapa bahasa, alat ini memberi tahu Anda dan menawarkan kandidat yang mungkin, bukan diam-diam memilih parser yang salah.
Gaya tetap Anda yang menentukan. Pilih dua spasi, empat spasi, atau tab, serta lebar baris 80, 100, atau 120 karakter untuk bahasa yang diformat dengan Prettier. Untuk SQL, Anda dapat memilih dialek seperti PostgreSQL, MySQL, SQL Server, atau BigQuery. Untuk JSON tersedia juga tombol Minify yang menghapus semua spasi tanpa menyentuh angka, string, maupun urutan kunci. Pengaturan diingat di browser Anda, dan Anda dapat mengaktifkan format otomatis jika ingin melihat hasilnya saat mengetik.
Saat ada masalah, pesannya singkat dan tepat: bahasanya, apa yang diharapkan parser, serta baris dan kolomnya. Input Anda tidak pernah ditimpa, dan sebuah tombol memindahkan kursor ke lokasi masalah. Tombol Urungkan mengembalikan apa pun yang tidak sengaja Anda hapus atau ganti. Hasilnya dapat diunduh dengan ekstensi file yang sesuai, atau kedua versi bisa dibuka berdampingan di Text Diff Checker untuk melihat persis apa yang berubah.
Semuanya terjadi di perangkat Anda. Mesin pemformat yang berat hanya diunduh untuk bahasa yang benar-benar Anda format, dan berjalan di worker latar belakang sehingga file besar tidak membuat halaman macet. Perhatikan batasannya: file hingga 5 MB dapat dibuka, input di atas 300.000 karakter mungkin butuh beberapa detik, dan input di atas dua juta karakter ditolak. Pemformatan bukan linter atau compiler, jadi tidak akan menemukan kesalahan logika, dan beberapa fitur sintaks yang jarang dipakai mungkin ditolak.
Pertanyaan umum
Apakah kode saya diunggah ke suatu tempat?
Tidak. Kode diformat oleh pustaka yang berjalan di dalam browser Anda, pada thread latar belakang. Tidak ada yang dikirim ke server. Hanya pengaturan dan draf opsional yang disimpan di penyimpanan lokal browser ini, dan Anda dapat mengosongkan kotak kapan saja.
Apakah pemformatan mengubah cara kerja kode saya?
Formatter hanya mengubah tata letak: indentasi, jeda baris, dan spasi. Ia juga bisa menyeragamkan tanda kutip, menambah atau menghapus tanda kurung opsional, dan merapikan titik koma, tetapi artinya tetap sama. Ia tidak memeriksa logika, tipe, atau aturan lint, jadi kode yang benar tetap benar dan kode yang salah tetap salah.
Bagaimana bahasa dideteksi?
Jika Anda membuka file, ekstensinya yang menentukan. Jika tidak, alat ini membaca teksnya: tag, kurung kurawal, kata kunci, dan tanda baca khas. Saat dua bahasa mirip, misalnya CSS dan SCSS atau JavaScript dan TypeScript, alat ini bertanya kepada Anda alih-alih menebak. Anda selalu bisa memilih bahasa secara manual dari daftar Bahasa.
Bagaimana jika kode saya memiliki kesalahan sintaks?
Hasil tetap kosong, input Anda dibiarkan persis seperti semula, dan Anda mendapat pesan singkat berisi baris dan kolomnya. Gunakan tombol Tampilkan di input untuk menuju lokasi itu, perbaiki, lalu tekan Format lagi.
Bisakah saya meminify kode di sini?
Hanya JSON, karena menghapus spasi di sana selalu aman. Meminify JavaScript atau CSS dengan benar membutuhkan minifier khusus, sebab mengganti nama variabel atau menggabungkan aturan dapat mengubah perilaku, jadi alat ini tidak melakukannya. Untuk pemeriksaan sintaks SQL yang lebih dalam, gunakan SQL Formatter & Validator.