Autonomía digital y tecnológica

Código e ideas para una internet distribuida

La propiedad scroll-margin de CSS

Imago voragine.net
• Por

La propiedad scroll-margin de CSS es una de esas en las que he pensado desde hace años como una que debería existir. Y no sé cómo no he dado con ella hasta ahora, a pesar de que está disponible desde el lanzamiento de CSS3. Gran descubrimiento, aunque sea tardío.

scroll-margin permite definir el margen de un elemento respecto a los límites relativos del elemento que los contiene. Quién no ha necesitado esto cuando se utilizan anchors y se crea un menú con enlaces que llevan a distintas secciones --distintas alturas en el scroll-- de la página actual.

Crear tipografías para web desde la línea de comandos: generar woff, woff2 y eot a partir ttf

Imago voragine.net
• Por
Existen multitud de conversores de tipografías de escritorio (formatos TTF y OTF) a tipografías web (formatos WOFF, WOFF2, EOT...). Consisten en aplicaciones web a los que se envían las tipografías de escritorio y que devuelven las tipografías web, e incluso la hoja de estilos CSS que permiten usarlas en cualquier página web. ¿Por qué usar entonces la línea de comandos para generar tipografías web? Por dos razones: la primera es la automatización: con la línea de comandos se puede automatizar este proceso. Pero la más importante para mí es que no tengo manera de saber lo que esas aplicaciones web están metiendo en esos archivos que me descargo y que luego subo a los servidores web en los que funcionarán las páginas web que estoy desarrollando. Unas veces porque el código de esas aplicaciones no está disponible para estudiarlo, otras porque aunque lo esté yo no tengo el tiempo de estudiarlo.

Entorno de desarrollo en local para WordPress con Varying Vagrant Vagrants

Imago voragine.net
[actualizado el ] • Por

Varying Vagrant Vagrants (VVV) es una de las maneras recomendadas por la comunidad que desarrolla WordPress para poner en marcha un servidor de desarrollo en local.

VVV es un entorno de desarrollo para WordPress que usa Vagrant, una herramienta pensada para montar entornos de desarrollo. Vagrant usa máquinas virtuales para ello. Al usar Vagrant se puede elegir el sistema de virtualización. VVV recomienda Virtualbox. Vagrant añade al sistema de virtualización, por ejemplo Virtualbox, una capa que facilita la automatización a la hora de crear y gestionar las máquinas virtuales usadas en el entorno de desarrollo.

VVV viene listo para comenzar inmediatamente el desarrollo, equipado con todo lo necesario en un entorno de desarrollo incluyendo herramientas específicas de WordPress como wp-cli.

Instalar composer 2 en Debian Buster

En Debian Buster la versión disponible de composer es la 1.8.4, en el momento de escribir este artículo:

skotperez@debian-buster:~$ sudo apt-cache policy composer
composer:
  Instalados: 1.8.4-1+deb10u1
  Candidato:  1.8.4-1+deb10u1
 Tabla de versión:
 *** 1.8.4-1+deb10u1 500
        500 http://deb.debian.org/debian buster/main amd64 Packages
        500 http://security.debian.org/debian-security buster/updates/main amd64 Packages
        100 /var/lib/dpkg/status

Cada vez más aplicaciones PHP que funcionan por ejemplo con Symfony, necesitan composer versión 2. Aunque composer 2 no está disponible en los repositorios oficiales de Debian se puede instalar fácilmente. En realidad basta con descargarlo y moverlo a una ubicación apropiada:

skotperez@debian-buster:~$ curl -sS https://getcomposer.org/installer | php
skotperez@debian-buster:~$ sudo mv composer.phar /usr/local/bin/composer2

Visto en DeveLike.

Principales comandos para mantener un sistema de certificados Let’s Encrypt

Imago voragine.net
[actualizado el ] • Por

