#120 El fin del Frontend

React Server Components, lo bueno, malo y feo

El fin del Frontend

Scared Ariana Grande GIF by NETFLIX

El fin esta cerca. O no. Este articulo que se escribió en Marzo del año pasado, ante el escenario de pesimismo que imperaba recién se había publicado, GPT-4 nos recuerda algo muy importante. Las llamadas herramientas de Inteligencia Artificial, no vienen a reemplazarnos, sino a ser una herramienta extra en manos expertas y un arma de doble filo en manos menos expertas. Tu tranquilo, y sigue aprendiendo a ser un frontendero de elite con nosotros. 😎 

React Server Components, lo bueno, malo y feo

Los React Server Components (RSC) son una característica nueva de Next.js que ha causado mucho revuelo, pero quizás es por el contexto que no se ha entendido bien su uso. React nació como una biblioteca de Interfaces de Usuario (UI) y necesita de frameworks o bibliotecas HTTP para poder manejar peticiones HTTP y de ahi surgen proyectos como Next y Gatsby o su uso con frameworks como Express u otros. Next vio esta oportunidad para poder extender las posibilidades de React (de manejar peticiones HTTP) y así es como nacen los RSC.

Disclosure Widget

No importa cuantos años uno lleve en la industria, siempre se puede aprender algo nuevo. Como es el caso de este patron común de componente web que se encuentra en muchos sitios web y que no conocíamos que tenia un nombre, y consiste en un botón que oculta y muestra cosas, seguro que al menos alguna vez lo has hecho, pues su nombre es Disclosure Widget.

Diferentes estrategias de documentación de código

Documentar es de buenos frontenderos. No importa lo que digan de que el código debe ser auto explicativo. Con muchas personas trabajando sobre el mismo codebase, estilos de programación diferentes, y actualizaciones de terceros constantes y sonantes, una misma función puede ir cambiando hasta ya no ser entendible en solo cuestión de meses. Por eso, es importante documentar, como una cordialidad a tu equipo, a las futuras personas que trabajen ese código y a ti mismo cuando tengas que volver a modificarlo en un año.

HERRAMIENTA 🛠️ 
IconHunt

Pop Art Design GIF by michael a. salter

Este es un buscador de iconos con una colección de más de 175000 iconos open source. Que la sencilla interfaz no te engañe, este es uno de los buscadores más efectivos que hemos probado, y la colección de iconos también incluye logos de varios proyectos de tecnología.

Shaper

Esta es una herramienta generativa de interfaces de usuario que te puede ayudar a sacar más rápido esos Design Systems que tienes en mente, y explorar nuevas posibilidades de diseño en tus proyectos. Una vez que entres al editor y generes el theme que te agrade, podrás bajar los tokens como variables CSS.

NOTICIA 📰 
Mantine 7.4.0

Nueva versión de la biblioteca de componentes de React con soporte para gráficas de rechats, soporte de colores de OKLCH y otras funcionalidades más.

UN DÍA COMO HOY 🗓️ 

El 09 de enero de 1999, Google registra y patenta "PageRank" el cual aglomera una familia de algoritmos utilizados para asignar de forma numérica la relevancia de las páginas web indexadas por un motor de búsqueda.

El sistema PageRank era utilizado por el motor de búsqueda de Google para ayudar a determinar la importancia o relevancia de una página.

VACANTE 💼 
Desarrollador de JavaScript Sr

Ubicación: Ciudad de México (Remoto)
Empresa: Nextia
Requisitos: Experiencia Requerida: 5+ años en desarrollo backend con NodeJS. Especialización Técnica: Manejo de frameworks como Express, NestJS. Infraestructura y Gestión de Datos: Conocimiento deseable en AWS y Azure y manejo de bases de datos SQL y NoSQL. Educación: Título en ingeniería en sistema o similar. Idiomas: Inglés deseable para colaboración global.
Tecnología a usar: Lenguajes y Frameworks: TypeScript/Node.js, ExpressJS, Styled Components/CSS. Base de Datos y Caché: Redis, Postgresql, MongoDB. Infraestructura y Herramientas: Docker, Heroku, Github, AWS (EC2, RDS, Amplify, Lambda, VPC, S3).
Beneficios: Trabajo en proyectos variados y desafiantes. Ambiente colaborativo con un equipo diverso y talentoso. Capacitaciones constantes y acceso a tecnología de punta.

Si te interesa aplicar, entra en el siguiente link. 🤞 

RESULTADO DEL CHALLENGE DE AYER 🧐 

¡Gracias a los que contestaron el challenge de ayer! Aquí te dejamos nuestra respuesta:

function convertirATitulo(cadena) {
    return cadena
        .split(' ')
        .map(palabra => 
            palabra.charAt(0).toUpperCase() + palabra.substring(1).toLowerCase()
        )
        .join(' ');
}

// Ejemplo de uso
console.log(convertirATitulo("esto es un título")); // Debería devolver "Esto Es Un Título"
console.log(convertirATitulo("JAVA SCRIPT"));       // Debería devolver "Java Script"

CHALLENGE ⚔️ 
Escribe una función en JavaScript que calcule el número de días entre dos fechas. Sin usar biblioteca ;)

  • La función debe aceptar dos fechas como argumentos.

  • Debe devolver el número entero de días entre las dos fechas.

  • Puedes asumir que ambas fechas son válidas y la primera fecha siempre será anterior o igual a la segunda.

Ejemplo:

const fecha1 = new Date('2021-01-01');
const fecha2 = new Date('2021-01-05');

La función debería devolver 4, ya que hay 4 días entre el 1 de enero y el 5 de enero.

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 👀

¿Qué te pareció el email de hoy?

Iniciar Sesión o Suscríbete para participar en las encuestas.

¡Hasta mañana! 🤟