Node.js Express Json Beautifier

요즘은 Node.js에 관심이 많다.

예전에 React.js와 React-Native로 토이 프로젝트들을 많이 진행했었다.

뭔가 스택의 통일성이랄까. 같은 언어로 프론트/백을 할수 있다는 점이 마음에 들었고

좀 더 깊이 이해할 수 있을것 같았다.

튼 요즘은 대부분 API서버를 구축하고 있다.

만들면서 장고가 살~짝 그리워졌던 점이 하나 있는데 바로 시각적인 문제였다.

장고는 Rest framework를 사용하면 어드민 패널 등 사용자가 보는 모든 View를 기본적으로 이쁘게 꾸며줬다.

그래서 데이터값들이 제대로 표현되고 있는지 확인하기도 쉬웠다.

하지만 Node.js에는 당연히 그런 부분이 없다. 그래서 관련 자료를 찾아봤다.

나는 현재 Express를 위에 올려서 사용하고 있는데, express json beautifier 라고 검색하니 바로 나왔다.

먼저 아래의 명령어로 설치해준다.

npm install express-prettify

(yarn을 사용하는 경우 yarn add express-prettify)

설치를 완료했으면 상단에 아래의 라인을 추가한다.

import pretty from 'express-prettify';

이제 마지막으로 아래의 라인을 추가한다.

app.use(pretty({ query: 'p' }));

끝났다. 주소 뒤에 ?p 만 붙여주면 알아서 이쁘게 나온다.

먼저 적용하기 전 상태는 이렇다.

적용한 이후의 상태는 이렇다.

훨씬 깔끔해졌다.