Herramienta de visualización de datos

Abstract

El proyecto se centra en ofrecer una plataforma interactiva para visualizar y explorar estos datos de manera intuitiva y personalizada. El objetivo de este trabajo ha sido crear una aplicación web utilizando React.js y Recharts con el objetivo de visualizar datos de Women@INF en gráficas dinámicas. Women@INF es una fuente de datos que proporciona información sobre diversas iniciativas y proyectos liderados por mujeres. El desarrollo de esta aplicación web es fundamental debido a la necesidad de tener una plataforma dedicada para visualizar y analizar sus datos de manera interactiva en Women@INF. La inexistencia de una herramienta específica dificulta el acceso y el aprovechamiento óptimo de la información disponible. Esta aplicación contribuye a la visibilización de las iniciativas lideradas por mujeres, promueve la igualdad de género y fomenta la colaboración entre comunidades autónomas. Al ofrecer una herramienta interactiva y accesible para la visualización y el análisis de datos, se impulsa el conocimiento y se generan oportunidades para empoderar a las mujeres y promover el cambio social hacia una sociedad más equitativa. El principal objetivo de este proyecto es proporcionar a los usuarios la capacidad de seleccionar y visualizar los datos de Women@INF en diferentes tipos de gráficas utilizando React.js y Recharts. Esto les permite analizar y comprender mejor la información, identificar patrones y tendencias, y obtener conocimientos valiosos sobre las iniciativas lideradas por mujeres. Para lograr este objetivo, se utilizó React.js como el framework principal para el desarrollo de la interfaz de usuario de la página web. Con la ayuda de Recharts, una biblioteca de gráficos basada en React, se implementó la funcionalidad de representación gráfica de los datos. Recharts proporciona una amplia gama de componentes de gráficos altamente personalizables y fáciles de usar, lo que me ha permitido crear visualizaciones interactivas y atractivas para los usuarios. Además del uso de React.js y Recharts, también se usó Express.js para el backend y MongoDB Atlas como base de datos. Se implementó un sistema de inicio de sesión y registro de usuarios para garantizar la seguridad y la personalización de la experiencia. Asimismo, se ha desarrollado una interfaz de administrador que permite gestionar las iniciativas recibidas validándolas, actualizándolas o eliminándolas según sea necesario. Las principales contribuciones de este trabajo incluyen: • Una página web funcional desarrollada con React.js que permite a los usuarios seleccionar y visualizar datos de Women@INF en gráficas dinámicas. • El uso de Recharts para implementar visualizaciones de datos interactivas y altamente personalizables, lo que facilita la exploración y el análisis de la información. • Un sistema de administración que permite a los administradores gestionar las iniciativas recibidas, asegurando su validez y actualización además de administrar los datos disponibles para su representación gráfica. • La posibilidad de que los usuarios publiquen sus propias iniciativas en el mapa y filtren las existentes según su estado y ubicación geográfica.

The project focuses on providing an interactive platform for visualizing and exploring these data in an intuitive and personalized manner. The aim of this work has been to create a web application using React.js and Recharts with the purpose of visualizing Women@INF data in dynamic charts. Women@INF is a data source that provides information about various initiatives and projects led by women. The development of this web application is crucial due to the need for a dedicated platform to visualize and analyze their data interactively in Women@INF. The lack of a specific tool hinders access to and optimal utilization of the available information. This application contributes to the visibility of initiatives led by women, promotes gender equality, and fosters collaboration among autonomous communities. By offering an interactive and accessible tool for data visualization and analysis, it drives knowledge and generates opportunities to empower women and promote social change towards a more equitable society. The main objective of this project is to provide users with the ability to select and visualize Women@INF data in different types of charts using React.js and Recharts. This allows them to analyze and better understand the information, identify patterns and trends, and gain valuable insights into initiatives led by women. To achieve this goal, React.js was used as the main framework for developing the web page's user interface. With the help of Recharts, a React-based charting library, the functionality of graphical representation of data was implemented. Recharts provides a wide range of highly customizable and easy-to-use chart components, enabling me to create interactive and visually appealing visualizations for users. In addition to using React.js and Recharts, Express.js was also used for the backend, and MongoDB Atlas was used as the database. A user login and registration system was implemented to ensure security and customization of the experience. Furthermore, an administrator interface was developed, allowing administrators to manage received initiatives by validating, updating, or deleting them as needed. The main contributions of this work include: • A functional web page developed with React.js that allows users to select and visualize Women@INF data in dynamic charts. • The use of Recharts to implement interactive and highly customizable data visualizations, facilitating exploration and analysis of the information. An administration system that enables administrators to manage received initiatives, ensuring their validity and updates, as well as managing the data available for graphical representation. • The ability for users to publish their own initiatives on the map and filter existing ones based on their status and geographical location.