Escribí hace un tiempo sobre Let's Encrypt, la primera organización de certificación que emite certificados gratuitos y de manera automática. Contaba entonces cómo obtener certificados Let's Encrypt. Desde entonces la manera de obtener certificados ha cambiado: ahora es más sencillo obtenerlos, renovarlos, anularlos... Hago un repaso aquí de los comandos necesarios para mantener certificados Let's Encrypt.

Captura de pantalla de https://certbot.eff.org/

Para instalar cerbot, la Electronic Frontier Foundation pone a disposición una herramienta web en la que, eligiendo el sistema operativo y el servidor web usado, devuelve la versión de certbot y las instrucciones precisas para instalarla y su uso básico.

Git: hacer un merge a master sobrescribiendo archivos si es necesario

Imago voragine.net
• Por
Una manera rápida de hacer un merge a la rama master de un repositorio git resolviendo los conflictos automáticamente. Con el siguiente método lo único que hay que decidir es si prevalece la rama que se fusiona o la rama master. Para ello usamos el parámetro -X con el valor ours si se debe dar prioridad a la rama master o theirs si se debe dar prioridad a la rama que se fusiona en master.

Sistema seguro de registro y conexión de usuarios en PHP: password_hash, password_verify, cookie de sesión y el concepto de pepper

Imago voragine.net
• Por

La mayoría de las veces que se necesita un sistema de usuarios, se usa el del CMS o framework que se esté usando para desarrollar. Para las pocas veces que no sea el caso, o que sencillamente se quiera aprender cómo funciona un sistema de registro e inicio de sesión de usuarios a más bajo nivel, aquí algunas pistas de cómo hacerlo de manera segura usando PHP.

En este caso lo voy a hacer usando las funciones password_hash y password_verify.

Pequeña guía de desarrollo rápido y optimizado de un theme de WordPress usando un starter theme, npm, gulp y sass

Imago voragine.net
[actualizado el ] • Por

La mayor parte de los sitios web que funcionan con WordPress pueden hacerlo eligiendo un theme del repositorio oficial o de cualquier otro y personalizándolo con las opciones disponibles en el panel de control. Incluso si se necesita desarrollar un theme hoy día es buena idea no empezar de cero, sino usando una estructura básica, genérica ya desarrollada. Por otro lado es recomendable usar ciertas herramientas que produzcan un theme optimizado, que cargue lo más rápido posible, que se adapte a todo tipo de dispositivos. Esto pasa, además de por estructurar bien la información para minimizar las consultas a base de datos, por producir archivos CSS, JS minimizados e imágenes comprimidas y optimizadas que agilicen la carga. Un buen starter theme para WordPress facilita ambas cosas: una estructura genérica sobre la que empezar a construir rápidamente, y un entorno de desarrollo que permita automatizar las tareas de optimización e ir probando los avances ágilmente.

En este post comparto mi manera de trabajar: qué starter theme utilizo últimamente y cuál es el flujo de trabajo con él.

Cómo hacer un contador en un loop (range) de Hugo

Esa operación básica en casi cualquier lenguaje que es poner en funcionamiento un contador en Go no lo es en absoluto. Estoy aprendiendo la sintaxis que usa Hugo para construir sus templates, Go templates, y pensé que definir una variable numérica, asignarle el valor 0, e incrementar su valor con cada iteración se haría igual que en cualquier otro lenguaje, pero no. De hecho hasta que ha salido la versión 0.48 de Hugo no se podía ni redefinir el valor de una variable. Para versiones anteriores hay que recurrir a Scratch, una serie de métodos que permiten salvar esta limitación en Go Template.

Usando Scratch hacer un counter vuelve a ser posible:

{{ $.Scratch.Set "counter" 0 }}
{{range $array }}
    {{ $.Scratch.Set "counter" (add ($.Scratch.Get "counter") 1) }}
    Valor de $counter en esta vuelta del loop: {{$.Scratch.Get "counter"}}
{{end}}