오리데브JSON 뷰어
붙여넣은 JSON을 트리로 펼쳐 보고, 키를 눌러 값의 경로를 복사하세요. 데이터는 이 브라우저 밖으로 나가지 않습니다.
경로 표기 방법
| 표기 | 뜻 |
|---|---|
store | 최상위 객체의 store 키 |
items[0] | items 배열의 첫째 항목(0부터 셈) |
items[0].name | 첫째 항목의 name 키 |
["first name"] | 공백·특수문자가 든 키 |
색으로 구분한 값
- 문자열은 갈색, 숫자는 초록색, true·false·null은 보라색으로 표시합니다.
- 객체는 {키 개수}, 배열은 [항목 개수]로 접힌 상태에서도 크기를 보여 줍니다.
이럴 때 씁니다
- API 응답에서 원하는 값이 몇 단계 안에 있는지 찾을 때
- 배열에 항목이 몇 개 있는지 바로 볼 때
- JSON CSV 변환에 넣을 행 배열 경로(data.items)를 찾을 때
- 로그에 한 줄로 찍힌 JSON을 읽을 때
코드로 하려면
트리에서 복사한 경로는 코드에서 그대로 씁니다.
const res = await fetch(url).then(r => r.json()); console.log(res.items[0].name); # 파이썬 print(res["items"][0]["name"])
다른 개발·데이터 도구
자주 묻는 질문
JSON 뷰어는 어디에 쓰나요?
API 응답처럼 한 줄로 길게 붙은 JSON을 접고 펼 수 있는 트리로 보여 줍니다. 원하는 값이 어디에 있는지, 배열에 항목이 몇 개인지 한눈에 볼 수 있습니다.
경로 복사는 어떻게 쓰나요?
키를 누르면 data.items[0].name 같은 경로가 표시됩니다. 자바스크립트에서는 그대로 response.data.items[0].name처럼 쓰면 되고, JSON CSV 변환의 행 배열 경로에는 대괄호 없이 data.items처럼 배열까지만 적습니다.
큰 JSON도 열 수 있나요?
5MB까지 넣을 수 있습니다. 화면이 느려지지 않도록 처음 200개 항목만 펼쳐 두고, 배열은 1,000개까지 표시합니다.
JSON에 오류가 있으면요?
트리 대신 오류가 난 줄과 칸을 알려 줍니다. 자세한 위치는 JSON 정렬·검사에서 확인할 수 있습니다.