frontenderos icon

Podcast

Newsletter

#133 Un Design System Global

Complejidad que duele, usando React para contenido estatico.

Un Design System Global

Brad Frost, uno de los principales divulgadores y promotores del término Design System, escribe este articulo en aras de, pues básicamente, evitar seguir reinventando la rueda en los casos en los que se pueden estandarizar los Design System. Esta propuesta mola, habrá que seguirla de cerca.

Complejidad que duele, usando React para contenido estático.

A veces React es muy poderoso para cosas muy sencillas. Y tener que utilizarlo para cosas muy sencillas, a veces es contraproducente. Necesitamos alternativas para construir sitios web donde React no sea necesario.

Vértigo AI, que les depara a los diseñadores.

¿Las herramientas de AI de verdad van a dejar sin trabajo a los diseñadores? Y si eso pasa ¿cuál es el siguiente paso? Hay que evolucionar y buscarle dar vuelta a las situaciones que van a afectar muchos trabajos. ¿Cómo? Aquí hay unas recomendaciones.

HERRAMIENTA 🛠️ 
Las 4 mejores gráficas para mostrar históricos en Angular

Los gráficos históricos son una de las peticiones más comunes al momento de construir dashboards, y eso en Angular es bien fácil de resolver con esta biblioteca que puedes utilizar fácilmente.

Mutative

GUÍA 📖 
Como hacer links externos accesibles

Sin links, no hay Web, así de simple. Por eso es raro que no les demos el valor que merecen y sobre todo, que a veces los dejemos de hacer funcionales y por lo tanto accesibles, hay que rectificar eso.

INISPIRACIÓN 💡 
Top UI/UX tendencias del 2024

Con el lanzamiento del Apple Vision, puede que las herramientas de AR/VR vuelvan a dar un salto. Y los frontenderos de bien, debemos aprovechar todas las nuevas formas en las que vamos a poder construir interfaces y diseños. Aquí puedes ver algunas de las tendencias que se esperan para este año.

UN DÍA COMO HOY 🗓️ 

El 22 de enero de 1990, Robert Tappan Morris (conocido como rtm) profesor asociado en el MIT es condenado y sentenciado por haber creado y difundido el “gusano Morris”. El gusano Morris (1988) es considerado como el primer gusano de la red. Morris creó el gusano cuando era estudiante en la Universidad de Cornell. La intención original, según Morris, era "medir el tamaño de Internet".

El  02 de noviembre de 1988 liberó del gusano en ARPANET (precursora de Internet) y 3 días después se produjo un "Jueves Negro" porque el gusano se propagó con una rapidez y eficacia que los ordenadores de todos los puntos vitales de los Estados Unidos: la NASA, la RAND, el Pentágono, las Universidades de Berkeley, Stanford y Princeton, el MIT, el Lawrence Livermore National Laboratory, fueron cayendo una tras otra.

VACANTE 💼 
ReactJS Developer

Ubicación: México (Remoto)
Empresa: TMS
Acerca del empleo: Es muy deseable tener experiencia práctica en tecnologías basadas en Java y API nativas de React, ReactJS, JavaScript o ECMAScript (OOJS) y JSX. Competente en al menos un lenguaje de programación moderno; bases de datos relacionales, con marcos de interfaz de usuario modernos útiles Trabajamos en entornos Agile TDD, por lo que cualquier experiencia Agile o conceptos de CI/CD son útiles. Es útil tener conocimientos de Unix/Linux, SQL, API RESTful, AWS y tecnologías generales. Es deseable tener experiencia previa con Spring Boot framework, PostgreSQL, AWS EC2, Docker, Kubernetes, Kafka, Terraform o tecnología similar.

Para postularte, entra aquí.

RESULTADO DEL CHALLENGE DE AYER 🧐 
¡Gracias a los que contestaron el challenge de ayer! Aquí te dejamos nuestra respuesta:

function generarHistograma(array) {
    const histograma = {};

    array.forEach(num => {
        if (histograma[num]) {
            histograma[num]++;
        } else {
            histograma[num] = 1;
        }
    });

    return histograma;
}

// Ejemplo de uso
const numeros = [1, 2, 2, 3, 3, 3, 4];
console.log(generarHistograma(numeros)); // Debería devolver {1: 1, 2: 2, 3: 3, 4: 1}
  • La función generarHistograma toma un array array como argumento.

  • Crea un objeto vacío histograma para almacenar la frecuencia de cada número.

  • Itera sobre cada número num en el array.

  • Si el número ya existe como clave en histograma, incrementa su valor.

  • Si el número no existe en histograma, lo agrega con un valor inicial de 1.

  • Finalmente, devuelve el objeto histograma, que representa el histograma del array de números.

CHALLENGE DE HOY ⚔️ 
Escribe una función en JavaScript que determine si dos arrays son iguales, es decir, tienen los mismos elementos en el mismo orden.

  • La función debe aceptar dos arrays como argumentos.

  • Debe devolver true si los dos arrays tienen los mismos elementos en el mismo orden, y false en caso contrario.

  • No se deben considerar iguales los arrays si difieren en longitud o en el orden de los elementos.

Ejemplo:

sonArraysIguales([1, 2, 3], [1, 2, 3]); // Debería devolver true
sonArraysIguales([1, 2, 3], [3, 2, 1]); // Debería devolver false
  • Considera primero verificar si ambos arrays tienen la misma longitud.

  • Luego, puedes utilizar un bucle para comparar los elementos de los arrays uno a uno.

Comparte tu respuesta en redes sociales y etiquétanos (@frontenderos), compartiremos nuestra respuesta en el issue de mañana. 😎 

Tu feedback nos ayuda a mejorar

Por favor elige una opción y dinos lo que te gustó y lo que no. Leemos todas las respuestas 👀

¿Qué te pareció el email de hoy?

Iniciar Sesión o Suscríbete para participar en las encuestas.

¡Hasta mañana! 🤟