Remake de un proyecto
Iterar en un proyecto puede ser una experiencia muy gratificante, ya que te permite mejorar la apariencia visual, la lógica y la funcionalidad del mismo. En este caso, rehicimos un juego de memoria de cartas, pasando de JavaScript puro a React, TypeScript, estilos personalizados con SASS y el uso de clases genéricas de Tailwind.
Antes de comenzar la implementación, creamos un diseño en Illustrator que incluía la temática de frameworks, librerías y herramientas de construcción del ecosistema de JavaScript, así como el valor de su tier según la encuesta del State of JavaScript.
Para el diseño de la apariencia, utilizamos Grid y Flex, junto con algunos media queries para ajustar el layout según el tamaño del dispositivo. Una de las propiedades que nos ayudó a reducir los media queries fue el uso de grid-template-columns con auto fill y minmax en el contenedor padre, lo que permitió un ajuste adecuado a los diferentes tamaños de dispositivo.
La cara visible de las cartas, lo queria con un diseño de tipo Art Deco, el cual fue fácil de encontrar en línea. Buscamos una base y le hicimos algunas modificaciones para adaptarlo a nuestras necesidades.
Con la ayuda de TypeScript, fue sencillo definir la data y el esquema de la lógica que se utilizaría. Esto simplificó la creación de los componentes y el objeto con los datos.
Finalmente, agregamos funcionalidades al juego, como una lluvia de confeti al finalizar la búsqueda de pares y la opción de reiniciar el juego en cualquier momento. En resumen, iterar en un proyecto resulta en un producto final más completo y satisfactorio.
El Resultado
Conclusión
En conclusión, Rehacer un proyecto es un proceso fundamental para mejorar la apariencia, la lógica y la funcionalidad de un producto. Al rehacer un juego de memoria de cartas, se logró una experiencia más satisfactoria para el usuario. En definitiva, iterar en un proyecto es una excelente forma de mejorar y lograr un producto final de alta calidad.