Guía R-003 – Caso práctico de React con AnyChart

Como había indicado en la Guía anterior he realizado este ejemplo utilizando la funcionalidad de este otro artículo de mostrar la integración de AnyChart con los Snippet de PHPRunner.

El ejemplo es muy sencillo, porque así entiendo que es más sencillo para la comprensión de los desarrolladores que empiezan a utilizar React, pero creo que explica con detalle la integración y potencia de la utilización de esta biblioteca gráfica de JavaScript (AnyChart).

Objetivo

Integrar en una misma página varios gráficos producidos por AnyChart ( Semi-donut y Mapas Temáticos), produciendo los cambios de datos por la selección de un campo Lookup.

DEMO: (versión React) https://fhumanes.com/map_anychart-react
DEMO: (versión PHPRunner) https://fhumanes.com/map_anychart

Si estas interesado en este artículo, mediante este enlace tendrás la explicación y los fuentes.

Guía R-002 – Incorporar toda la potencia de Anychart a REACT

Aquel que conozca un poco mis gustos en la informática, sabrá que la biblioteca de Anychart, además de ser completísima, tiene multitud de ejemplos completos y con posibilidades de modificación, excelente documentación y un soporte técnico que rápidamente responde con una o varias soluciones, es mi preferida para representar gráficos de todos los tipos.

Objetivo

Estudiar cómo la misma solución de gráficos que tiene PHPrunner se puede utilizar en React.

Demo: https://fhumanes.com/anychart-react/

Si este artículo es de tu interés, sigue leyendo en este enlace.

Guía R-001 – Mostrar Grid de tarjetas («card»)

En las aplicaciones de móvil es muy frecuente que las listas de los grid (rejillas) no se vean bien, por el espacio tan escaso que se dispone en la visualización de los móviles en vertical.

Por esta razón, he estado revisando en el ejemplo de «compra-react» alternativas para la visualización de los «listados» de «compras» y «productos».

Objetivo

Mejorar la visualización de los GRID en las aplicaciones para los móviles.

DEMO: https://fhumanes.com/compra2-react/

Comparte base de datos y usuarios con la aplicación de «compra«.

Si estas interesado en este artículo, sigue leyendo haciendo clic en este enlace.

Guía 90 – Utilización de HotKeys en PHPRunner

Alan, en su desarrollo, requiere establecer acciones cuando se pulsa una combinación de teclas.  Me facilitó como referencia el artículo : https://asprunner.com/forums/topic/28756-Keyboard-Shortcuts-for-your-application que estaba muy bien descrita la solución, no obstante tuve problemas para localizar la biblioteca de JavaScript y no había un ejemplo completo.

Buscando, localicé esta solución https://raw.githack.com/jaywcjlove/hotkeys/b3cb4a3/index.html, que principalmente viene explicado para REACT (lo mismo encontré con otras bibliotecas), pero que también dispone de su versión para WEB https://unpkg.com/browse/[email protected]/dist/.

Objetivo

Incorporal a los desarrollos de PHPRunner la funcionalidad de HotKeys, con la configuración única para todo el proyecto.

DEMO: https://fhumanes.com/hotkeys/

// JavaScript file customization example for programming the "Hotkey" keys from the browser
hotkeys('ctrl+a,ctrl+b,ctrl+alt+t,ctrl+alt+v,ctrl+alt+s', function (event, handler){
  switch (handler.key) {
    case 'ctrl+a': alert('you pressed ctrl+a!');
      break;
    case 'ctrl+b': alert('you pressed ctrl+b!');
      break;
   case 'ctrl+alt+t': location.href = 'tabla_list.php';
      break;
   case 'ctrl+alt+v': location.href = 'view_list.php';
      break;
   case 'ctrl+alt+s': $('a[id^="saveButton"]').click(); // This JQUERY button SAVE
      break;
    default: alert(event);
  }
});

Si está interesado en esta solución, accede al artículo en este enlace.

Inauguración de la categoría «React»

Si sois habituales de este Blog, habréis visto en la Guía 83, en la que informo que estaba estudiando el entorno de desarrollo React, para poder hacer desarrollos «BUENOS» para los móviles.

En el tiempo que ha transcurrido, he avanzado bastante y tengo buenos ejemplos para todos aquellos que busquen cómo desarrollar un interfaz para móvil, de su aplicación PHPRunner. Esta alternativa, creo, le puede interesar mucho a todos los que tengan esa necesidad.

Os facilito los enlaces a las páginas creadas:

React es una solución muy extendida y tiene multitud de componentes gratuitos que son muy interesantes. Seguiré explorando y publicando aquellos aspectos que me resulten interesantes y novedosos.

Blog personal para facilitar soporte gratuito a usuarios de React y PHPRunner