JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//gyrocode.github.io/jquery-datatables-checkboxes/1.2.9/css/dataTables.checkboxes.css">
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/select/1.2.3/css/select.dataTables.min.css">
<script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/select/1.2.3/js/dataTables.select.min.js"></script>
<script src="//gyrocode.github.io/jquery-datatables-checkboxes/1.2.9/js/dataTables.checkboxes.min.js"></script>
<table>
  <thead>
    <tr>
      <th></th>
      <th>
        Col
      </th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>1</td>
      <td>1</td>
    </tr>
    <tr>
      <td>2</td>
      <td>2</td>
    </tr>
  </tbody>
</table>

JavaScript

$(function() {
  var table = $('table').DataTable({

    'columnDefs': [{
      'checkboxes': {
        'selectRow': true
      },
      'targets': 0
    }],
    'select': {
      'style': 'multi',
      'selector': 'td:first-child'
    },
    'dom': 'tlpi'
  });

});