¿Cuáles son los Roles del desarrollo Front-end?

En los primeros años del desarrollo web, era común que una sola persona (bajo el título de Web Master) se encargará de desarrollar enteramente una página web, sin embargo, con la llegada del lenguaje HTML5 los navegadores obtuvieron la posibilidad de ejecutar aplicaciones web y con ello, el trabajo de desarrollo de un sitio en internet se separó en dos divisiones, la división los programadores Back-end y la división de los programadores Front-end.

Aquí te vamos a explicar de una manera sencilla los roles de los programadores Front-end, que usualmente se dividen en UI Developer/Diseñador UI, Web Designer/Maquetador y Front-end Developer/Programador Front-end, aunque también se pueden llegar a dividirse en más o ramificarse para dar lugar a una especialidad, estos son los que podrían considerarse como los roles generales. Empecemos:

UI Developer / Diseñador UI

Programas que suelen ser utilizados: Sketch, Figma y Adobe XD.

En este trabajo no se escribe nada de código, más bien todo se lleva a cabo en programas dedicados al diseño digital, como los programas que resaltan más arriba. Sin embargo, aunque todo sea diseño, esto no significa que cualquier diseñador gráfico pueda hacerse con el trabajo, ya que, por ejemplo, se necesita experiencia en la interacción del usuario con la página y se debe cuidar el buen funcionamiento de los flujos de cada proceso, para ello, se hacen reuniones con el equipo de desarrollo, así se puede estructurar bien el diseño de la página web y evitar futuros problemas, también debe considerar las pantallas a realizar para evitar problemas en los que las maquetas creadas no puedan ser llevadas a código. El UI Developer usualmente diseña siguiendo un esquema propuesto anteriormente en conjunción con el equipo de desarrollo, pues toda esta etapa hay que definirla y documentarla antes de empezar a crear las pantallas del sitio web.

Para poner en contexto el trabajo de un UI Developer, en YouTube, el se encargaría de diseñar la página Inicio del sitio, los menús desplegables, los botones de suscribirse, la posición y forma en que se muestran los comentarios, etc, así como del flujo que hay que seguir para pasar de una página a otra.

Web Designer / Maquetador

Lenguajes indispensables: HTML, CSS y JavaScript

El trabajo del Web Designer es llevar las pantallas diseñadas por el UI Developer a código HTML y CSS, el cual se ejecuta al cargar la página web. Tener un buen código de HTML nos ayuda para la usabilidad y el marcado del sitio, además también mejora el posicionamiento de la página en los motores de búsqueda como Google o Bing, mientras que una buena sintaxis escrita en CSS está directamente relacionada con el rendimiento del sitio web y de las aplicaciones, por ello se necesita un amplio conocimiento de estos dos lenguajes.

Además, es recomendado tener conocimientos medios de JavaScript ya que, aunque no es muy común escribir código puro de dicho lenguaje sí que se utilizan bibliotecas de este, como React.js por ejemplo, cuya sintaxis (JSX) es muy parecida a HTML, lo cual hace que nos podamos familiarizar rápidamente a esta biblioteca.

En Azul School tenemos un curso muy completo que te puede ayudar con este tema: Curso profesional de HTML, CSS y JS.

Programador Front-end

Bibliotecas de JavaScript utilizadas: React.js, Vue.js, Angular.js

Para este rol la programación se realiza casi enteramente en JavaScript, por lo que su conocimiento a profundidad es obligatorio, para ser más exactos, no es que se escriba código en JavaScript plano, sino que se utilizan diversas bibliotecas o frameworks de este lenguaje. En este punto es importante saber que los Front-end Developers se encargan de agregar la lógica al sitio web, ¿a qué nos referimos con esto? A que ellos o ellas implementan las API provenientes del Back-end o de algún otro servidor externo, las imprime en pantalla y les agrega validaciones para que puedan funcionar. En pocas palabras, se encarga de darle vida al sitio web internamente, por lo tanto, no debería de preocuparse por el diseño de pantalla, el tamaño o color de los botones de los sitios web, ya que de esto se encarga enteramente el UI Developer.

Después de terminar el curso de Curso profesional de HTML, CSS y JS, y conozcas bien como se trabaja con JavaScript, podrías pasarte a nuestro curso de introducción a React, que ademas de enseñarte a trabajar con esta tecnología vas a poder hacer tu primera aplicación con React. Curso profesional de React.

Para finalizar, estos roles pueden llegar a superponerse unos a otros, pero no es recomendable que una sola persona se encargue de todo el trabajo, no en estos tiempos y menos si se quiere tener un sitio web bien estructurado y optimizado. Puede llegar a suceder que, un Back-end Developer sea a la vez el Web Designer del sitio, pero que un UI Developer sea el Programador Front-end al mismo tiempo no es para nada viable, no a nuestro parecer, ya que son los dos extremos de todo el equipo de desarrollo se podría decir.