[Tool] JSON Viewer Awesome - 理解 JSON 結構的好幫手

介紹
Json (JavaScript Object Notation) 是一種輕量級的資料交換格式，方便開發者在開發與閱讀，與早期使用的 XML 相比在進行資料交換時，沒有其多餘的格式可以降低傳輸封包的大小，增加其封包傳遞的效率 (...不自覺透露出年紀了)，這些都是給電腦看不是給人看得，如果開發者需要確認 Json 元素的值是否正常時，就另外需要透過工具達到，今天要分享的是 Chrome 擴充套件 - JSON Viewer Awesome，可以在瀏覽器上格式化 Json 內容幫助開發者在閱讀，方便快速找到想確認的資訊。

下載
由 Rahul Baruri 開發，下載請到 Chrome Extension 網頁安裝 : 傳送門

功能
Json Viewer Awesome 提供三種功能，分別是 Tree、Chart 以及 JSON Input，三種功能分別可以在右上角進行切換的動作

Tree
將網頁呈現內容進行 Json Format 的動作，舉例來說以下是未使用前的顯示文字，內容多的時候就難以閱讀想找需要的資訊也不方便，如果想要找到需要的資訊也是不容易的

使用 Json viewer Awesome 工具格式化之後，在閱讀上整體就清楚許多，並以節點的方式呈現 (特別喜歡黑色背景 !!)

Chart
這功能是我最愛的功能，其他的 Json 擴充套件沒有的，有時可能會因為第三方資訊回傳 Json 內容非常多，或是想要進一步了解回傳格式時的節點長相時，就可以將 response Json 資訊轉換為 Chart 做進一步確認的動作，也可以將其節點進行縮放與展開，背後是用 svg 實作 chart 功能

Json Input
顧名思義此功能提供使用者輸入需要 format 的格式，也是每個 Json 擴充套件都有的功能，按下 parser Json 之後會在 Tree 進行瀏覽的動作

感想
工欲善其事，必先利其器，在 Google Extension 也有類似的工具向是 Json View 提供類似的功能，或是之前同事推薦的線上網頁 Json Editor Online 將內容 paser 的動作，但比較過後我個人是更喜歡 JSON Viewer Awesome 套件，在此推薦給有此需求需要的朋友，在選擇上也多一種參考 :)