JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://include.jaydata.org/datajs-1.0.3-patched.js"></script>
<script src="http://include.jaydata.org/jaydata.js"></script>
<script src="http://jaydata.org/examples/scripts/vendor/Northwind.js"></script>
    <script>

        //copy this line from Northwind.js
        northwind = new LightSwitchApplication.ApplicationData({name: 'ApplicationData',
            oDataServiceHost: 'http://gimnasio.azurewebsites.net/ApplicationData.svc',
            user: 'Desarrollo',
            password:'Qazpoi.1' });
        
        $(document).ready(function () {
            northwind.onReady(function(){

            northwind.ClientesSet.forEach(function (category) {
                var item = "<li class=@cls data-id=@id><a href=#>@name</a></li>"
                                    
                                    .replace("@Id", category.Id)
                                    .replace("@Nombre", category.Nombre);
                $('#categories').append(item);
            });
            })
        });

    
</script>
<body>
    <h1>Categories</h1>
    <ul id="categories"></ul>
   
   
</body>

JavaScript

/*//////////////////////////////////////////////////////////////////////////////////////
////// Autogenerated by JaySvcUtil.exe http://JayData.org for more info        /////////
//////                             oData  V2                                     /////////
//////////////////////////////////////////////////////////////////////////////////////*/
(function(global, $data, undefined) {

    
  $data.Entity.extend('LightSwitchApplication.Ajustes', {
     'Id': { 'key':true,'type':'Edm.Int32','nullable':false,'computed':true },
     'DescripcionDelDescuento': { 'type':'Edm.String','nullable':false,'required':true,'maxLength':255 },
     'PorcentajeMensualidad': { 'type':'Edm.Decimal','nullable':false,'required':true },
     'PorcentajeInscripcion': { 'type':'Edm.Decimal','nullable':false,'required':true },
     'Intereses': { 'type':'Edm.Boolean' },
     'DescuentoAplicado': { 'type':'Edm.Boolean','nullable':false,'required':true },
     'Ajustes_Clientes': { 'type':'Edm.Int32','nullable':false,'required':true },
     'CreatedBy': { 'type':'Edm.String','maxLength':255 },
     'Created': { 'type':'Edm.DateTimeOffset' },
     'ModifiedBy': { 'type':'Edm.String','maxLength':255 },
     'Modified': { 'type':'Edm.DateTimeOffset' },
     'RowVersion': { 'type':'Edm.Binary','nullable':false,'concurrencyMode':$data.ConcurrencyMode.Fixed,'computed':true },
     'Clientes': { 'type':'LightSwitchApplication.Clientes','required':true,'inverseProperty':'Ajustes' }
  });

  $data.Entity.extend('LightSwitchApplication.Caja', {
     'Id': { 'key':true,'type':'Edm.Int32','nullable':false,'computed':true },
     'Deposito': { 'type':'Edm.Decimal','nullable':false,'required':true },
     'Pago': { 'type':'Edm.Decimal','nullable':false,'required':true },
     'DescripcionDePago': { 'type':'Edm.String','nullable':false,'required':true,'maxLength':255 },
     'NumeroDeRecibo': { 'type':'Edm.String','nullable':false,'required':true,'maxLength':255 },
     'CantidadDisponible': {...