Nhận một đoạn JSON từ API response mà nó trông như thế này:
{"name":"Nguyen Van A","age":25,"skills":["JavaScript","Python"],"address":{"city":"HCM","district":"Q1"}}Đọc được không? Về mặt kỹ thuật là được — nhưng mắt thì muốn từ chối. Chỉ cần paste vào tool này, một cái click, và bạn có ngay:
{ "name": "Nguyen Van A", "age": 25, "skills": [ "JavaScript", "Python" ], "address": { "city": "HCM", "district": "Q1" } }Đó là JSON Formatter. Còn nếu JSON của bạn bị lỗi cú pháp mà không biết lỗi ở đâu — phần Validator sẽ chỉ chính xác dòng nào, ký tự nào đang có vấn đề.
JSON là gì và tại sao nó quan trọng?
JSON (JavaScript Object Notation) là định dạng dữ liệu văn bản nhẹ, dễ đọc với người và dễ parse với máy. Ra đời từ JavaScript nhưng hiện tại gần như mọi ngôn ngữ lập trình đều hỗ trợ JSON — từ Python, PHP, Java cho đến Go, Rust.
JSON là "ngôn ngữ chung" của web hiện đại: REST API trả về JSON, config file dùng JSON (package.json, tsconfig.json…), database như MongoDB lưu dữ liệu dạng JSON, webhook payload cũng là JSON. Nói không ngoa, một developer ngày nay làm việc với JSON nhiều như làm việc với email.
Cú pháp JSON cơ bản gồm 6 kiểu dữ liệu:
| Kiểu dữ liệu | Ví dụ | Ghi chú |
|---|---|---|
| String | "Hello World" | Bắt buộc dùng nháy kép, không dùng nháy đơn |
| Number | 42, 3.14 | Không có phân biệt int/float |
| Boolean | true, false | Viết thường, không phải True/False |
| Null | null | Viết thường, không phải None hay NULL |
| Array | [1, 2, 3] | Danh sách có thứ tự, có thể chứa nhiều kiểu |
| Object | {"key": "value"} | Cặp key-value, key phải là string |
Tool này làm được gì?
Tool JSON Formatter + Validator tích hợp hai chức năng trong một:
| Chức năng | Mô tả | Khi nào dùng |
|---|---|---|
| Format (Pretty Print) | Thêm indent, xuống dòng, căn lề cho JSON thô thành dạng dễ đọc | Nhận JSON từ API, log file, response body cần đọc nhanh |
| Minify (Compact) | Xoá toàn bộ khoảng trắng không cần thiết, nén JSON về một dòng | Cần tối ưu dung lượng khi truyền qua mạng hoặc lưu vào database |
| Validate | Kiểm tra JSON có đúng cú pháp không, báo lỗi cụ thể nếu sai | Debug JSON bị lỗi parse, kiểm tra trước khi gửi lên server |
| Tree View | Hiển thị JSON dưới dạng cây có thể expand/collapse từng nhánh | Khám phá cấu trúc JSON phức tạp, nhiều tầng lồng nhau |
Cách sử dụng
- Bước 1: Dán JSON cần xử lý vào ô nhập liệu bên trên — có thể là JSON thô từ API, từ file, hoặc copy thẳng từ trình duyệt.
- Bước 2: Chọn thao tác: Format để làm đẹp, Minify để nén nhỏ, hoặc Validate để kiểm tra cú pháp.
- Bước 3: Kết quả hiện ra ngay lập tức ở ô bên dưới — nếu có lỗi, tool sẽ thông báo lỗi ở dòng nào, vị trí nào.
- Bước 4: Nhấn Copy để copy kết quả, hoặc Download để lưu thành file .json.
Các lỗi JSON phổ biến và cách nhận biết
Validator sẽ phát hiện những lỗi này — nhưng biết trước để sửa nhanh hơn:
| Lỗi | Ví dụ sai | Sửa lại |
|---|---|---|
| Dùng nháy đơn thay nháy kép | {'name': 'John'} | {"name": "John"} |
| Thiếu dấu phẩy giữa các phần tử | {"a": 1 "b": 2} | {"a": 1, "b": 2} |
| Dấu phẩy thừa ở cuối (trailing comma) | {"a": 1, "b": 2,} | {"a": 1, "b": 2} |
| Key không có dấu nháy kép | {name: "John"} | {"name": "John"} |
| Dùng comment trong JSON | {"a": 1 // comment} | Xoá comment — JSON không hỗ trợ comment |
| Giá trị undefined hoặc NaN | {"val": undefined} | Dùng null thay thế |
Mẹo: Lỗi trailing comma (dấu phẩy thừa ở cuối) là lỗi cực kỳ phổ biến với developer quen viết JavaScript — vì JS object cho phép trailing comma, nhưng JSON thì không.
Ai thường xuyên cần tool này?
- Backend developer: Debug API response, kiểm tra payload trước khi trả về client, format JSON trong log file cho dễ đọc.
- Frontend developer: Kiểm tra dữ liệu fetch từ API, xem cấu trúc response để biết cách destructure đúng field.
- QA / Tester: Validate request body gửi lên API test, kiểm tra response có đúng schema không.
- DevOps / SRE: Đọc JSON config, Kubernetes manifest, CloudFormation template có cấu trúc phức tạp.
- Data Analyst: Kiểm tra và làm sạch JSON data trước khi import vào database hoặc tool phân tích.
Format hay Minify — khi nào dùng cái nào?
| Format (Pretty Print) | Minify (Compact) | |
|---|---|---|
| Mục đích | Dễ đọc, dễ debug | Nhỏ gọn, tối ưu hiệu suất |
| Dung lượng | Lớn hơn (thêm whitespace) | Nhỏ nhất có thể |
| Dùng khi | Development, logging, documentation | Production API, lưu database, truyền mạng |
| Ví dụ | Config file trong repo, README | API response body, localStorage |
Nhanh, gọn, không cần đăng ký
JSON Formatter & Validator là một trong những tool được developer dùng nhiều nhất mỗi ngày — không phải vì nó phức tạp, mà vì nó giải quyết đúng một vấn đề nhỏ nhưng hay gặp: JSON trông rối rắm, cần đọc ngay mà không muốn tốn thời gian.
Toàn bộ xử lý diễn ra ngay trên trình duyệt của bạn, không có dữ liệu nào được gửi lên server — an toàn khi dùng với JSON nội bộ hay dữ liệu khách hàng. Bookmark lại để dùng khi cần nhé!
0 Bình luận