Interfaces web dinámicas: solución a las limitaciones que presentan Vue y React
Barra lateral del artículo
Contenido principal del artículo
Resumen
Las herramientas como Vue y React son muy populares en el desarrollo eficiente y escalable de interfaces de usuario; son utilizadas para implementar aplicaciones de gran tamaño y complejidad. Sin embargo, cuando se requiere de una experiencia de usuario altamente dinámica y responsiva, estas herramientas presentan algunas limitaciones como: la comunicación entre componentes, el registro de cambios en tiempo real y la manipulación directa del Modelo de Objetos del Documento HTML. En este reporte técnico se propone e implementa la solución a las limitaciones que se presentaron en el desarrollo del proyecto Laboratorio Virtual de Química. La solución conjunta, además del despliegue declarativo de componentes reactivos, los paradigmas de desarrollo web: comunicación vía emisor-suscriptor de eventos y manipulación del Modelo de Objetos del Documento HTML. Se implementó una interfaz web intuitiva, altamente dinámica y responsiva a las interacciones del usuario, que permite la comunicación, interacción y seguimiento en tiempo real de los componentes que representan los distintos materiales y sustancias del laboratorio.
Descargas
Detalles del artículo
Esta obra está bajo una licencia internacional Creative Commons Atribución-NoComercial-SinDerivadas 4.0.
Este trabajo tiene la licencia CC BY-NC-ND 4.0
Citas
De Levie, R. (2001). How to use Excel in analytical chemistry and in general scientific data analysis. Cambridge University Press. DOI: https://doi.org/10.1017/CBO9780511808265
Downey, A. (2022). Modeling And Simulation In Python. O’reilly Media.
jQuery team. (s/f). jQuery. jQuery. Recuperado el 7 de septiembre de 2023, de https://jquery.com
Lehni, J., & Puckey, J. (s/f). Paper.js. paperjs.org. Recuperado el 7 de septiembre de 2023, de http://paperjs.org
McCord, P., & Stanton, E. (2005). pH, Titrations, and Dilutions. Course: General Chemistry I; The University of Texas at Austin. http://mccord.cm.utexas.edu/courses/spring2005/ch301/concentrations.html
MDN Web Docs. (2019, agosto 16). Introduction to the DOM. MDN Web Docs. https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model/Introduction
Miller, J. (s/f). Mitt. GitHub. Recuperado el 7 de septiembre de 2023. https://github.com/developit/mitt
React team. (s/f). Describing the UI – React. react.dev. Recuperado el 7 de septiembre de 2023. https://react.dev/learn/describing-the-ui
Saker Neto, N. (2018). The reason behind the steep rise in pH in the acid base titration curve. Chemistry Stack Exchange. https://chemistry.stackexchange.com/q/8074
Vue team. (2022). Introduction | Vue.js. vuejs.org. https://vuejs.org/guide/introduction.html
W3Schools. (s/f). What is a Front-End Developer. www.w3schools.com. Recuperado el 7 de septiembre de 2023. https://www.w3schools.com/whatis/whatis_frontenddev.asp
Wikipedia contributors. (2023a, septiembre 7). Declarative programming. Wikipedia. https://en.wikipedia.org/w/index.php?title=Declarative_programming&oldid=1174296946
Wikipedia contributors. (2023b, septiembre 7). Event-driven programming. Wikipedia. https://en.wikipedia.org/w/index.php?title=Event-driven_programming&oldid=1174274696