Condicional if en Thymeleaf El motor de plantillas de Thymeleaf (usado mayormente en Spring Boot) provee una manera de usar condicionales, por ejemplo, un if. Gracias al if en Thymeleaf podemos mostrar u ocultar elementos HTML de la plantilla dependiendo de una condición. En este tutorial te mostraré cómo usar if en Thymeleaf. ...

Cómo acceder a una variable de la URL en Spring Boot Cuando programamos en Java usando el framework Spring Boot es muy común definir rutas en donde se define un parámetro pasado a través de la URL. Por ejemplo, podemos tener la siguiente ruta: http://localhost:8080/productos/editar/16 En este caso el último número es un parámetro de la ruta. Ahora bien, ¿cómo acceder a la variable de la ruta en el controlador de Spring Boot? ...

Hacer redirección en el framework Spring Boot Este post es muy corto. Te mostraré a hacer una redirección o dirigir al usuario a otra URL dentro del método de un controlador en el framework de Java llamado Spring Boot. Redirigir a otra URL en Spring Boot es muy útil cuando el usuario hace determinada acción y debemos devolverlo a la página principal. ...

Agregar clase a elemento HTML con Thymeleaf En este post te mostraré cómo agregar una clase HTML a un elemento (como un div, un párrafo, etcétera) de manera dinámica usando Thymeleaf, un motor de plantillas usado mayormente en Spring Boot. ...

Iniciar proyecto de Spring Boot usando Gradle Tutorial para iniciar en Spring Boot usando Gradle: en este post te voy a enseñar cómo crear tu primer proyecto usando Spring Boot, un framework web de Java. Veremos cómo iniciar un nuevo proyecto, hacer un hola mundo con Spring Boot y generar finalmente un archivo JAR para empaquetar el proyecto compilado. Todo esto lo haremos con Gradle, verás que es realmente sencillo. Nota: puedes probar y descargar el JAR generado en este enlace, solo asegúrate de tener Java en tu PC. También puedes ver todo el código en el repositorio de GitHub. ...

Renderizar o dibujar una tabla HTML con JavaScript En este post te mostraré a crear una tabla dinámica o elemento <table> de HTML con JavaScript. Es decir, con JavaScript puro dibujar una tabla, agregarle filas y columnas. Para ello no usaremos ningún framework. Las funciones que veremos son: document.createElement - Para crear un elemento, en este caso el tr y el td document.querySelector - Obtener referencia a elementos del DOM elemento.appendChild - Adjuntar un elemento hijo a otro elemento Lo que vamos a dibujar en la tabla es un arreglo. Es decir, a partir del arreglo vamos a dibujar una tabla HTML con JavaScript de manera dinámica. ...

Uso de los atributos data en HTML y JavaScript Los atributos data de HTML son atributos personalizados que ayudan a asociar información a un elemento HTML (incluso si es creado de manera dinámica) con JavaScript. Estos atributos vienen de maravilla cuando tenemos elementos dinámicos y queremos acceder a ellos en el click de un botón o de ellos mismos. Lo que haremos hoy es ver cómo asociar información de una variable de JavaScript a un elemento HTML para después recuperarla en el click del botón: ...

Explicación de querySelector y querySelectorAll en JavaScript Introducción a querySelector y querySelectorAll en JS. En este post te explicaré dos funciones de JavaScript que funcionan para obtener referencia a un elemento del DOM. Estoy hablando de: document.querySelector document.querySelectorAll Que bien son un remplazo de document.getElementById y otras funciones un poco complejas. ...

Cortar cadena (obtener parte de string) en JavaScript En este post te mostraré a obtener un fragmento de una cadena en JavaScript, es decir, cortar o extraer parte de una cadena de otra usando JS. Este ejercicio sirve para extraer parte de una cadena en el navegador y en Node.js Nota: recuerda que esto ya lo hicimos con PHP. ...

Hacer petición HTTP POST en PHP En este post te mostraré a usar PHP para hacer una petición a través de HTTP usando el método POST. Veremos cómo enviar datos de formulario y cómo enviar JSON. Normalmente PHP se utiliza como servidor para servir y atender peticiones, pero de igual forma se puede usar como cliente para consumir otros servicios. Por poner un ejemplo, me viene a la mente aquella ocasión en la que acortamos enlaces con coinhive. Las funciones que veremos son: http_build_query stream_context_create file_get_contents json_encode Verás que será muy sencillo. Las peticiones serán hechas a httpbin.org, un sitio que sirve como espejo para indicar lo que le enviamos, perfecto para probar. ...