#255 El estado de HTML 2023
Layouts de CSS modernos
El estado de HTML 2023
![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/ab83650e-17e4-4d01-bb57-f3b559972644/html2023-og.png?t=1720483989)
¿Respondiste el State of HTML 2023? Porque ya salieron los resultados y este es un buen momento para leerlo y ponerte a estudiar todas las cosas nuevas que puedes hacer con HTML.
Layouts de CSS modernos
![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/df177f80-6ebd-42f7-9167-6e3d29ac8a3a/descarga__1_.png?t=1720484506)
Una de las principales razones por las que la gente frontendera sigue usando herramientas como Bootstrap, es porque funciona y porque te da utilerías indispensables para construir super rápido, por ejemplo, sus clases para Grids y Layouts. Y como dice el dicho, si funciona para que romperlo. A menos que te guste el CSS y quieras tener mas control de lo que haces y menos dependencia hacia proyectos de terceros, entonces te recomendamos seguir este articulo sobre como construir layouts de CSS modernos.
Buenas practicas de diseño
![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/d2948bdd-3601-4310-94c8-c1c466c94a3f/list.png?t=1720484723)
Nombrar las cosas es difícil. No es lo más difícil al momento de construir software en términos técnicos, pero si te puede detener a pensar, o hasta bloquear, si no sabes seguir buenas recomendaciones. Lo más importante siempre será seguir convenciones y buena comunicación con tu equipo. Y si bien esta guía es para diseñadores en Frontenderos, siempre hemos dicho que todos somos diseñadores en potencia.
No, no quiero llenar tu formulario de contacto
![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/a018fb15-dd83-47e0-bb54-1a025b6023aa/2036991.png?t=1720485030)
¿Cuándo fue la ultima vez que diseñaste un formulario de contacto para un proyecto? ¿Cuándo fue la ultima vez que le diste mantenimiento? ¿Cuándo fue la ultima vez que hiciste pruebas de uso entre diferentes usuarios para optimizar? ¿Cuándo fue la ultima vez que pensaste en el mal diseño de un formulario de contacto? Si alguna de estas preguntas te hizo sentido y recordaste algo, tienes que leer este artículo que te hará repensar muchas cosas al respecto.
Perro viejo, nuevos trucos de CSS
![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/cd243abb-664c-4ac5-a301-afc8994180dd/cover.jpg?t=1720485321)
Existen muchas cosas nuevas que no usamos cuando estamos diseñando y desarrollando sitios web, principalmente porque no las conocemos y segundo porque no da tiempo para aprenderlas. Ademas, CSS es un lenguaje muy resiliente y es muy probable que código del 2004 aun funcione y se vea bien hoy en 2024. ¿Entonces para qué aprender CSS moderno? Para tus usuarios. Con el conjunto de características existentes y bien soportadas puedes crear interfaces accesibles, universales e inclusivas. Y lo mejor es que puedes ir haciendolo una regla a la vez.
Como construir funciones JavaScript que tomen multiples parámetros
![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/85781215-a0ec-427f-a9cc-5edecc8ffd2a/how-to-compose-javascript-functions-that-take-multiple-parameters.png?t=1720485603)
A veces uno quiere construir simple y mantenerlo simple para futuras modificaciones. Pero a veces uno se encuentra con que construir simple significa más código, y el mantenimiento y la complejidad aumenta. Con JavaScript esto puede pasar bien fácil, entonces, si pudieras tener composibilidad para que tus funciones acepten multiples parámetros, entonces reducirías el código y podrías hacerlo mas mantenible. Y aquí te contamos como.
OFERTA ESPECIAL PARA TI ⭐️
Mentoria gratuita
![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/d2ae57cc-c017-4e7f-9043-72d1062cc3c5/T045LPEE9-U045LPEEB-42f437647e44-512.png?t=1717123425)
Sabemos que el camino del desarrollo frontend tiene sus desafíos, desde problemas de código, hasta dudas sobre reclutamiento. ¡Estamos aquí para ayudar!
A partir de ahora, vamos a estar a ofreciendo 3 sesiones de mentoria de 1 hora cada semana. Estas sesiones están pensadas para ayudarles con cualquier cosa que necesiten: revisiones de código, consejos sobre cómo conseguir ese trabajo soñado, o cualquier otro tema que les preocupe.
Las mentorías las va a dar nuestro amigo del podcast y newsletter, Hec Sanchez, Lead Frontend Engineer y consultor con 15 años de experiencia en el Frontend.
¿Cómo funciona? Muy sencillo:
👉️ Reserva tu espacio a través de este enlace. Elige la hora que mejor te venga y, ¡prepárate para una sesión llena de aprendizaje y soluciones!
Queremos que se sientan apoyados y motivados en cada paso de su carrera. Así que no duden en aprovechar esta oportunidad. Estamos aquí para ustedes.
¡Nos vemos en la próxima sesión! 😉
VIDEO 📹️
¿Qué hay de nuevo en la Web?
![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/49da0844-63ca-40ea-9527-930759f4ed74/W8bokbLn1G8_480x360.jpg?t=1720485788)
Rachel Andrew es una de las voces más autorizadas para hablar de HTML/CSS y la Web en general, y en el Google I/O 24 dejó este video que tienes que ver si eres frontenderx de hueso colorado.
GUÍA 📖
Aprende a usar el compilador de React
![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/fe492c2f-d338-4e3a-be49-308b62acec64/og-learn.png?t=1720485929)
Ya puedes usar el compilador de React pero, ¿ya lo estas aprendiendo a usar? Asi como paso con los hooks o las funciones sobre clases, este es otro cambio de paradigma que puede hacer que mejores como React developer
HERRAMIENTA 🛠️
React Google Maps
![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/9237e4e9-e8d7-473b-8659-bb54b00cd3b3/images.jpeg?t=1720486322)
Uno de los componentes mas comunes cuando estas construyendo un sitio web en el que tienes que mostrar ubicaciones geográficas es un mapa, y React Google Maps es un must en tu cinturón de herramientas.
SolidStart
![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/076a8bf6-0fae-4568-9a5d-e37c6383dd1b/descarga.jpeg?t=1720486496)
A diferencia de React, que tiene muchos meta frameworks, o incluso Angular que no tiene uno oficial, todas las demás bibliotecas y frameworks JavaScript sí tienen un meta framework oficial, y si no conocías Solid este puede ser una excelente manera de ver si es una herramienta para construir esos proyectos en los que puedas experimentar un poco.
UN DÍA COMO HOY 🗓️
![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/24bbc54a-3126-414b-ba4e-42b51ed13b99/07-08_Efemerides_de_Tecnologia_Sven_Jaschan.jpg?t=1720487063)
El 08 de julio de 2005, fue declarado culpable de sabotaje informático y de alteración ilegal de datos el hacker Sven Jaschan y recibió una sentencia suspendida de 21 meses
Sven Jaschan fue juzgado como menor de edad debido a que los tribunales alemanes determinaron que Jashan había desarrollado el gusano Sasser antes de cumplir los 18 años.
El gusano Sasser fue lanzado a la red exactamente el día de cumpleaños 18 de Jaschan, el 29 de abril de 2004.
El 07 de mayo de 2004 fue arrestado Sven Jaschan de 18 años, estudiante de ciencias de la computación alemán. Las autoridades alemanas se llevaron a Jaschan en parte debido a la información obtenida en respuesta a una oferta de recompensa por parte de Microsoft de US$250.000.
Uno de los amigos de Jaschan reveló que su amigo no solo había creado el gusano Sasser sino también Netsky.AC, una variante del gusano Netsky.
Sasser es un gusano informático que afecta a equipos con versiones vulnerables de Microsoft los sistemas operativos Windows XP y Windows 2000. Se especula que el 70% de los problemas de Internet durante 2004 fue a causa de este gusano.
Entre los ejemplos de los efectos de Sasser esta la agencia de noticias Agence France Press (AFP), que tuvo todas sus comunicaciones por satélite bloqueadas por horas y la compañía de vuelos deDelta Air Lines
se vió obligada a cancelar varios vuelos transatlánticos porque sus sistemas informáticos habían sido inundados por el gusano.
VACANTE 💼
Frontend/Fullstack Engineer
Ubicación: México (Remoto)
Empresa: Dolami,Inc
Requisitos: Experiencia comprobada en ingeniería, preferiblemente en un entorno de startups. Dominio del inglés, tanto escrito como hablado. Capacidad de superponer horas de trabajo con el equipo para una colaboración efectiva. Un perfil de GitHub que muestra tu trabajo anterior La experiencia en el desarrollo de productos es una ventaja.
Beneficios: Rango salarial: $25K - $38K/año. Opciones de almacenaje Meta Quest 3 (Préstamo)*Si no tienes tus auriculares Trabajo remoto completo.
¿Te interesa? Aquí te dejamos el link para que puedas aplicar. 🤞
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? |
¡Hasta la próxima! 🤟