Saltar al contenido principal

wiki-4.-Stack-Tecnológico

Ver en Git

4. Stack Tecnológico

Esta biblioteca de componentes de React fue desarrollada con la última versión LTS de Node.js (v.LTS-20) y el bundler Vite, entre otras cosas. Queremos compartir las razones detrás de nuestras elecciones en cuanto al stack tecnológico, que respalda la estructura y el flujo de trabajo de este proyecto.

Razones para Elegir Vite como Bundler​

Seleccionamos Vite como nuestro bundler principal por las siguientes razones:

  • Rapidez en el Desarrollo: Vite es conocido por su arranque ultrarrápido. Al aprovechar la capacidad de carga diferida, acelera significativamente el tiempo necesario para recargar y visualizar los cambios durante el desarrollo.

  • Optimización del Tiempo de Compilación: Vite utiliza la ejecución de módulos en el navegador para el desarrollo, lo que reduce la necesidad de un proceso de construcción lento. Esto se traduce en una experiencia de desarrollo más fluida y eficiente.

  • Soporte para ESModules nativos: Vite aprovecha las capacidades nativas de los navegadores para cargar módulos ES (ECMAScript) sin requerir transformaciones complejas, lo que se traduce en un código más limpio y eficiente en producción.

  • Configuración Mínima: Vite simplifica la configuración al máximo. Con una configuración por defecto bien pensada, podemos concentrarnos en el desarrollo de componentes en lugar de lidiar con configuraciones complicadas.

Elección de Node.js LTS​

En grandes rasgos, optamos por la última versión LTS actual de Node porque nos permite asegurar el soporte y mantenimiento de las dependencias sin necesidad de realizar una migración en el corto plazo. Maximizando el tiempo de vida del proyecto sin neesidad de recurrir a cambios muy grandes, de forma tal que podamos avanzar sin problemas durante un largo tiempo, y sin preocuparnos por si las librerías usadas quedan deprecadas o pierden soporte para la versión de Node que usemos.

Optamos por utilizar la última versión LTS (Long-Term Support) de Node.js (LTS-20) por varias razones:

  • Estabilidad y Mantenimiento: Las versiones LTS de Node.js ofrecen un nivel de estabilidad y soporte a largo plazo. Esto asegura que nuestro proyecto esté construido sobre una base confiable y bien mantenida.

  • Compatibilidad: La versión LTS de Node.js garantiza una amplia compatibilidad con diversas bibliotecas y paquetes utilizados en el desarrollo de aplicaciones web, lo que reduce la posibilidad de problemas de incompatibilidad.

  • Seguridad: Las actualizaciones de seguridad son esenciales para cualquier proyecto. Al utilizar la versión LTS, podemos asegurarnos de recibir actualizaciones y parches de seguridad de manera regular.

Otros​

  • Módulos de CSS. CSS modules nos permite crear clases y dar estilos a componentes de una forma aislada. Es decir, los estilos entre componentes no se pisarían entre sí, ni interferirían con otros elementos del DOM en la aplicación en la que se esté usando. Esto se logra a partir del uso de un hash para cada clase, creado durante el proceso de build. Debido al uso de vite, no se precisa configuración para usar CSS modules.
  • Testing: vitest. Une herramienta de testing cómo cualquier otra, con la diferencia que tiene integración nativa con vite.
  • Linter: Standard. Es un estándar adoptado a nivel global. Buscamos que las reglas de linting no sean facilmente modificables, ni queremos perder tiempo en elegir esas reglas. (Hoy somos 10, cuando seamos 100 va a ser má complicado). Más información: Feross Aboukhadijeh: Write Perfect Code With Standard And ESLint - JSConf.Asia 2018
  • Typescript. Es javascript con tipado fuerte. No solo permite exportar las interfaces de los componentes sin crearlas manualmente(para tener sugerencias en la ide y no tener problemas en otros desarrollos con typescript), sino que acelera el desarrollo a largo plazo y previene errores prematuros que puedan pasar desapercibidos antes de la puesta en producción.