JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.19/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
<link rel="stylesheet" href="http://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css">
<!DOCTYPE html>
<html>
  <head>
<link href="https://cdn.datatables.net/select/1.2.0/css/select.dataTables.css" rel="stylesheet" type="text/css" />
<script src="https://cdn.datatables.net/select/1.2.0/js/dataTables.select.js"></script>
   <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>

    <link href="https://nightly.datatables.net/css/jquery.dataTables.css" rel="stylesheet" type="text/css" />
    <script src="https://nightly.datatables.net/js/jquery.dataTables.js"></script>

    <meta charset=utf-8 />
    <title>DataTables - JS Bin</title>
  </head>
  <body>
    <div class="container">
      <table id="grid" class="table table-striped table-bordered">
        <thead>
            <tr>
                <th></th>
                <th>ID</th>
                <th>Nombres</th>
                <th>Apellidos</th>
                <th>RUN</th>
                <th>Empresa</th>
                <th>Licencias</th>
                <th>Faenas</th>
                <th>Requisitos</th>
                <th>Infracciones</th>
                <th>Fecha Registro</th>
                <th>Fecha Actualización</th>
                <th></th>
            </tr>
        </thead>
        <tbody>
                  <tr>
                <td></td>
                <td>5</td>
                <td>Conductor 1</td>
                <td>Apellido 1</td>
                <td>33.333.333-3</td>
                <td>Empresa Colaboradora</td>
                <td>B</td>
                <td>Las...

JavaScript

$(document).ready( function () {
  grid = $('#grid').removeAttr('width').DataTable({
                language: {
                    url: "//cdn.datatables.net/plug-ins/1.10.19/i18n/Spanish.json",
                    select: {
                        rows: {
                            _: "%d conductores seleccionados",
                            0: "",
                            1: "1 conductor seleccionado"
                        }
                    }
                },
                dom: "<'row'<'col-sm-12 col-md-4'<\"toolbar\">><'col-sm-12 col-md-4'l><'col-sm-12 col-md-4'f>>" +
                        "<'row'<'col-sm-12'tr>>" +
                        "<'row'<'col-sm-12 col-md-5'i><'col-sm-12 col-md-7'p>>",
                processing: false,
                serverSide: false,
                colReorder: true,
                orderMulti: false,
                //autoWidth: false,
                rowId: "id",
                columns: [
                    {
                        data: null,
                        defaultContent: '',
                        orderable: false,
                        className: 'select-checkbox',
                        width: 35
                    },
                    {data: "id", width: 100},
                    {data: "nombres", width: 120},
                    {data: "apellidos", width: 120},
                    {data: 'runFormateado', width: 80},
                    {data: 'empresa', width: 200, orderable: false},
                    {data: 'licencias', width: 120, orderable: false},
                    {data: 'faenas', width: 200, orderable: false},
                    {data: 'requisitosWebcontrol', width: 100},
                    {data: 'infracciones', width: 100, orderable: false},
                    {data: "createdAt", width: 130},
                    {data: "updatedAt", width: 130},
                    {
                        data: null,
                        className: "text-center",
                 ...