Qué significa ser un desarrollador front-end en 2020 (y más allá)

¿Alguna vez pensaste en lo que realmente significa la parte front -end del desarrollador front-end? Una vez le pregunté a Eric Meyer (quien ha estado creando sitios web durante casi tanto tiempo como ha habido sitios web) si sabía lo que significaba el término en los primeros días, y dijo que sí. Por lo tanto, no es un título o puesto completamente nuevo, pero ciertamente ha cambiado de alcance a lo largo de los años.

"Front-end" significa esencialmente un navegador web. Me considero un desarrollador front-end y, sinceramente, no odiaría que me llamaran desarrollador de navegadores web. Pero, eso probablemente no se dará cuenta (y suena como si estuvieras construyendo navegadores web). Como desarrollador front-end, trabaja muy de cerca con los navegadores web y escribe el código que se ejecuta en ellos, específicamente HTML, CSS, JavaScript y el puñado de otros idiomas que hablan los navegadores web (por ejemplo, formatos de medios como SVG). O, tal vez incluso más comúnmente explicado, el código que finalmente se procesa en los idiomas que entienden los navegadores. ¡Ese es tu territorio como desarrollador front-end!

Los navegadores no existen solos, se ejecutan en un amplio panorama de dispositivos. Aprendimos eso a través de la era del diseño receptivo. Y lo más importante: los usuarios usan esos navegadores en esos dispositivos. Nadie está más cerca del usuario que los desarrolladores front-end. Entonces, los desarrolladores front-end escriben código para personas que usan navegadores que se ejecutan en una amplia variedad de dispositivos.

​​¡Solo lidiar con este enorme panorama de usuarios, dispositivos y navegadores es un trabajo en sí mismo! Creo que no todos los días piensas filosóficamente sobre el título de tu trabajo, y eso está bien; solo estamos reflexionando un poco aquí con tu viejo abuelo Chris.

​​Si se acaba de graduar de un bootcamp de codificación y su experiencia en la creación de sitios web es algo limitada y nueva, se le puede perdonar si piensa en el desarrollo de front-end como "el material de React" y el desarrollo de back-end como "el Nodo". cosas” o “las cosas de Python”, como son los sabores más populares en estos días. No te equivocas tampoco. React se usa generalmente como un marco front-end (es literalmente JavaScript que se ejecuta en los navegadores). Node y Python son ejemplos de lenguajes que realmente no se ejecutan en navegadores web; están diseñados para ejecutarse en servidores web (uhh, computadoras).

Quédese en este campo por un tiempo y verá que estas bibliotecas, idiomas, procesos de creación y diablos, incluso filosofías completas sobre la mejor manera de crear sitios web van y vienen como una marea lenta.

Es posible que veas a algún veterano agitando el puño de vez en cuando, gritando que debemos aprender de los errores del pasado. También podría presenciar a algunos jóvenes particularmente bulliciosos agitando los puños igual de alto, pronunciando el pasado como un contexto irrelevante y que ya no es un tema de conversación útil.

Ambos tienen razón, probablemente. Mientras nadie sea desagradable, todo es parte del flujo.

Las cosas cambian. Creo que es cierto que muchos sitios web de hoy son más complejos que los sitios web del pasado. Particularmente los grandes. Las redes sociales y reproductores multimedia. Los sitios de reserva de viajes. Los escaparates de comercio electrónico. Las herramientas de ingeniería. Estos sitios comenzaron grandes y solo se han vuelto más grandes. Son economías en sí mismos con equipos masivos que los apoyan. Esta complejidad es una causa de cambio en la tecnología web y una causa de fricción entre la nueva y la vieja escuela (si podemos pintarlo así de simple).

Muchas personas que trabajan en tecnología trabajan, esencialmente, para un gran sitio web. Y entonces escuchamos de estas personas con mayor frecuencia. Estas personas construyen herramientas. Escriben publicaciones en blogs, van a podcasts, dan charlas. Ayudan a cambiar la tecnología en sí, para adaptarla a sus necesidades.

