#151 ¿Por qué Adobe esta frustrando a los diseñadores Web?

¿Por qué Adobe esta frustrando a los diseñadores Web?

Adobe podría dominar el mundo… del diseño web, pero le da miedo el éxito. O eso es lo que parece si uno se pone a revisar la desastrosa relación que tiene con las herramientas de diseño web a través de su historia.

Lecciones aprendidas de actualizar a React 18

Nada como actualizar un proyecto a una nueva versión de tu framework JavaScript. Y la cosa mejora si ademas usas TypeScript. Por eso aquí tienes las recomendaciones a considerar si estas migrando a React 18.

VIDEO 📹️ 
React Server Components cambia todo

¿Quieres aprender más sobre los React Server Components y la forma en la que aprendes con un video? Mira este que explica de forma muy sencilla cómo comenzar a usarlos.

Quit sending emails like a dinosaur.

It’s the year 2024 and all the top newsletters are using beehiiv.

beehiiv was created by the same early Morning Brew employees who scaled their daily email to over 4 million subscribers. And now every newsletter on beehiiv has access to the same tools and winning formula.

So what exactly does beehiiv offer?

• World-class growth tools like the referral program and recommendation network

• Monetization via the beehiiv Ad Network and premium subscriptions (i.e. beehiiv helps you get paid)

• Seamless content creation with a sleek collaborative editor

• Best-in-class inbox deliverability of 98.7%

• Oh and it’s the most affordable by a mile…

Take your newsletter to the next level — get started for free.

GUÍA 📖 
Dominando la integración de React y OpenLayers

A veces uno no puede usar Google Maps en su proyecto por cualquier razón, como por ejemplo, el costo, y para eso siempre tendremos OpenLayers. Una vez que domines trabajar con esta biblioteca en React quizás nunca quieras volver a usar Google Maps.

EL RINCÓN DE CSS 👨‍💻 
12 mejoras en CSS de una sola linea

Lo sabemos, hay tantas mejoras en CSS en los últimos años, que luego uno no puede seguir la corriente. Por eso, aquí tienes 12 mejoras que involucran una sola linea y su explicación.

HERRAMIENTA 🛠️ 
rc-table

A veces necesitas un componente para tablas en React que sea sencillo y minimalista, y eso es este componente, que tiene justo las funciones que necesitas.

React Shepherd

¿Cómo realizas el onboarding a nuevos usuarios de tu proyecto? Ya sabes, ese en el que vas indicándoles paso por paso donde dar click y donde mirar cuando son recién llegados. Si no tienes una forma de hacer onboarding, aquí tienes una recomendación.

UN DÍA COMO HOY 🗓️ 

El 09 de febrero de 2009, Google lanza la primera actualización de su sistema operativo móvil: Android 1.1 Banana Bread (Pan de Platano).
Banana Bread fue lanzada, inicialmente solo para el HTC Dream así que solo sirve para este teléfono.
Android 1.1 fue conocido como "Petit Four" internamente, aunque este nombre no se utilizó oficialmente.
Banana Bread, resolvió algunos fallos de la primera versión, cambió la API y agregó una serie de características.
Ahora se ofrecen detalles y reseñas disponibles cuando un usuario busca negocios en los mapas y se incorpora la función de mostrar y esconder el marcador.
Con Android 1.1, ahora se pueden guardar archivos adjuntos en los mensajes y se añade soporte para marquesinas en el diseño de sistemas.
La versión previa a Banana Bread fue Android 1.0 Apple Pie (primera versión comercial del software) lanzado el 23 septiembre de 2008.

VACANTE 💼 
Full Stack Software Engineer

Ubicación: Ciudad de México (Híbrido)
Empresa: Salesforce
Requisitos: Más de 6 años de experiencia en desarrollo de aplicaciones web full stack. Gran experiencia en JavaScript/Typecript, CSS3, manipulación DOM avanzada y frameworks frontend. Experiencia en la creación de aplicaciones de una sola página utilizando NodeJS/ExpressJS y componentes web. Experiencia trabajando en aplicaciones web complejas y a gran escala que cumplan con estándares web como capacidad de respuesta, rendimiento de páginas web, seguridad y accesibilidad. Bueno en los fundamentos de la informática: estructuras de datos, diseño de algoritmos, resolución de problemas y análisis de complejidad.
Lo que harás: Proporcionar soluciones innovadoras para los productos de foro/colaboración comunitaria para lograr el éxito de Trailblazer y potenciar experiencias globales en persona y digitales a través de conversaciones comunitarias confiables. Asumir el liderazgo en la definición de consideraciones de arquitectura y diseño para la reutilización, gestión de código, cumplimiento de requisitos no funcionales (seguridad, rendimiento, escalabilidad, accesibilidad, i18n, etc.), etc. Dominar nuestro proceso de desarrollo, nuestra cultura y nuestra base de código, y luego mejorarlos. Operar de manera efectiva en el modelo de ingeniería híbrida donde se espera que los ingenieros puedan diseñar y ejecutar el trabajo necesario para garantizar la calidad de su código y el de otros ingenieros.

Para postularte, ingresa aquí. 🤞 

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

function calcularDistancia(x1, y1, x2, y2) {
    // Calcular la diferencia entre las coordenadas x e y, respectivamente
    const dx = x2 - x1;
    const dy = y2 - y1;

    // Calcular la distancia euclidiana
    const distancia = Math.sqrt(Math.pow(dx, 2) + Math.pow(dy, 2));

    return distancia;
}

// Ejemplo de uso
console.log(calcularDistancia(1, 2, 4, 6)); // Debería retornar aproximadamente 5
console.log(calcularDistancia(0, 0, 3, 4)); // Debería retornar 5, basado en el teorema de Pitágoras

• La función calcularDistancia acepta cuatro argumentos: x1, y1 (coordenadas del primer punto) y x2, y2 (coordenadas del segundo punto).

• Dentro de la función, calcula la diferencia entre las coordenadas x (dx) y las coordenadas y (dy) de los dos puntos.

• Luego, utiliza la fórmula de distancia euclidiana √((x2 - x1)^2 + (y2 - y1)^2) para calcular la distancia entre los puntos. Esto se hace elevando dx y dy al cuadrado, sumándolos, y luego tomando la raíz cuadrada del resultado con Math.sqrt.

• Finalmente, retorna el valor de distancia, que es la distancia euclidiana entre los dos puntos.

CHALLENGE DE HOY ⚔️ 
Crea una función en JavaScript que determine si un string de paréntesis es válido. Un string de paréntesis se considera válido si cada paréntesis abierto se cierra en el orden correcto.

1. Implementa una función esValido que acepte un string como argumento.

2. La función debe retornar true si el string de paréntesis es válido, y false en caso contrario.

3. Un string de paréntesis es válido si cada paréntesis abierto ( tiene un correspondiente paréntesis cerrado ) que ocurre después y cada par de paréntesis se cierra en el orden correcto.

console.log(esValido("()()")); // Debería retornar true
console.log(esValido("(())")); // Debería retornar true
console.log(esValido("(()")); // Debería retornar false
console.log(esValido(")(")); // Debería retornar false

• Considera utilizar una pila (stack) para llevar un seguimiento de los paréntesis abiertos y asegurarte de que cada uno se cierra en el orden correcto.

• Cada vez que encuentres un paréntesis abierto, puedes "apilarlo". Cuando encuentres un paréntesis cerrado, "desapila" y verifica si corresponde al último paréntesis abierto.

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 👀