#63 Como contribuir a una web sustentable

jQuery Moderno

Cómo contribuir a una web sustentable

the simpsons helen GIF

El trabajo que hacemos hoy en día, aunque sea digital, genera una huella de carbono, y como frontenderos podemos hacer algo al respecto. Ya no solo basta optimizar nuestros proyectos para que sean accesibles y consuman menos recursos para conexiones lentas o inestables. Ahora también hay que pensar en el futuro. Este articulo nos da pautas a considerar para ello.

HERRAMIENTAS
React Knob Headless

Watching Music Video GIF by Taylor Swift

Si alguna vez tienes que trabajar con una aplicación de audio y necesitas construir los controles, puedes utilizar esta herramienta para ahorrarte un poco de tiempo.

Protección de datos sensibles

Esta es una biblioteca que te puede ser muy útil si estas trabajando con formularios que recopilan datos sensibles y quieres ocultarlos al momento que el usuario los esta capturando.

NOTICIA
Deno 1.38

¡Deno 1.38 ya salió! Y trae varias novedades en las que destacan mejoras al comando deno doc que usas para generar documentación de tu proyecto, soporte nativo para leer archivos de variables de ambiente, mejoras al sistema de transpilación de JSX y mejoras en la compatibilidad de instalar bibliotecas y paquetes de npm.

Mozilla Observatory cambia de nombre y trae mejoras con el

Mozilla Observatory, el producto escáner de Mozilla que te ayuda a diagnosticar la seguridad en tu sitio web, ahora se llamará MDN Observatory. Con esta actualización, se aumentan y actualizan las métricas, la interfaz de usuario y se añade soporte para análisis en tiempo real. Si aún no has escaneado tu sitio web, en busca de mejorar el aspecto de seguridad, te recomendamos que lo hagas.

EL RINCÓN DEL CSS
¿Cómo mejorar los nombres de tus variables?

Nombrar variables en cualquier lenguaje de programación, es difícil. Hacerlo en CSS ya lo era incluso antes de que tuviéramos variables o custom properties y medias queries que permiten nombrar cosas. Este es un excelente articulo que te dará recomendaciones y pautas de como puedes mejorar tus nombres de variables en CSS.

GUÍA
¿Por qué mi CSS View Transition ignora el índice z?

Con el lanzamiento de API, de View Transitions, aparte de demos, comenzaron a salir muchos y muy buenos artículos ofreciendo análisis y experimentos que nos ayudarán a comprender mejor el alcance de esta nueva característica, como el siguiente.

VACANTE
Desarrollador de front-end

En Batech, una startup de AI-VISION en pleno crecimiento, están en busca de un Junior Frontend Web Developer 100% remoto, para unirse a su equipo

CHALLENGE
Crear una función JavaScript que actúe como un temporizador, contando hacia atrás desde un número especificado hasta cero.

Detalles del Desafío:

  1. Debe aceptar un único argumento: el número de segundos para el conteo regresivo.

  2. Cada segundo, debe imprimir en la consola el tiempo restante.

  3. Cuando el contador llegue a cero, debe imprimir "¡Tiempo finalizado!".

Ejemplo: Si la función se llama con temporizador(5), debe imprimir en la consola:

5
4
3
2
1
¡Tiempo finalizado!

RESULTADO

function temporizador(segundos) {
    let contador = segundos;

    const intervalo = setInterval(() => {
        console.log(contador);
        contador--;

        if (contador < 0) {
            clearInterval(intervalo);
            console.log("¡Tiempo finalizado!");
        }
    }, 1000);
}