• Frontenderos
  • Posts
  • #86 Algunos casos en los que es más fácil escribir CSS en 2023

#86 Algunos casos en los que es más fácil escribir CSS en 2023

Algunos casos en los que es más fácil escribir CSS en 2023

CSS ha evolucionado en los últimos 3 años a un ritmo increíble, pero ¿es más fácil o más difícil de escribir, en comparación a cuando salió CSS3? 🤔 Depende de cómo definas la dificultad de escribir CSS.
¿Es escribir menos lineas, más fácil o difícil? Aprender nuevas reglas CSS es más difícil porque involucra tiempo y a veces nuevas formas de pensar en como solucionar problemas, pero en general, las nuevas características te van a permitir solucionar mas problemas con menos líneas y menos dolores de cabeza a la larga.

¿Es la ética en el diseño, inútil?

Respuesta corta: no.
Respuesta larga: a veces el diseño y el diseño web se malinterpreta, y el rol de diseñador web no tiene poder de decisión en lo que se construye, pero no por eso se debe dejar de lado que todos en una organización deberían poder tener cierta ética al momento de trabajar.
Checa este artículo. 🔍️ 

INSPIRACIÓN 💡 
Emailspiration

El otro día, mostrábamos sitios de animaciones, landing pages y storefronts de e-commerce, ahora toca el turno de emails, porque como frontendero te va a tocar crear emails en alguna ocasión y que mejor que estar preparado e inspirado. 💡 

GUÍA 📖 
Un enfoque moderno al desarrollo con Angular

Si tu, como nosotros en el staff de Frontenderos, aprendiste Angular hace 10 años y de ahi te fuiste actualizando, puedes revisar esta guÍa de Bit para actualizarte y comenzar a construir proyectos Angular.

HERRAMIENTA 🛠️ 
Typist

Esta es otra de las herramientas que necesitas tener en tu cinturón de herramientas: un componente Rich-text editor. Y aunque hay muchas alternativas, queríamos comenzar por esta, por si quieres una opción más minimalista.

TEMPLATES 🖥️ 
24 starter projects for Eleventy

Casi no hemos hablado de Eleventy, el generador de sitios estáticos JavaScript minimalista, pero con estos 24 boilerplats que te traemos, puedes comenzar a explorarlo y ver si te gusta.

VIDEO 📹️ 
Patrones de diseño en React

Patrones de diseño aplicados en React, que debes conocer para que sepas cuando conviene aplicarlos.

NOTICIA 📰 
Astro 4

 

¡Wow, realmente se tomaron en serio lo de la rapidez! Apenas el 30 de Agosto se anunciaba Astro 3.0, y en apenas 3 meses después, hay nueva versión mayor que incluyen: The Astro Dev Toolbar, Internationalization Routing, Incremental Content Coaching en fase experimental y nuevas actualizaciones para usar el API de Transition Views. 😍 Chécalo aquí.

UN DÍA COMO HOY 🗓️ 

Super Mario Dancing GIF


El 06 de diciembre de 1959, nace Satoru Iwata, en Sapporo Japón, el cuarto y actual presidente de Nintendo. 🎮️ 

El 06 de diciembre de 2010, Google lanza la versión 2.3 de su sistema operativo móvil Android denominada Gingerbread.
Gingerbread es la versión más utilizada después de Jelly Bean del sistema operativo Android. 

VACANTE 💼 
Sr. Front End Engineer

Ubicación: Monterrey, Nuevo León, México (Remoto)
Empresa: Aha!
Tu experiencia en Aha!: “Todos nuestros ingenieros trabajan en todo el sistema. Como ingeniero senior de front-end, pasará la mayor parte de su tiempo trabajando con React o HTML/CSS. También, escribirá un importante código de back-end en Ruby on Rails para admitir las funciones de front-end que esté creando.”
Habilidades: Más de 2 años de experiencia trabajando en React. Producir páginas React escalables y con uso intensivo de datos. Experiencia en la creación de funciones (idealmente en una empresa SaaS de alto crecimiento) Colaborador activo con equipos de producto.

CHALLENGE ⚔️ 

En diversas situaciones, como en el desarrollo de juegos o en la presentación de datos de manera aleatoria, es útil poder mezclar los elementos de un array. Tu tarea es implementar una función que tome un array y lo reorganice en un orden aleatorio.

Descripción del Reto:

  • La función debe aceptar un array como argumento.

  • Debe devolver un nuevo array con los elementos del array original, pero en un orden aleatorio.

  • Cada llamada a la función debería generar un nuevo orden aleatorio.

Ejemplo: Si tienes un array:

const numeros = [1, 2, 3, 4, 5];

Una llamada a mezclarArray(numeros) podría devolver [3, 1, 4, 5, 2].

Consejos:

  • Puedes implementar el algoritmo de Fisher-Yates para una mezcla eficiente.

  • Asegúrate de no modificar el array original.

Este desafío evalúa tu habilidad para trabajar con algoritmos y tu comprensión de cómo manipular arrays en JavaScript de manera eficiente y efectiva.

RESULTADO 🧐 

function mezclarArray(array) {
    // Clonar el array para evitar modificar el original
    let arrayClonado = array.slice();
    let currentIndex = arrayClonado.length, temporaryValue, randomIndex;

    // Mientras queden elementos a mezclar...
    while (currentIndex !== 0) {

        // Escoger un elemento restante...
        randomIndex = Math.floor(Math.random() * currentIndex);
        currentIndex -= 1;

        // E intercambiarlo con el elemento actual
        temporaryValue = arrayClonado[currentIndex];
        arrayClonado[currentIndex] = arrayClonado[randomIndex];
        arrayClonado[randomIndex] = temporaryValue;
    }

    return arrayClonado;
}

// Ejemplo de uso
const numeros = [1, 2, 3, 4, 5];
console.log(mezclarArray(numeros)); // Resultado: array mezclado

Tu feedback nos ayuda a mejorar

Por favor elige una opción y dinos lo qué 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! 🤟