본문 바로가기

로딩 중...


JSON 편집기

API 응답을 받아 보면 정작 필요한 건 이름과 이메일 두어 개인데, created_at, 내부 id, 중첩된 메타데이터 같은 필드가 잔뜩 딸려 오는 경우가 많습니다. 이걸 그대로 CSV나 엑셀로 넘기면 안 쓰는 열이 화면을 다 채우죠. JSON 편집기는 응답에서 필요 없는 필드만 클릭으로 빼고, 남은 데이터를 CSV·JSON·YAML·XLSX로 바로 내보내는 도구입니다.

한 번 쓰고 말 데이터를 옮기려고 파싱 스크립트를 새로 짜는 게 늘 아까웠습니다. 필드 몇 개 지우자고 map에 구조분해 할당을 넣고, 다시 파일로 쓰는 코드를 붙였다 지웠다 하는 거요. 붙여넣고 뺄 필드만 눌러서 원하는 포맷으로 받으면 그만인 일을, 코드 없이 하려고 만들었습니다.

사용 방법

  1. 왼쪽 INPUT 패널에 JSON을 붙여넣거나 파일을 불러옵니다. EUC-KR 같은 파일이면 아래 읽기 인코딩을 바꿔 다시 열 수 있습니다. 뭘 넣을지 막막하면 샘플 버튼으로 시작해도 됩니다.

    JSON 편집기-guide-1

  2. 가운데 FIELDS 목록에서 뺄 필드의 × 버튼을 누릅니다. 지운 필드는 취소선으로 남고 **↩**로 언제든 되돌립니다. 중첩된 객체는 그룹으로 묶여 펼치면 하위 키까지 하나씩 골라 뺄 수 있고, 필드명을 더블클릭하면 내보낼 이름을 바꿀 수도 있습니다.

    JSON 편집기-guide-2

  3. 오른쪽 OUTPUT 패널 위에서 CSV, JSON, YAML, XLSX 중 하나를 고르면 결과가 바로 갱신됩니다. 복사 버튼이나 다운로드 아이콘으로 받으면 끝입니다.

    JSON 편집기-guide-3

JSON에서 특정 필드만 깔끔히 빼는 방법

코드로 필드를 뺄 때 흔히 쓰는 방법은 세 가지쯤 됩니다. 첫째는 구조분해 할당의 rest입니다. const { password, ...rest } = user처럼 빼고 싶은 키를 명시하고 나머지를 rest로 받는 방식인데, 배열이면 data.map(({ password, ...rest }) => rest)로 돌려야 합니다. 키 이름이 하드코딩되니 응답 스펙이 바뀌면 같이 고쳐야 하죠.

둘째는 lodash의 _.omit(obj, ['password', 'created_at'])입니다. 뺄 키를 배열로 넘길 수 있어 rest보다 유연하지만, 이 하나 쓰자고 lodash를 설치하긴 부담스럽습니다. 셋째는 Object.fromEntries(Object.entries(obj).filter(([k]) => k !== 'password'))처럼 직접 거르는 방법인데, 중첩된 키가 섞이면 재귀까지 붙어 금세 지저분해집니다.

세 방법 모두 결국 뺄 키를 미리 알고 코드에 적어야 합니다. 응답을 직접 눈으로 보면서 "이건 빼고 저건 두자"고 판단하는 일회성 작업엔 과합니다. 이 도구는 그 판단을 × 클릭으로 옮겨 놓은 셈입니다. 파싱된 필드가 목록으로 다 보이니 어떤 키가 있는지 먼저 확인하고, 필요 없는 것만 눌러 빼고, 남은 걸 원하는 포맷으로 받으면 됩니다. 중첩 객체는 address.city처럼 평탄화해서 보여 주므로, 깊은 키 하나만 빼는 것도 재귀 없이 클릭 한 번이면 됩니다.

뺀 데이터를 다른 포맷으로 넘기기

같은 데이터를 상황마다 다른 포맷으로 달라는 요청은 흔합니다. 백엔드엔 정제된 JSON, 기획자에겐 엑셀, 설정 파일엔 YAML 하는 식으로요. 포맷 버튼만 바꾸면 지금 필드 구성 그대로 다시 변환되니, 필드를 다시 고를 필요가 없습니다. CSV와 XLSX로 내보낼 때 중첩 객체는 address.city 같은 열로 펼쳐지고, JSON과 YAML은 원래 계층 구조를 유지합니다.

이름만 살짝 다듬어야 할 때도 있습니다. snake_case 응답을 CSV 헤더에선 사람이 읽기 좋게 바꾸고 싶다면, 필드명을 더블클릭해 새 이름을 적으면 원본은 그대로 두고 내보낼 이름만 바뀝니다.

자주 묻는 질문

내부에 깊게 중첩된(Nested) 객체 속성도 지울 수 있나요?

현재 시스템은 객체의 1Depth(최상위)에 위치한 키값을 기준으로 리스트를 추출하여 작동합니다. 내부에 깊게 중첩된 구조는 하나의 묶음으로 인식될 수 있으므로, 복잡한 계층을 평탄화(Flatten)한 뒤 입력하시면 더욱 세밀하게 열을 제거하실 수 있습니다.

입력한 코드가 갑자기 파싱 오류라고 나옵니다. 어떻게 해결하나요?

제이슨 문법은 매우 엄격합니다. 마지막 항목 뒤에 불필요한 쉼표(Trailing Comma)가 있거나, 키(Key) 값을 감싸는 큰따옴표("")가 누락되었을 확률이 높습니다. 입력하신 내용을 한 번 더 확인해 주세요.