JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css">
<div class="container">
  <div class="row">
    <div class='left col'>
      <img src="http://i.imgur.com/O7jcVLk.png" class="img-fluid" />
    </div>
    <div class='right col'></div>
  </div>
</div>

JavaScript

var jsonResponse = {
  "status": "Succeeded",
  "recognitionResult": {
    "lines": [{
      "boundingBox": [
        18,
        170,
        115,
        171,
        114,
        182,
        17,
        181
      ],
      "text": "Sales Person",
      "words": [{
        "boundingBox": [
          18,
          171,
          59,
          171,
          58,
          183,
          17,
          183
        ],
        "text": "Sales"
      }, {
        "boundingBox": [
          63,
          171,
          122,
          171,
          121,
          183,
          62,
          183
        ],
        "text": "Person"
      }]
    }, {
      "boundingBox": [
        17,
        220,
        182,
        217,
        183,
        232,
        18,
        235
      ],
      "text": "Barcode Number 23725",
      "words": [{
        "boundingBox": [
          19,
          219,
          79,
          219,
          80,
          236,
          19,
          236
        ],
        "text": "Barcode"
      }, {
        "boundingBox": [
          76,
          219,
          136,
          219,
          137,
          236,
          77,
          236
        ],
        "text": "Number"
      }, {
        "boundingBox": [
          138,
          219,
          192,
          219,
          192,
          236,
          138,
          236
        ],
        "text": "23725"
      }]
    }, {
      "boundingBox": [
        19,
        238,
        98,
        237,
        99,
        250,
        20,
        251
      ],
      "text": "HELMET ISE",
      "words": [{
        "boundingBox": [
          21,
          239,
          71,
          239,
          71,
          252,
          21,
          252
        ],
        "text": "HELMET"
      }, {
        "boundingBox": [
          74,
          239,
          109,
          239,
          109,
          252,
          74,
          252
        ],
        "text": "ISE"
      }]
    }, {
      "boundingBox": [
    ...