Hace unos años que finalmente que el desarrollo web quedó dividido en backend y frontend. Desde ese momento, la evolución que ha experimentado el desarrollo front ha sido espectacular. De hecho me atrevería a decir que los avances han sido de mucho mayor calado en esta especialidad. Además, cada poco tiempo asistimos a la aparición de nuevas librerías, frameworks y funcionalidades que empujan un poco más hacia adelante este mundo. Lo que antes se limitaba al HTML, CSS y un poquito de Javascript ahora es un conglomerado de conceptos y tecnologías que hay que seguir atentamente para no quedarse demasiado atrás.

El otro día me preguntaron si veía sentido a la figura del maquetador en 2020 y, lamentablemente, respondí que no. Ahora mismo me resulta muy difícil imaginar el desarrollo front sin Javascript. De hecho voy más allá: diría que ya no basta sólo con conocer este lenguaje y dominar alguno de sus frameworks/librerías, sino que para ser cada vez más completos necesitamos conocer unas cuantas cosas más.

¡Vamos a verlas!

El navegador

El navegador es al desarrollo front lo que el aire puede ser a un ingeniero aeronáutico: es el medio en el que se ejecutará nuestra aplicación. Por eso creo que es vital conocer su funcionamiento y las herramientas de las que nos provee.

Hoy mismo leía un artículo acerca de que ya se está implementando en los navegadores modernos un sistema de autenticación por huella por medio de la API WebAuth para aprovechar los lectores que incorporan los dispositivos. Eso por no hablar de la gran cantidad de utilidades que tenemos a nuestra disposición en la consola de desarrolladores de los navegadores: análisis de rendimiento, visualización de datos de carga, consola de depuración…

Por eso de vez en cuando no está de más revisar las últimas novedades que han aparecido para así disponer de un abanico de opciones más amplias para desarrollar nuestra aplicación web.

SEO

Sí sí. Ya sé que existen departamentos especializados en posicionar las páginas web dentro de los navegador. Sin embargo, muchas de estas técnicas que se emplean requieren finalmente de programación, pues no todo puede lograrse mediante Google Tag Manager.

Por ejemplo, la aparición del framework AMP ha introducido una nueva forma de crear nuestras páginas webs a la vez que las sobreoptimizamos para su indexación por los motores de búsqueda.

Por otra parte, tener un tiempo de carga reducido es cada vez más necesario si queremos que nuestra página sea “bien vista” por los buscadores. Eso por no hablar de los avisos que Google va a emitiendo regularmente: “o tu web tiene versión móvil o desaparecerás de los listados.”

Con esto no quiero decir que sea necesario que te conviertas en un especialista SEO. Sin embargo, creo que nunca está de más estar al día de las principales novedades en lo que SEO se refiere para que cuando nos llegue el momento de integrarlas no nos pille por sorpresa.

Además, no siempre tenemos un equipo de SEO que se encargue de revisar lo que hagamos, por lo que si podemos aportar algo de valor en ese sentido a nuestra web eso que ganaremos de cara a nuestros clientes.

API’s

Desarrollar para front implica olvidarse de crear las API’s, pues eso (de momento al menos), es específico del backend.

Sin embargo creo que es interesante tener nociones de cómo se definen las API’s y la mejor forma de consumirlas.

Si trabajamos con API’s REST, creo que entender la diferencia entre una llamada POST y un PUT/PATCH reforzará la estructura de la aplicación que estamos construyendo.

Además, con la aparición de GraphQL el consumo de API’s ha pasado a depender cada vez más del front, pues somos nosotros quienes especificamos los campos que necesitamos de cada entidades. De hecho el framework Gatsby del que hablé en mi canal hace poco levanta su propia API sobre GraphQL:

Por tanto, mi recomendación es que dediques algo de tiempo a familiarizarte con el mundo de las API’s: sus principales conceptos, paradigmas y librerías (como Apollo) para conectarnos a ellas.

Tests

Podría parecer en un principio que los tests es algo más del backend. Nada más lejos de la realidad. En el momento en que tu aplicación adquiera un tamaño relevante los tests son tu salvavidas para añadir funcionalidad sin preocuparte de romper algo por el camino.

Disponer de una buena suite de tests además te permitirá vivir con la certeza de que a medida que desarrollas todo sigue funcionando y podrás anticipar posibles fallos en tu código mientras los implementas.

Que levante la mano a quien no se le haya escapado alguna vez en producción un undefined que provoque que la aplicación muestre un mensaje de error gigante.

Por tanto, no sólo te centres en aprender la última librería de moda, sino invierte tiempo en aprender a usar las herramientas que te permiten definir tests sobre los elementos de tu aplicación: aprenderás multitud de cosas por el camino que te servirán durante el resto de tu vida como desarrollador.

Diseño y UX

Ser frontend implica que más tarde o más temprano alguien verá aquello que estamos desarrollando. Del mismo modo que sucede con el SEO, no siempre tendremos la suerte de trabajar en proyectos que cuenten con un equipo de diseño / UX.

Te contaré algo: mi gusto es pésimo. Soy de esas personas que nacieron con un nulo sentido estético por lo que cuando empecé a trabajar como desarrollador tuve que dedicar bastante tiempo a aprender los conceptos básicos que me permitieran diseñar webs que no hicieran daño a los ojos.

Es probable que en la vorágine del día a día de vez en cuando te toque implementar cambios sobre el diseño final que tendrás que pensar tú. Créeme:

ya puede ser la mayor obra de arte a nivel de lógica, que si se ve feo nadie lo valorará bien.

Lo mismo sucederá si preparas una vista que el cliente no sabe cómo usar. A menudo parece que vivimos en un mundo idílico donde existen equipos multidisciplinares que se dividen las tareas y todo funciona como una maquinaria perfectamente engrasada. En la vida real la historia es otra, por lo que ya que vas a especializarte en desarrollo frontend invierte algo de tiempo en conseguir que lo que hagas luzca bien.

Esto mismo se aplica al UX. Vivimos en los tiempos en que consumimos información a una velocidad pasmosa. Lee de vez en cuando artículos relacionados sobre este tema: te abrirán mucho más la mente y descubrirás cosas muy muy interesantes sobre cómo funciona la mente humana.

Conclusión

¿De verdad necesito saber sobre todo esto? Si me has leído alguna otra vez o me sigues en Linkedin sabrás que soy muy crítico con esa moda de estar siempre a la última en todo. “Aprendiz de todo, experto de nada” es un refrán que resume perfectamente mi postura en lo que se refiere a acumular conocimiento sin ton ni son.

Sin embargo, sí creo que tener nociones sobre todo aquello que rodea a lo que hacemos resulta de gran ayuda. Y no sólo desde una perspectiva puramente profesional, sino que también nos permitirá crecer a nivel personal. El caso de la UX es un buen ejemplo. Muchos de los motivos que hay detrás de un color de un botón o de una negrita están más ligados al funcionamiento de la mente que a una mera cuestión estética. Aprender sobre estos temas y posteriormente aplicarlos mientras programamos es muy satisfactorio y hará nuestro día a día delante de la pantalla mucho más interesante.

¿Quieres recibir más artículos como este?

Si te ha gustado este artículo te animo a que te suscribas a la newsletter que envío cada domingo con publicaciones similares a esta y más contenido recomendado: 👇👇👇

Apóyame en Patreon

🧡🧡🧡 Gracias a: Joseba, Óscar, Alex y Jorge.