En este tutorial básico de JavaScript con HTML vamos a ver cómo llenar una lista desplegable o select a partir de un arreglo o array. Te voy a enseñar dos ejemplos: uno para llenar un select con un array de tipo cadena y otro ejemplo más completo para ver cómo llenar un select con un arreglo de objetos, teniendo una propiedad como valor y otra como el texto mostrado. ...
En este corto post de comandos donde usamos la terminal vamos a ver cómo convertir un archivo a su representación como base64 (o base 64) usando el binario base64. Vamos a codificar un archivo como base64. ...
En el post de hoy vas a aprender a generar un PDF a partir del contenido de un editor WYSIWYG. Pondremos el editor de contenido a disposición del usuario para que pueda agregar texto e imágenes, y una vez terminado, pueda generar un PDF a partir de lo que haya diseñado. Dicho con otras palabras, te mostraré cómo generar un PDF a partir del texto enriquecido introducido por el usuario. Para esto vamos a usar JavaScript, summernote y dompdf. ...
En estos días estuve buscando un editor HTML o un editor WYSIWYG, parecido al editor de WordPress pero de una manera muy simple. Las siglas hacen referencia a What you see is what you get, que es algo como: lo que ves, es lo que obtienes. Puedes probar el resultado final en el siguiente enlace: https://parzibyte.github.io/ejemplos-javascript/wysiwyg/ Esto es debido a que el HTML resultante, al momento de ser mostrado en otro lugar, se verá igual que en el editor. El punto es que estuve buscando un editor WYSIWYG para integrar con JavaScript en el navegador web, de manera simple y rápida, permitiendo alinear el texto, insertar imágenes y obtener el HTML resultante. Después de buscar y revisar las licencias (está disponible bajo la licencia MIT), encontré summernote y lo quiero recomendar así como mostrarte cómo usar ese editor de HTML en tu web. ...
En el blog ya he escrito sobre cómo usar TailwindCSS con Vue 3 y Vite, pero no he hablado sobre cómo usarlo sin ningún framework, es decir, usar Tailwind CSS con HTML plano y puro, cosa que sí es totalmente posible. ...
Hoy vamos a aprender a comprimir imágenes usando Python y Pillow (Python Imaging Library o PIL). Para comprimir una imagen o foto con Python podemos reducir su calidad y/o resolución. La mayoría de ocasiones solo es necesario reducir la calidad de la imagen con Python, sin modificar su resolución (ancho y alto en pixeles) aunque también se puede cambiar esa medida. Veamos cómo comprimir una imagen con Python y PIL. ...
En este post te voy a enseñar una manera de reducir el tamaño de un PDF usando Python. Lo que te presentaré aquí no es magia, la reducción del tamaño del PDF va a depender de la composición del mismo. Si el PDF tiene varias imágenes, entonces su tamaño será reducido considerablemente. El enfoque que voy a usar es convertir el PDF a imágenes, comprimir cada imagen y volver a crear el PDF. Seguramente existen otras maneras de comprimir un PDF pero te cuento que este método me funcionó con un PDF que tenía varias imágenes en alta calidad. ...
En este tutorial de Python veremos cómo convertir las páginas de un PDF a imagen, convirtiendo cada página del documento a una imagen y guardándola en el almacenamiento, indicando la resolución. No vamos a extraer cómo extraer las imágenes del PDF, vamos a convertir las páginas de un PDF a imágenes con Python. Para esto vamos a usar pypdfium, un paquete de Python que es una vinculación de PDFium. ...
El día de hoy vamos a ver cómo mostrar las opciones de un select en JavaScript de manera programada, es decir, abrir el select con JS mostrando sus opciones como si el usuario hubiera hecho clic sobre el elemento. Sorprendentemente, invocar a la función click del elemento no funciona. Podemos enfocarlo con focus, pero el select solo va a estar enfocado y no va a mostrar la lista de opciones. Entonces veamos cómo mostrar las opciones de un select (abrir select) con JavaScript. ...
En Vue 3 se pueden comunicar componentes de padre a hijo con las propiedades (props), defineEmit y defineExpose. Voy a dejar esa comunicación de componentes simples (padre a hijo o viceversa) para otro post, ahora quiero enfocarme en comunicar componentes sin importar lo “separados” que estén, invocando funciones de otros componentes desde cualquier componente. Por ejemplo, vamos a ver cómo comunicar componentes hermanos, nietos, etcétera. Comunicar componentes de Vue 3 sin usar emit ni expose, para ello vamos a usar una store de Pinia. ...