title: how to dynamically parse Json data using reactjs
body: <p>I have a requirement to determine a generic standard approach to read the JSON data ( should be able to read any JSON structure) and display in reactjs page. 
  I know that if we know JSON structure, we can traverse through it and display the data in the page accordingly. But here JSON structure
  should be dynamically determined via code and we should not code specifically for each JSON structure.</p>
  
  <p>For example, I have given Sample1.json and Sample2.json files below. My program should be able to parse Sample1.json if I use it and display
  them on the page. If I use Sample2.json, still it should be able to parse them and display the data dynamically. We should not have
  code specifically like archive_header.tracking_id or stock_ledger_sales_key.version_number...etc.</p>
  
  <p>Can someone please let me know how to handle this scenario?</p>
  
  <p><strong>Sample1.json</strong></p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>{
    "archive_header": {
      "tracking_id": "914553536-FRM01-20163609140455-000000001",
      "archived_timestamp": "2018-05-08T09:14:04.055-05:00"
    },
    "journal_record_key": {
      "location_number": "389234",
      "dept_number": "28822"
    },
    "journal_record_detail": {
      "financial_from_item_number": "771",
      "financial_to_item_number": "771"
    }
  }</code></pre>
  </div>
  </div>
  </p>
  
  <hr>
  
  <p><strong>Sample2.json</strong></p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>{
    "stock_ledger_sales_key": {
      "version_number": "12",
      "account_month_number": "01",
      "account_year_number": "2016"
    },
    "stock_ledger_sales_detail": {
      "mature_increase_mtd_percentage": "1.2",
      "mature_increase_stdt_percentage": "2.3",
      "mature_increase_ytd_percentage": "2"
    }
  }</code></pre>
  </div>
  </div>
  </p>