Cuadrícula con filas automáticas en CSS - Div no se va a la fila

Bulma – Cuadrícula dinámica y automática

Hoy te mostraré cómo hacer una cuadrícula o grid en donde cada sección se acople a la pantalla de manera automática y dinámica sin que tú sepas la cantidad de columnas que habrá.

Esto es útil para cuando tenemos contenido dinámico (ya sea generado por el lado del cliente o del servidor) y queremos que las tarjetas o cuadros sobrantes se bajen automáticamente a otra fila.

Básicamente haremos una cuadrícula que ajuste el contenido dinámico usando bulma y sus columnas. Verás que es muy sencillo.

(más…)

CRUD con MySQL, PHP, JavaScript y AJAX

CRUD con PHP, MySQL y AJAX

En este post te mostraré un ejemplo completo de CRUD que hace las operaciones fundamentales de la base de datos usando MySQL y PHP, pero además las llamadas se hacen con AJAX desde JavaScript.

CRUD con MySQL, PHP, JavaScript y AJAX

CRUD con MySQL, PHP, JavaScript y AJAX

Al final te dejaré el código completo que podrás descargar, probar y modificar, mismo que tendrá todas las operaciones para enviar y recibir datos desde JavaScript a un servidor PHP que se conecta a MySQL.

Básicamente todo se hará del lado del cliente, no vamos a procesar formularios con PHP, solo llamadas AJAX con JSON. Así que tendremos un CRUD con PHP y AJAX.

No vamos a usar ninguna librería como React, Vue o Angular; será JavaScript puro.

(más…)

Plantilla para mostrar temperatura y humedad – Diseño web

En este artículo te mostraré una plantilla de ejemplo para mostrar la temperatura y humedad. Será una plantilla simple y minimalista que solo tendrá el propósito de mostrar los datos de un termómetro.

Como lo dije anteriormente, será una plantilla de ejemplo para mostrar los datos de un termómetro como lo son la temperatura y humedad. Puedes basarte en ella para mostrar los datos de un sensor físico o de una API.

(más…)

PHP y React: ejemplo de aplicación web

Hoy te voy a mostrar cómo conectar dos tecnologías: PHP y React. Vamos a ver cómo traer y enviar datos a PHP (para guardarlos en MySQL) desde React también conocido como React JS.

Al final podremos decir que estamos conectando React con PHP y MySQL. Lo que vamos a hacer será las 4 operaciones fundamentales (Crear, actualizar, eliminar y obtener) datos de MySQL para pasarlos a PHP y luego a React a través de una API.

Como resultado vamos a tener una aplicación web creada totalmente con React que consume archivos de PHP a través de AJAX con JSON. Por cierto, será una SPA o Single Page Application.

(más…)

DatePicker de Buefy en español

Buefy es un paquete de componentes que combinan BulmaCSS y Vue.js. Entre esos componentes encontramos el b-datepicker que no es más que un seleccionador de fechas, calendario o datepicker.

Por defecto viene en inglés, pero provee la manera de especificar los meses y días en español, cosa que te enseñaré hoy: cómo poner el datepicker de Buefy en español.

(más…)

Cálculo del factorial de un número en JavaScript. Aplicación web online

Aplicación web para calcular el factorial de un número online

Para ejemplificar y combinar el uso de BigInt con los Web Workers en JavaScript me di a la tarea de crear una sencilla aplicación web que permite calcular el factorial de cualquier número, todo desde el navegador, es decir, online.

El uso de los Web workers es para hacer cálculos extensos, y el de BigInt para no quedarnos cortos a la hora de trabajar con números grandes. Por el momento sólo funciona en Chrome y Opera, ya que usa BigInt y no quise usar el polyfill.

Cálculo del factorial de un número en JavaScript. Aplicación web online

Cálculo del factorial de un número en JavaScript. Aplicación web online

Voy a explicar la creación de la aplicación web y cómo utilicé cada cosa para crear todo esto.

(más…)