Mientras tanto, el "front-end" sigue siendo solo el navegador. Los lenguajes de los navegadores, HTML, CSS y JavaScript siguen siendo las tecnologías centrales en juego. Esos lenguajes evolucionan, al igual que los propios navegadores, pero más lentamente. Hacen todo lo contrario del eslogan favorito de Silicon Valley: muévete rápido y rompe cosas . Se mueven lentamente y muy raramente rompen algo.

​​Ser un desarrollador front-end todavía se preocupa por los usuarios que usan esos navegadores en esos dispositivos. Su experiencia es nuestro trabajo. Las herramientas simplemente nos ayudan a hacerlo, con suerte.

Entonces, ¿qué haces como desarrollador front-end?

• Estás ejecutando el diseño de manera que se vea bien en cualquier pantalla
• Estás aplicando semántica al contenido.
• Estás creando una interfaz de usuario de manera abstracta para que puedas reutilizar partes y estilos de manera eficiente.
• Estás considerando la accesibilidad de lo que se muestra en el navegador.
• Le preocupa el rendimiento del sitio, lo que significa que está tratando con el tamaño y la cantidad de recursos que utiliza el navegador.

​​Esas cosas siempre han sido ciertas, y siempre lo serán, ya que son fundamentalmente preocupaciones a nivel del navegador y eso es lo que es el front-end.

​​Lo que está cambiando es que el navegador es capaz de más y más trabajo. Hay todo tipo de razones para eso, como que las API del navegador se vuelven más capaces, las bibliotecas se vuelven más elegantes y las computadoras mejoran, en general. La descarga de trabajo del servidor al navegador ha cobrado cada vez más sentido a lo largo de los años (¡aplicaciones de una sola página!). Aunque es interesante ver cómo el péndulo retrocede (¡sitios renderizados previamente!) y encuentra un término medio (¡JAMstack!).

​​El desarrollo de front-end en estos días también podría incluir:

• ​​Arquitectura de todo el sitio desde el componente más pequeño hasta páginas completas hasta el nivel de URL
• Obtención de sus propios datos de las API y manipulación de los datos según sea necesario para su visualización
• Lidiando con el estado del sitio por su cuenta
• Mutar/cambiar datos a través de la interacción y la entrada del usuario y conservar esos datos en el estado y volver a los servidores a través de las API.

Esas son todas las cosas que se pueden hacer en el navegador ahora, para los ojos muy abiertos de este antiguo desarrollador. Eso es un gran montón de responsabilidad cuando consideras que está por encima de todo lo que ya tienes que hacer.

Si bien ese montón de trabajos tiende a crecer con los años, la luz que nos guía como desarrolladores front-end no ha cambiado mucho. Nuestra principal responsabilidad sigue siendo cuidar de los usuarios que utilizan navegadores web en los dispositivos. Así que tenemos que buscar algunos datos. Eso es genial, lo estamos haciendo al servicio de la creación de una página rápida, semántica y accesible para satisfacer las necesidades de nuestros usuarios. Así que necesitamos construir un sistema de diseño. Eso es genial, lo estamos haciendo para crear una interfaz comprensible para nuestros usuarios capaz de evolucionar sin crear un desorden inconsistente. Así que tenemos que aprender alguna nueva tecnología desconocida. Bueno, es nuestro trabajo mantener un ojo vigilante y asegurarnos de que lo nuevo finalmente esté allí para mejorar nuestro sitio para los usuarios.

¡Buena suerte!

Qué sigue: por qué Chris Coyier elige Local y Flywheel para potenciar sus sitios web

Aprenda cómo Chris usa Local y Flywheel para llevar sus sitios al siguiente nivel. Vea cuáles son sus funciones favoritas, cómo confía en Flywheel para migrar sus sitios (¡gratis!) y mucho más. Clic aquí para saber más.