JSFiddle - React, Tailwind, and code Playground

by jlujan

HTML

<link rel="stylesheet" href="https://cdn.datatables.net/scroller/1.4.2/css/scroller.dataTables.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.13/css/dataTables.jqueryui.min.css">
<script src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/scroller/1.4.2/js/dataTables.scroller.min.js"></script>
<script src="https://cdn.datatables.net/1.10.13/js/dataTables.jqueryui.min.js"></script>
    <table width="100%" class="display" id="example" cellspacing="0">
        <thead>
            <tr>
                <th>Name</th>
                <th>Position</th>
                <th>Office</th>
                <th>Age</th>
                <th>Start date</th>
                <th>Salary</th>
    
            </tr>
        </thead>
        <tfoot>
            <tr>
                <th>Name</th>
                <th>Position</th>
                <th>Office</th>
                <th>Age</th>
                <th>Start date</th>
                <th>Salary</th>
            </tr>
        </tfoot>
             
        <tbody>
            <tr>
                <td>Tiger Nixon</td>
                <td>System Architect</td>
                <td>Edinburgh</td>
                <td>61</td>
                <td>25/04/2011</td>
                <td>$320,800</td>
            </tr>
            <tr>
                <td>Garrett Winters</td>
                <td>Accountant</td>
                <td>Tokyo</td>
                <td>63</td>
                <td>25/07/2011</td>
                <td>$170,750</td>
            </tr>
            <tr>
                <td>Ashton Cox</td>
                <td>Junior Technical Author</td>
                <td>San Francisco</td>
                <td>66</td>
                <td>12/01/2009</td>
                <td>$86,000</td>
            </tr>
            <tr>
                <td>Cedric Kelly</td>
                <td>Senior Javascript Developer</td>
                <td>Edinburgh</td>
        ...

JavaScript

//https://cdn.datatables.net/scroller/1.4.2/css/scroller.dataTables.min.css
//https://cdn.datatables.net/1.10.13/css/dataTables.jqueryui.min.css

//https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js
//https://cdn.datatables.net/1.10.13/js/dataTables.jqueryui.min.js
//https://cdn.datatables.net/scroller/1.4.2/js/dataTables.scroller.min.js

            var table1 = $('#example').DataTable({ paging: true,   
                scrollY:        200,
                deferRender:    true,
                scroller:       true });