Volver

Telecom Institucional

Telecom Institucional fue el primer proyecto profesional del que fui parte con el equipo de EstoEs. Mi rol en este proyecto era de desarrollador front end y reviewer de pull requests.

En este proyecto utilizamos React como librería base para el front end. Para estructurar los componentes, utilizamos Atomic Design. Me gustaría destacar otras librerías que usamos para el proyecto y con las que cuento experiencia:

• Next: Next lo utilizamos para mejorar la performance del anterior sitio y tener una mejor SEO. Considero que fue una buena decisión. En este sitio utilizamos getServerSideProps por lo que lo convirtió en un sitio hibrido. Fue la primera vez que utilicé Next, y la experiencia que me llevo es buena. Es una librería que me gustó mucho y planeo utilizarla en próximos proyectos.

• MaterialUI: MaterialUI es una librería de componentes de React, que se basa en la normativa de diseño Material Design. De esta librería utilicé componentes para armar el layout, tales como Container, Grid, componentes para formularios, hasta componentes mas complejos. De esta librería me llevo experiencias muy positivas, permitió tener una mejor experiencia de desarrollo y nos ahorró mucho tiempo. La documentación es muy buena, y los componentes son muy faciles de personalizar. Además es una librería muy potente que permite crear temas y tu propio design system.

• Redux: Redux es un contenedor predecible de estado. Lo utilizamos para manejar el estado de las notas del sitio. Lo utilizamos junto a Redux Thunk para las peticiones asíncronas. Lo que es el estado, acciones y selectores lo hicimos a mano, sin Redux Dev Toolkit, si hubiéramos utilizado este los tiempos de desarrollo hubiesen sido más rápidos.

Qué me pudo haber salido mejor

Creo que el tipado es un punto a mejorar en este proyecto. Hubiera sido buena idea utilizar TypeScript, la experiencia de desarrollo habría mejorado. También me hubiera gustado mejorar más lo que es el manejo de estados en las notas, y como se pedía la información a la api.

Otra cosa que me hubiera gustado mejorar es como personalizábamos el SEO. El problema que teníamos, era asignar una etiqueta a un componente, según en que sección este. Por ejemplo, supongamos que tenemos un componente <Title>, y este componente va a estar en la sección Inicio, y en Contacto. En inicio tiene que ser un h1, y en Contacto un h2. Me dirán que le pase la etiqueta que quiero que sea una prop llamada tag (por ejemplo). Pero en este sitio teníamos componentes mas complejos, y no era tan sencillo como pasarle una prop, ya que un mismo componentes podía estar en mas de dos secciones, y también un mismo componente tenia diferentes 'variantes'.

Qué me salió bien

Lo que si me gustó como se hizo, es la reutilización de componentes. Con el equipo hicimos componentes con un buen grado de reutilización, lo que permitió sacar secciones y sub-secciones mas rápido, ya que se utilizaban componentes hechos en anteriores secciones.

Qué aprendí

Como dije Telecom Institucional fue el primer proyecto profesional del que fui parte. Aprendí a trabajar y comunicarme con el equipo. Aprendí a utilizar plataformas como BitBucket, Slack y Teams de Microsoft. Por el lado técnico, aprendí Next, MaterialUI, entre otras.

Conclusión

De este proyecto me llevo cosas muy positivas. Cuando ves en producción algo que te costó trabajo, es una sensación espectacular, y mas cuando ves con la calidad que salió. De este proyecto me llevo cosas a mejorar, como la comunicación y también librerías para utilizar en futuros trabajos, como Material y Next.