#197 Navegando el futuro del frontend

Navegando el futuro del frontend

La web siempre ha estado en evolución y las herramientas, tecnologías y proyectos en general que permiten que funcione y se construya para ella, siempre han estado evolucionando, y actualmente estamos en una transición más en la que los meta-frameworks y los Server-side Components son el presente del desarrollo web y nos toca aprenderlos y decidir si son lo que necesitamos para nuestros proyectos.

Vulnerabilidades en Firebase

El problema del serverless, es cuando parece muy fácil de utilizar y no sabes configurarlo bien. Por ejemplo, esta vulnerabilidad que se descubrió en Firebase que permite el acceso a contraseñas e información de pago sensible 😱 Si tienes un proyecto en Firebase, corre a leer este artículo y revisar si tiene vulnerabilidades.

GUÍA 📖 
MistCSS

¿Te imaginas escribir tus componentes React utilizando solo CSS? Pues no te imagines más, porque MistCSS te permitirá hacer eso y más. ¡BIenvenido a la nueva época de la programación declarativa en la Web! 😎

HERRAMIENTA 🛠️ 
Onborda for Next.js

Esta es una biblioteca para hacer el Onboarding más fácil en tus proyectos Next.js que es muy personalizable y usa Framer Motion para las animaciones. Incluso si no lo vas a usar para una página sencilla, esta biblioteca te sacará de apuros.

Cmd K

Digamos que necesitas crear un menú de comandos para tu siguiente aplicación React, ¿conoces alguna biblioteca o plugin que te permita implementar este de forma rápida? Si no lo conoces, aquí te dejamos una recomendación con varios estilos muy interesante

LANZAMIENTO 🚀 
WinterJS 1.0

Después de Node, Deno y Bun, quien dice que no hay mercado para runtimes que ejecuten aplicaciones JavaScript. Este proyecto esta escrito en Rust (no podría ser de otra forma) y utiliza SpiderMonkey y Tokio.rs y como no podría ser de otra forma, promete ser super rápido. ¡Hay que probarlo!

UN DÍA COMO HOY 🗓️ 

El 26 de marzo de 1973, nace Lawrence Edward "Larry" Page, empresario estadounidense cofundador junto con Sergey Brin, de Google.

Page es uno de los hombres más ricos del mundo; se estima que tiene un patrimonio neto de más de US$16,7 mil millones (septiembre de 2011). Es hijo de dos docentes universitarios, Gloria Page, profesora de programación en la Universidad de Michigan y Carl V. Page, profesor de ciencias de la computación e Inteligencia Artificial de la Universidad de Carolina del Norte y la de Michigan.

Su padre fue un pionero y autoridad en el campo de la Inteligencia Artificial fallecido en 1996.

Aunque Page es judío porque su madre lo es, su educación fue laica y él confiesa no practicar el judaísmo ni ninguna otra religión.

Se doctoró en Ciencias de la Computación en la Universidad de Stanford. Fue premiado con un máster honorífico en Administración de Empresas y fue el primero en recibir el premio "Alumni society recent engineering graduate" de la Universidad de Míchigan.

Durante su doctorado en la Universidad de Stanford conoció a Sergey Brin. Juntos desarrollaron y pusieron en marcha el buscador Google, que empezó a funcionar en 1998. Google está basado en la tecnología patentada PageRank.

VACANTE 💼 
Senior Frontend Engineer (Docker Suite UI)

Ubicación: México (Remoto)
Empresa: Docker, Inc
Requisitos: Experiencia en la creación, ejecución, prueba y depuración de aplicaciones frontend para web o escritorio en marcos y tiempos de ejecución JS como React, Electron, NodeJS y navegadores web. Profundo conocimiento técnico de Javascript y Typecript. Gran dominio de las herramientas de construcción frontend, como hilo, webpack, eslint, jest. Fuertes habilidades en inglés verbal y escrito que se utilizan para una colaboración efectiva. Apasionado por la productividad del desarrollo frontend a través de mejores prácticas y patrones. Cómodo trabajando con React, Remix y Electron Cómodo escribiendo backends o trabajando con ingenieros de backend en un equipo Conocimiento de las mejores prácticas de seguridad.
Beneficios(para empleados de tiempo completo) : Libertad y flexibilidad; adapta tu trabajo a tu vida Configuración de oficina en casa; queremos que estés cómodo mientras trabajas 16 semanas de licencia parental remunerada Estipendio tecnológico equivalente a $100 netos/mes Plan PTO que lo alienta a tomarse el tiempo para hacer las cosas que disfruta Hackathons trimestrales para toda la empresa

