#198 Comparando Frameworks JavaScript parte 1

Comparando Frameworks JavaScript parte 1

Hay artículos comparando los principales frameworks JavaScript que luego son muy generalistas y básicamente repiten lo mismo. Pero en este articulo o serie de artículos, se exploraran parte por parte, empezando por los templates, de una forma muy detallada. Este artículo debería ser leído y estudiado por todos los frontenderos de nuestra comunidad.

Qué sigue para un Global Design System

Hace poco, Brad Frost hizo un llamado a la comunidad internacional para crear un Global Design System para mejorar la calidad y accesibilidad de las experiencias al utilizar sitios web y también para normalizar y estandarizar. El llamado fue bien recibido y este es un seguimiento a esta descabellada pero necesaria idea.

VIDEO 📹️ 
La economía de los lenguajes de programación por Evan Czaplicki

En recientes newsletters hemos hablado sobre el status del Open Source en general, pero en estos artículos casi no se toca el tema de los lenguajes de programación y cómo se sostienen. Algunos lenguajes tienen apoyo de corporaciones o de grupos de trabajo fondeados por corporaciones, pero hay algunos lenguajes independientes que no reciben apoyo o reciben muy poco, y en esta plática Evan Czaplicki, el creador de Elm, hace unas muy interesantes preguntas y observaciones.

GUÍA 📖 
Haz que tus funciones en TypeScript sean mas reutilizables usando generics

Una de las ventajas de TypeScript, es usar Generics para poder crear componentes reutilizables, es decir, que estos componentes puedan trabajar con varios types en lugar de solo uno. Y aunque any es un generic, no se recomienda utilizar, porque usarlo implica perder el type de dato que se esta usando. Que esta pequeña guía sirva para que te entre curiosidad por cómo funcionan los genéricos y te animes a aprender más de ellos.

HERRAMIENTA 🛠️ 
Knip

Cuando un proyecto web crece o con el pasar de los años, hay muchos archivos, dependencias y exportaciones o importaciones que dejan de ser usados, pero siguen estando ahí y a la larga pueden generar problemas al no saber si se están utilizando. Y justo para eso, se creó Knip, para encontrarlos y poder eliminarlos de forma segura.

TEMPLATES 🖥️ 
UntitledUI

Untitled UI Figma UI kit y Design System que promete ser el más completo UI kit en el mundo. En su versión gratuita, vas a poder utilizar variables de Figma, los modos Dark, y tiene una biblioteca de más de 2000 componentes, 900 iconos y logos y 350 estilos globales… nada mal para una versión gratuita.

LANZAMIENTO 🚀 
Actualización a los Starters de Stackblitz

¿Has utilizado Stackblitz y sus Starters? Si no lo has hecho, una analogía sería que son templates que funcionan como los pen de CodePen pero para varias bibliotecas y frameworks JavaScript. Ya desde 2021, han utilizado WebContainers, que son una herramienta que permite tener un micro-sistema operativo dentro de un navegador. Y ahora Stackblitz esta actualizando varios de sus templates para que funcionen con Vite permitiendo que ahora los proyectos que construyas sean más rápidos y con más opciones. Bastante genial, ¿verdad?

UN DÍA COMO HOY 🗓️ 

El 27 de marzo de 1910, nace en Iowa, Estados Unidos, John Pierce.
Estudió en el Instituto de Tecnología de California, donde estudió ingeniería eléctrica, obteniendo un título de licenciatura en 1933, el grado de maestría en 1934 y doctorado en 1936.E
se mismo año empezó a trabajar con Bell Telephone Laboratories en Nueva Jersey, donde ocupó varias posiciones a través de 1971 y lo hicieron algunos de sus trabajos más innovadores.
Se convirtió en director de la investigación de la electrónica en 1952 y director de investigación de los principios de comunicación en 1958.
Pierce, acuñó el término "transistor" en 1948 para el pequeño interruptor, electrónico inventado en los Laboratorios Bell.
Pero Pierce, es probablemente más conocido por ser el propulsor de las bases científicas que hicieron posible los satélites de comunicaciones no tripulados.P
ierce, instó a la NASA para construir un satélite basado en su diseño, y que fue lanzado en 1960.
En esencia un globo de poliéster grande cubierto con papel de aluminio, el cual rebotaba ondas de radio desde una antena de “Jet Propulsion Laboratory” cerca de Goldstone, California a la estación “Bell Labs” en Nueva Jersey.
Después de retirarse de Bell en 1971, Pierce tuvo una cátedra de ingeniería en Caltech y, de 1979 a 1982, fue jefe de tecnología en el “Jet Propulsion Laboratory”.
Pierce, fue autor o co-autor de unos 20 libros y ha escrito más de 300 artículos y secciones de libros, y se le concedió alrededor de 90 patentes.

