Según nos informa Wikipedia:

React (también llamada React.js o ReactJS) es una biblioteca Javascript de código abierto diseñada para crear interfaces de usuario con el objetivo de facilitar el desarrollo de aplicaciones en una sola página. Es mantenido por Facebook y la comunidad de software libre. En el proyecto hay más de mil desarrolladores libres.

Un ejemplo de desarrollo realizado (por INDRA) con esta tecnología es: https://resultados2023.comunidad.madrid/es/

React, se creo y difundió hace 10 años y según los entendidos, es fácil de aprender y es la solución más utilizada por los desarrolladores que utilizan JavaScript para el desarrollo del Front-end de las aplicaciones.

Me habló de esta solución, mi hijo, exponiéndome las características de la solución y lo implantada que estaba en el mercado actual y me compré un libro para aprender “REACT, curso práctico”, de Santiago Aguirre.

Es muy importante imaginar/entender la arquitectura de la solución. Con esta solución (que es similar a Angular.js y VU.js) desarrollamos el interfaz de la aplicación, pero requerimos otro desarrollo de Back-end, para mantener la persistencia de los datos y/o los objetos de negocio. Este desarrollo de Back-End puede ser PHP, Java, etc. En nuestro caso será PHPRunner, ya que nos facilita un desarrollo muy rápido y acceso a casi cualquier gestor de base de datos.

Yo veo adecuada esta tecnología para los desarrollos que tengan que ver con el usuario final (ciudadano, profesor, alumno, etc.) y para todos aquellos que requieran un dispositivo móvil. Es muy sencillo “empaquetar” este tipo de aplicación en una APP Android o IOS.

También, este tipo de solución SPA (aplicaciones de una sola página) se integran perfectamente con gestores de contenidos CMS, como WordPress, etc.

Comentaros que aún siendo accesible, no es tan fácil, al menos, para aquellos que no tengan buen conocimiento con HTML, JavaScript, CSS, PHP y SQL. Se suele disponer de 2 perfiles, el desarrollador de Front-end (REACT) y el del Back-end (PHP), pero eso es en los equipos de desarrollos y no es el caso de muchos de nosotros.

Objetivo

• Aprender React siguiendo el libro. (instalación de la infraestructura necesaria para el desarrollo)
• Utilizar un ejemplo de GITHUB donde se integra React y PHP. “parzibyte.me”
• Adaptar el ejemplo para utilizar PHPRunner en el Back-end.
• Hacer una APP Android de la aplicación desarrollada.

DEMO: https://fhumanes.com/react_api/

Back-end: https://fhumanes.com/api_php

Si estás interesado en el tema, sigue leyendo el artículo en este enlace.

Como sabéis, los usuarios habituales de este blog, ya había publicado un artículo sobre la solución de PivotGrid utilizando la biblioteca de DevExtreme.

En esta ocasión, este ejemplo, tiene las siguientes características que le diferencia del anterior:

• El modelo de datos en el que se basa es mucho más simple, para que la compresión sea más fácil.
• Utiliza un Api Rest para acceder a los datos. Que es la forma estándar que se utiliza con todos los interfaces de JavaScript (React, Angular, Vue.js, etc.)
• Nos permite, desde la propia visualización Pivot, actualizar los registros base.

La petición me ha hecho un desarrollador para poder implementar un sistema de control de tesorería o “CashFlow” y puede emplearse para muchos otros detalles como para la evaluación de presupuestos de empresa, etc.

Objetivo

Definir un PivotGrid, muy potente en su definición y representación y poder actualizar la información base desde el mismo interface gráfico.

DEMO:  https://fhumanes.com/devextreme_php/

Si estás interesado en este tema, sigue leyendo el artículo en este enlace.

En esta ocasión voy a explicaros cómo utilizar una biblioteca de JavaScript para integrar los datos de un aplicativo PHPRunner en WordPress. Muy importante, el gestor de base de datos que aportará la información es el de la aplicación PHPRunner (MySQL, SQLServer, Oracle, Ingres, SQLite, etc.).

La técnica de integración va a ser la utilizada en los 2 artículos anteriores, es decir, utilización de un plugin de WP que ejecute una URL e integre el resultado en la página de WordPress.

Como conocéis, soy gran admirador de la solución de “DevExtreme” y he utilizado una parte muy pequeña de las solución que aporta en la publicación de “Grid”. El método de integración es similar siempre que la librería disponga de un interface de JQuery.

Objetivo

Publicar información de aplicación PHPRunner en BLOG de WordPress utilizando solución de biblioteca JavaScript con interface JQuery.

Si te interesa el artículo, sigue leyéndolo en este enlace.

Esta solución, en su versión anterior no se controlaban las validaciones de los campos y resultaba chocante el que apareciera el “Alert” de diálogo y que luego dijera que no había validado los datos y por ello, no había actualizado el registro.

En esta versión se resuelve esto validando uno a uno, los campos del formulario.

El código ha quedado de esta forma:

/* Validation fields */

var fields = ['text1','number1'];  // All fields to validate

var validation = true;
let i = 0;
while (i < fields.length) {
    var ctrl = Runner.getControl(pageid, fields[i]);
   var status = ctrl.validate();
   if (status.result == false) {
      validation = false;
   }
    i++;
}
console.log("validation: "+ validation);

if ( validation ) {
  Swal.fire({
    title: 'Do you want to save the changes?',
    showDenyButton: true,
    // showCancelButton: true,
    confirmButtonText: 'Save',
    denyButtonText: "Don't save",
    }).then((result) => {
    /* Read more about isConfirmed, isDenied below */
      if (result.isConfirmed) {
         Swal.fire('Saved!', '', 'success')
         // $('#saveButton7').click();
         $('a[id^="saveButton"]').click();

      } else { 
      if (result.isDenied) {
        Swal.fire('Changes are not saved', '', 'info') 
      }
    }
   })
}
return false

Creo que la solución, así, queda más consistente y válida.

Si deseas leer todo el artículo, sigue este link.