JSFiddle - React, Tailwind, and code Playground

HTML

<html>

<head>

    <link rel="stylesheet" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css">

    <link rel="stylesheet" href="https://cdn.datatables.net/rowgroup/1.1.0/css/rowGroup.dataTables.min.css">
    <link rel="stylesheet" href="https://cdn.datatables.net/fixedcolumns/3.2.6/css/fixedColumns.dataTables.min.css">

    <style>
        tr.odd td:first-child,
        tr.even td:first-child {
            padding-left: 4em;
        }
        
        table,
        th,
        td {
            border: 1px black;
            text-align: center;
            font: smaller;
        }
        
        td {
            white-space: nowrap;
        }
        
        td.wrapok {
            white-space: normal
        }
    </style>

</head>

<body>
    <div style="margin: 0 auto; width:855px;">
        <table id="example" class="stripe row-border order-column" style="width:100%">

            <thead>
                <tr>
                    <th>Name</th>
                    <th>Position</th>
                    <th>Office</th>
                    <th>Age</th>
                    <th>Start date</th>
                    <th>Salary</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>Tiger Nixon</td>
                    <td>System Architect</td>
                    <td>Edinburgh</td>
                    <td>61</td>
                    <td>2011/04/25</td>
                    <td>$320,800</td>
                </tr>
                <tr>
                    <td>Garrett Winters</td>
                    <td>Accountant</td>
                    <td>Tokyo</td>
                    <td>63</td>
                    <td>2011/07/25</td>
                    <td>$170,750</td>
                </tr>
                <tr>
                    <td>Ashton Cox</td>
                    <td>Junior Technical Author</td>
                    <td>San Francisco</td>
                    <td>66</td>
                   ...

JavaScript

$(document).ready(function() {
        $('#example').DataTable({
            order: [
                [2, 'asc'],
                [1, 'asc']
            ],
            rowGroup: {
                dataSrc: [2, 1]
            },
            scrollY: "300px",
            scrollX: true,
            paging: false,
            columnDefs: [{
                targets: [1, 2],
                visible: false
            }]


        });
    })