VACANTE 💼 
Arquitecto de front-end

Ubicación: Ámerica Latina (Remoto)
Empresa: ALUXION
Requisitos: Experiencia demostrable como Arquitecto Frontend. Sólida comprensión de React y AEM. Habilidad para escribir código limpio, eficiente y mantenible. Excelentes habilidades de comunicación y capacidad para trabajar en equipo. Capacidad para trabajar de forma independiente y tomar iniciativa.
Responsabilidades: Diseñar y desarrollar interfaces de usuario web utilizando React. Implementar y mantener la arquitectura del front-end. Colaborar con el equipo de diseño para crear una experiencia de usuario óptima. Asegurar la calidad del código y la compatibilidad entre navegadores. Mantenerse actualizado con las últimas tecnologías y tendencias del front-end.

Aquí te dejamos el link para que puedas postularte. 🤞 

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

Para encontrar el elemento mayoritario en un array, que es aquel que aparece más de n/2 veces donde n es el tamaño del array, puedes usar el algoritmo de Boyer-Moore para la búsqueda de mayoría. Este algoritmo es eficiente porque opera en tiempo lineal O(n) y utiliza un espacio constante O(1). Aquí te muestro cómo implementarlo:

function encontrarMayoritario(array) {
    let candidato = null;
    let contador = 0;

    // Fase 1: Encontrar un candidato
    for (let num of array) {
        if (contador === 0) {
            candidato = num;
        }
        contador += (num === candidato) ? 1 : -1;
    }

    // Fase 2: Verificar el candidato (opcional en este contexto, ya que se garantiza un mayoritario)
    contador = 0;
    for (let num of array) {
        if (num === candidato) {
            contador++;
        }
    }

    // Verificar si el candidato es realmente el mayoritario
    if (contador > array.length / 2) {
        return candidato;
    } else {
        return "No hay elemento mayoritario";
    }
}

// Ejemplo de uso
console.log(encontrarMayoritario([3, 3, 4, 2, 4, 4, 2, 4, 4])); // Debería retornar 4
console.log(encontrarMayoritario([2, 2, 1, 1, 1, 2, 2])); // Debería retornar 2

• La función encontrarMayoritario implementa el algoritmo de Boyer-Moore en dos fases principales.

• Fase 1: Encuentra un candidato para el elemento mayoritario. Empieza con un contador en 0 y recorre el array elemento por elemento. Si el contador es 0, se asume el elemento actual como el nuevo candidato. Si el elemento siguiente es igual al candidato, se incrementa el contador; si es diferente, se decrementa. Este proceso garantiza que si hay un elemento mayoritario, será el último candidato restante.

• Fase 2: Verifica que el candidato encontrado sea realmente mayoritario contando su presencia en el array. Aunque en el contexto del desafío se asume que siempre hay un mayoritario, esta fase es útil para validar el candidato en casos generales.

• Finalmente, si el contador muestra que el candidato aparece más de n/2 veces, se retorna el candidato como el elemento mayoritario. En otro caso, se podría retornar un mensaje indicando que no hay un elemento mayoritario, aunque por la descripción del desafío, este caso no debería ocurrir.

CHALLENGE DE HOY ⚔️ 
Calcular el Máximo Común Divisor (MCD) de Dos Números

El Máximo Común Divisor (MCD) de dos números es el mayor número que divide ambos sin dejar residuo. Tu tarea es desarrollar una función que tome dos números enteros positivos como entrada y retorne su MCD.

1. Implementa una función calcularMCD que acepte dos números enteros positivos como argumentos.

2. La función debe encontrar y retornar el MCD de los dos números.

3. Considera el caso especial donde alguno de los números pueda ser cero.

Ejemplo de uso:

console.log(calcularMCD(48, 18)); // Debería retornar 6
console.log(calcularMCD(20, 5)); // Debería retornar 5
console.log(calcularMCD(0, 5)); // Debería retornar 5
console.log(calcularMCD(0, 0)); // Caso especial, podría retornar 0 o manejarlo de otra manera

• Una manera eficiente de calcular el MCD es mediante el algoritmo de Euclides, que reduce el problema de encontrar el MCD de dos números a encontrar el MCD de números más pequeños.

• El algoritmo de Euclides se basa en el principio de que el MCD de dos números también divide el resto de la división del mayor entre el menor.

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 👀