• Frontenderos
  • Posts
  • #137 Como evitas romper tu aplicación React en producción

#137 Como evitas romper tu aplicación React en producción

No subas tu PWA a las tiendas de aplicaciones

Como evitas romper tu aplicación React en producción

¿Sabes que son los Error Boundaries en React? Los Error Boundaries son componentes que atrapan errores JavaScript, guardan el registro de esos errores y muestran un mensaje en la UI de que algo falló sin que se rompa la app. Y en esta guía aprenderás lo básico para integrarlos en tus proyectos.

No subas tu PWA a las tiendas de aplicaciones

Las PWA o Progressive Web Applications, no son aplicaciones para subir a tiendas. Al contrario, son la respuesta a tener que depender de ellas. Por eso no deberías subir tus PWAs a las tiendas.

Como instalar React Native en Windows

iheartradio fiesta latina GIF by iHeartRadio

🎵 No hay nada más difícil que vivir sin ti 🎵. Digo, no hay nada mas difícil que instalar herramientas de desarrollador y ambientes en Windows, por eso te dejamos esta guía para configurar tu Windows para que hagas apps en React Native.

HERRAMIENTA 🛠️ 
ElementPlus

ElementPlus, es una biblioteca de componentes para Vue 3, que tiene todo lo que necesitas y más. Con esta biblioteca open source, y tu conocimiento de Vue, podrás construir cualquier proyecto de tipo dashboard o hasta homepages.

Penrosa

Crea hermosos diagramas utilizando notación sencilla de texto, exacto, no necesitas saber de lenguajes de programación, solo un poco de lógica y sentido común.

GUÍA 📖 
Una guía rápida a render()

Puede que hayas aprendido a utilizar render() cuando react aun estaba en versiones menores pero, ¿te has puesto a pensar que tanto sabes de render en la actualidad? Dale una refrescada a tus conocimientos con esta guía.

INISPIRACIÓN 💡 
Emoji Kitchen

Para que te inspires y te desestreses, ¿has probado Emoji Kitchen?, si no lo has hecho, ve corriendo y diviértete un rato.

NOTICIA 📰 
Google va a quitar el warning del modo incógnito

Triste noticia, la ilusión de que Google no sabía lo que pasaba cuando navegabas en modo incógnito, se termina. Google va a cambiar el mensaje que salía cuando navegas en modo incognito por un texto más adecuado a lo que realmente pasa.

UN DÍA COMO HOY 🗓️ 

El 26 de enero de 1983, Mitchell Kapor con su compañia Lotus Development lanza Lotus 123.
El Lotus 123 es conocido como el “Killer application” del IBM PC.
El ingreso de los ordenadores personales al mundo empresarial se debe a la creación de un programa en especial: la hoja de cálculo y la primera hoja de cálculo diseñada fue el Visicalc, el cual tuvo mucha popularidad en su momento.
Como Visicalc no fue patentada surgieron muchos clones del VisiCalc entre los cuales surge Lotus 123.
El mismo año de su lanzamiento (1983) Lotus supera en ventas a VisiCalc y se convierte en el líder de los programas de hoja de cálculo.

VACANTE 💼 
Frontend Developer

Ubicación: México (Remoto)
Empresa: Web Shop Manager
Requisitos: Al menos cuatro años de experiencia en la creación de aplicaciones de software a gran escala. Experiencia en la traducción de prototipos y diseños UI/UX en interfaces de trabajo. Sea perfecto en píxeles. Experiencia en la industria automotriz y estándares de repuestos automotrices como ACES y PIES. Excelentes habilidades de comunicación y resolución de problemas. Experiencia trabajando en un entorno de inicio de equipos pequeños. Entre otros.

“Si es un desarrollador frontend talentoso al que le apasiona crear soluciones innovadoras y prosperar en un entorno de startups de ritmo rápido, nos encantaría saber de usted.”

Para aplicar, click aquí. 🤞 

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

function ordenarPorFecha(array, claveFecha) {
    return array.sort((a, b) => {
        const fechaA = new Date(a[claveFecha]);
        const fechaB = new Date(b[claveFecha]);
        return fechaA - fechaB;
    });
}

// Ejemplo de uso
const registros = [
    { evento: "Concierto", fecha: "2022-03-01" },
    { evento: "Seminario", fecha: "2022-02-15" },
    { evento: "Conferencia", fecha: "2022-02-20" }
];

console.log(ordenarPorFecha(registros, "fecha"));
// Debería ordenar los objetos por la propiedad fecha

-La función ordenarPorFecha toma un array array y una clave claveFecha como argumentos.
• Utiliza el método sort para ordenar el array. Dentro de la función de comparación de sort, convierte las fechas (almacenadas en las propiedades indicadas por claveFecha) a objetos Date.
• Luego compara estas fechas y ordena el array en función de la comparación. • Devuelve el array ordenado.

CHALLENGE DE HOY ⚔️ 
Crea una función en JavaScript que comprima una cadena de texto, agrupando caracteres consecutivos.

  1. Implementa una función comprimirCadena que acepte una cadena de texto como argumento.

  2. La función debe retornar una nueva cadena comprimida en la que los caracteres consecutivos sean representados por el carácter seguido de su frecuencia consecutiva.

  3. Si un carácter aparece solo una vez consecutivamente, no añadas un número después de él.

Ejemplo:

console.log(comprimirCadena("aabcccccaaa")); // Debería retornar "a2bc5a3"
console.log(comprimirCadena("abcd"));       // Debería retornar "abcd"

Puedes utilizar un bucle para recorrer la cadena y comparar cada carácter con el siguiente.
• Mantén un contador para los caracteres consecutivos y construye la nueva cadena a medida que avanzas.

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! 🤟