JASoft.org

El blog de José Manuel Alarcón Aguín. Programación web y mucho más...

MENÚ - JASoft: JM Alarcón

Personalizar Emmet en Visual Studio Code y librarse del meta "X-UA-Compatible ie=edge"

Emmet es un inventazo. Si no lo conoces ya estás tardando en aprenderlo. Visual Studio Code lo tiene integrado y puedes ahorrar mucho tiempo haciendo tus páginas Web. Sin embargo una de las abreviaturas más importantes, html:5, genera un código un poco "chungo" que estaría genial poder cambiar a voluntad y meter lo que realmente usemos nosotros casi siempre. En este post te explico cómo lograrlo y cómo puedes crear más abreviaturas para acelerar más el trabajo todavía. [Más]

Cómo usar una hoja de cálculo de Google como backend JSON

Hoy te voy a contar cómo puedes montar en un minuto un "backend" de pruebas para cualquier desarrollo utilizando tan solo una hoja de cálculo de Google Drive (Google Sheets). Imagina que tienes que crear un prototipo para un cliente y que no tienes un backend público montado contra el que trabajar para obtener datos. O quizá quieres mostrar una serie de datos en tu web que pueden cambiar con cierta frecuencia y no se justifica montar una base de datos para mantenerlos... Puede haber muchos casos por el estilo. Existen diversas maneras de crear un backend de prueba, pero pocas cosas hay tan sencillas para guardar datos como una simple hoja de cálculo ¿verdad? Vamos a ver dos métodos de hacerlo. [Más]

Logpoints en Chrome: una excelente utilidad para depurar y no ensuciar el código

Una de las novedades que trae Chrome 73 es pequeña pero súper-interesante. Se trata de los Logpoints. Un logpoint es un tipo especial de punto de interrupción que podemos añadir a nuestro código JavaScript y que, en lugar de detener la ejecución del código, se limita a "loguear" a la consola lo que le digamos. Esto nos evita tener que andar metiendo console.log constantemente en el código tan solo para ver algunos valores. Te lo cuento... [Más]

Cómo instalar un certificado HTTPS en IIS Express para desarrollo en local

En mi último post te contaba cómo podías generar un certificado HTTPS válido para poder hacer desarrollo en local usando conexiones seguras (necesarias para usar ciertas APIs de HTML5), incluso simulando el dominio real que se usará en la aplicación final. El método vale para cualquier sistema operativo y genera certificados válidos solo para la máquina local, por lo que son perfectos para desarrollo. Ahora toca ver cómo montar ese certificado en tu servidor local de desarrollo. Cada uno tiene su método. Yo me voy a ocupar de IIS Express. [Más]

Cómo generar certificados HTTPS para desarrollo local que no produzcan errores

El uso de conexiones seguras se está volviendo imprescindible también a la hora de desarrollar. El principal motivo es que cada día más APIs de HTML5 requieren el uso de HTTPS para poder funcionar. Por ejemplo, la API de geolocalización, la de notificaciones o la de service workers entre otras muchas. Debido a ello, si necesitamos desarrollar aplicaciones con ciertas características, no nos queda más remedio que utilizar también HTTPS en nuestros equipos de desarrollo para poder probar y afinar el código. En este artículo te voy a contar cómo puedes montar un entorno de desarrollo que utilice HTTPS contra localhost, de manera sencilla en cualquier sistema operativo de escritorio (Windows, Mac y Linux). [Más]

Qué pasa cuando escribes la dirección de una web en tu navegador y cómo simular cualquier dominio en tu equipo local para desarrollo

Lo que voy a contar hoy es algo de "cultura general", pero también es cierto que muchas personas lo desconocen todavía, sobre todo si están comenzando en el mundo de la programación web. Empezaré repasando cómo es el funcionamiento básico desde el momento en el que escribimos una dirección web en un navegador y hasta que empieza a solicitarse la página de verdad, y luego explicaré un sencillo proceso que te permite simular que cualquier dominio de internet, exista o no, está en cualquier servidor que tu quieras. ¡Vamos allá! [Más]

Tutorial: ngrok - cómo publicar en Internet cualquier página o aplicación web que tengas en tu equipo local

Está claro que si queremos publicar un sitio o aplicación web de manera permanente debemos configurar y gestionar un servidor web, o contratar algún tipo de servicio básico (hosting) o avanzado (Cloud PaaS) para hacerlo. Pero en muchas ocasiones lo único que queremos es poder exponer temporalmente hacia el exterior de manera sencilla un desarrollo que hemos hecho y que tenemos en nuestra máquina local. Existen muchos casos en los que esto es interesante. Para suplir estas necesidades, una herramienta estupenda y cada vez más utilizada es ngrok (pronunciado "en-groc"). Como me gusta mucho y le saco mucho partido, m he decidido a crear este tutorial para que tú también puedas exprimirle toda su utilidad. ¡Allá vamos! [Más]

Copiado de texto al portapapeles con JavaScript - API Asíncrona

El mes pasado os hablaba aquí de una manera sencilla y soportada por todos los navegadores para acceder al portapapeles desde código JavaScript en el navegador. Es un método simple pero un poco engorroso de implementar, puesto que hay que seleccionar rangos en la página para poder copiar su contenido. Además, su implementación varía ligeramente de un navegador a otro porque no está estandarizada. Otra pega importante que tiene el método "clásico" es que es síncrono. Para solucionar todos estos problemas la W3C ha creado la Async Clipboard API. A continuación te cuento cómo sacarle partido. [Más]

Copiado de texto al portapapeles con JavaScript - Método "clásico"

Hasta no hace muchos años, facilitar programáticamente que la gente pudiera copiar (o cortar) contenido de una página para llevárselo al portapapeles no era tarea tan fácil. Es decir, si por ejemplo tenías un fragmento de código en tu página de contenidos, y querías ponerle un botón de "Copiar" para facilitar a tus visitantes su copiado al portapapeles, la cosa no era tan fácil. De hecho si querías asegurar que iba a funcionar en todos los navegadores debías recurrir al uso de Flash =:-O En la actualidad la forma de hacerlo está estandarizada y extendida, por lo que resulta más fácil, pero lo curioso es que lo complicado del caso no es tanto copiar al portapapeles sino cómo decidir qué es lo que se va a copiar, así como las pequeñas diferencias entre navegadores a la hora de hacerlo. En este artículo te lo cuento... [Más]

Variables en el lenguaje CSS: Guía de uso y abuso

CSS es un lenguaje más bien pobre: no dispone de construcciones complejas que nos permitan tomar decisiones con condicionales, repetir operaciones mediante bucles, etc... La máxima lógica que nos permite aplicar es cambiar ciertas definiciones en función del medio (pantalla, impresora...) o los anchos y resoluciones (media-queries). Esto hace que mantener hojas de estilo CSS muy grandes resulte complicado. Por ejemplo, si estamos reutilizando un color o una dimensión (ancho o alto) a lo largo de un documento CSS muy largo, no nos queda más remedio que repetir el mismo valor una y otra vez. Si más adelante decidimos cambiarlo tenemos que buscar y reemplazar con cuidado en el documento de texto. Las variables CSS son una realidad en todos los navegadores modernos desde hace muy poco tiempo, pero ya podemos sacarles todo el partido. Con este completo artículo aprenderás a dominarlas... [Más]