RESULTADO DEL CHALLENGE ANTERIOR 🧐 
¡Gracias a los que contestaron el challenge anterior! Aquí te dejamos nuestra respuesta:

Para validar si los paréntesis en un string están correctamente equilibrados, puedes utilizar una estructura de datos de pila para rastrear los paréntesis abiertos. Aquí te muestro cómo podrías implementar la solución:

function validarParentesis(string) {
    // Inicializar una pila para mantener un seguimiento de los paréntesis abiertos
    const pila = [];

    // Iterar a través de cada carácter en el string
    for (let caracter of string) {
        // Si el carácter es un paréntesis de apertura, ponerlo en la pila
        if (caracter === '(') {
            pila.push(caracter);
        } else if (caracter === ')') {
            // Si el carácter es un paréntesis de cierre, verificar si hay un paréntesis de apertura correspondiente
            if (pila.length === 0) {
                // Si no hay paréntesis de apertura correspondiente, los paréntesis no están equilibrados
                return false;
            } else {
                // Sacar el paréntesis de apertura correspondiente de la pila
                pila.pop();
            }
        }
    }

    // Si la pila está vacía al final, los paréntesis están correctamente equilibrados
    return pila.length === 0;
}

// Ejemplo de uso
console.log(validarParentesis("(hola)(mundo)")); // Debería retornar true
console.log(validarParentesis("(()()())")); // Debería retornar true
console.log(validarParentesis("(hola(mundo))")); // Debería retornar true
console.log(validarParentesis(")(")); // Debería retornar false
console.log(validarParentesis("(()")); // Debería retornar false
console.log(validarParentesis("(hola)(mundo))(")); // Debería retornar false

Explicación del Código:

• Se utiliza una pila para mantener un seguimiento de los paréntesis de apertura. La pila es simplemente un array que se usa para agregar elementos cuando se encuentra un paréntesis de apertura y quitar el último elemento agregado cuando se encuentra un paréntesis de cierre.

• Al encontrar un paréntesis de apertura (, se agrega a la pila con push().

• Al encontrar un paréntesis de cierre ), se verifica si la pila está vacía. Si está vacía, significa que no hay un paréntesis de apertura correspondiente, y por lo tanto, los paréntesis no están equilibrados, retornando false.

• Si la pila no está vacía, se retira el último paréntesis de apertura agregado a la pila con pop(), porque se ha encontrado un paréntesis de cierre correspondiente, indicando que el par de paréntesis está equilibrado hasta ese punto.

CHALLENGE DE HOY ⚔️ 
Encuentra el Elemento Mayoritario en un Array

Dado un array no vacío de números enteros, necesitas identificar el elemento que aparece más frecuentemente que cualquier otro, es decir, el elemento mayoritario. Asume que el array siempre tendrá un elemento mayoritario.

Tareas a realizar:

1. Implementa una función encontrarMayoritario que acepte un array de enteros como argumento.

2. La función debe encontrar y retornar el elemento mayoritario en el array.

3. Considera el caso en el que el array siempre tenga un 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

• Una forma eficiente de resolver este problema es utilizando el algoritmo de Boyer-Moore para la búsqueda de la mayoría. Este algoritmo encuentra el elemento mayoritario en un tiempo lineal O(n) y con un uso constante de espacio.

• Alternativamente, puedes utilizar un enfoque de conteo de frecuencias con un objeto para rastrear las apariciones de cada elemento, aunque esto podría no ser tan eficiente en términos de espacio.

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 👀