#128 Los dos React

Los dos React

Cuando trabajas con una biblioteca o framework JS que necesitas compilar o transpilar, hay dos versiones de código, una es la que construye y otra es la que se entrega. Si el código que llega a producción lo generas en tu computadora local, entonces el estado original es el que está en tu computadora, y lo mismo aplica si construyes en una maquina virtual con CI/CD o algo parecido. Y el que se carga al momento de entrar a un sitio web es diferente, ya fue transpilado y optimizado. Pero esto puede tener inconvenientes y en este articulo, Dan expone más al respecto.

Reflexiones en Remix

Nada más difÍcil que tener solo una herramienta de elección en esta industria donde, a veces, las decisiones de los creadores y mantenedores de Open Source no se alinean con la tuya propia. Aunque hoy en día Next.js parece omnipresente, hay alternativas, por si quieres algo diferente y que siga siendo React, por ejemplo, Remix. En este articulo, programadores veteranos dan su opinión sobre el framework y porque es bueno.

Queries y Unidades

Container queries son similares a los media queries, pero con con una peculiaridad, no necesitas calcular el tamaño del viewport, sino del elemento contenedor para poder utilizarlos. Y ahora que todos los navegadores lo soportan, puedes comenzar a usarlos para hacer más responsivos tus proyectos web.

LANZAMIENTO 🚀
Reacttiv

Hola comunidad, hoy los creadores de este newsletter y comunidad, les pedimos su apoyo en el lanzamiento de un servicio para empresas y proyectos que necesitan la ayuda de un Sr. React Developer. Visiten el siguiente link y dígannos que piensan. 🤠 

EL RINCÓN DEL DISEÑADOR 🎨 
Diseñar una mejor paginación

Quizás has notado que cada día hay menos sitios web con paginación porque muchos están implementando carga infinita. Pero por accesibilidad y desempeño, la paginación sigue siendo recomendable, y con este articulo aprenderás todos los tips que necesitas para diseñar mejor paginación.

HERRAMIENTA 🛠️ 
Projen

En un número pasado, te compartimos sobre cómo podías utilizar Nx para la configuración de tus proyectos y las ventajas de usarlo. Ahora, toca turno a Projen, una herramienta de configuración de proyectos que te permitirá integrar diferentes bibliotecas, compilar, usar linters, automatizar PR builds, automatizar actualizaciones de seguridad y mucho más.

Twc

Crea componentes en linea con React y Tailwind. Imagina poder usar CSS-in-JS pero con Tailwind, eso te permite hacer esta biblioteca.

UN DÍA COMO HOY 🗓️ 

El 17 de enero de 2007, fue identificado por primera vez, el "Storm Botnet". El storm botnet o el storm worm botnet es una red de ordenadores “zombi” (o "botnet"), controlada remotamente, encadenado por el gusano storm, un caballo de troya distribuido por medio de spam de email. Para el 22 de enero de 2007 se contabilizó que el "storm Botnet" se representaba el 8% de todo el malware presente en los ordenadores con Windows.

VACANTE 💼 
Gerente Front-end SAP Commerce

Ubicación: México (Híbrido)
Empresa: Deloitte
Requisitos:  Titulado(a) de Ingeniería en Sistemas, Computación, o afín. De 5 o más años de experiencia liderando equipos/proyectos de implementación SAP Commerce, desarrollo de aplicaciones web desktop y responsive, habilidades en HTML, CSS, JavaScript, JQuery, Angular y Ecmascript, conocimientos en Bootstrap, Archivos JSP, Ant, Task runners, NodeJS, Responsive Design, Web services, Web Performance, UX/UI, Git, Testing & Debuging, proyectos bajo entornos de integración continua. Inglés avanzado. Entre otros.

Para conocer más y postularte, da click aquí. 🤞 

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

function aplanarArray(array) {
    let resultado = [];

    array.forEach(elemento => {
        if (Array.isArray(elemento)) {
            resultado = resultado.concat(aplanarArray(elemento));
        } else {
            resultado.push(elemento);
        }
    });

    return resultado;
}

// Ejemplo de uso
console.log(aplanarArray([1, [2, 3], [4, [5, 6]]])); // Debería devolver [1, 2, 3, 4, 5, 6]

• La función aplanarArray toma un array array como argumento.

• Inicializa un array vacío resultado para almacenar el array aplanado.

• Utiliza forEach para iterar sobre cada elemento del array.

• Si el elemento es un array (comprobado con Array.isArray(elemento)), llama recursivamente a aplanarArray y concatena el resultado con resultado.

• Si el elemento no es un array, simplemente lo agrega a resultado.

• Finalmente, devuelve el array resultado, que contiene todos los elementos aplanados.

CHALLENGE DE HOY ⚔️ 
Escribe una función en JavaScript que evalúe una expresión matemática dada como un string.

• La función debe aceptar un string que representa una expresión matemática simple (por ejemplo, "3 + 4", "10 - 5 * 2").

• Debe devolver el resultado numérico de evaluar esa expresión.

• La expresión solo incluirá números, espacios y los operadores básicos (+, -, *, /).

Ejemplo:

evaluarExpresion("3 + 4"); // Debería devolver 7
evaluarExpresion("10 - 5 * 2"); // Debería devolver 0

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 👀