Se realiza el frontend con Ract, se utilizo webpack y las siguientes librerías y dependencias listadas a continuación:
- Material-ui/core: se utilizó para realizar la barra de progreso del formulario de inscripción, los botones
- Chart.js: se utilizó para descargar la librería de gráficas
- Chartjs-plugin-datalabels: se utilizó para mostrar las etiquetas en los datos de los gráficos.
- Eslint: Análisis de código estático para identificar patrones problemáticos encontrados en el código JavaScript.
- Less-loader: Se utilizó para compilar la librería de react-big al no ser compatible con webpack
- Moment: Nos permitió mostrar fechas y horas de una forma mas amigable al usuario.
- React-big-calendar: Se utilizó para renderizar un componente de calendario de eventos para que el aspirante agende su cita de entrevista.
- React-chartjs-2: se utilizó para representar gráficamente los datos en el dashboard
- React-csv: Se utilizó para tener la posibilidad de exportar y descargar las tablas a formato CSV.
- React-datetime-picker: Selector de fechas para agendar eventos en el calendario.
- React-dom: se utilizó para renderizar un componente en el DOM.
- React-html-table-to-excel: Se utilizó para tener la posibilidad de exportar y descargar las tablas a formato excel.
- React-modal: Esta librería se utilizó para crear tarjetas modales específicamente en el calendario a la hora de realizar el agendamiento de una entrevista.
- React-router-dom: se utilizó para realizar las rutas de navegación de la aplicación.
- Style-loader: Cargadores de paquetes web que toma los archivos CSS y los inserta en la página para que los estilos estén activos en la página.
- Sweetalert2: se utilizó para realizar alertas como confirmación de una acción realizada por el usuario
- Eslint: Es sencillamente una herramienta de linting para JavaScript y JSX cuya función es la de revisar nuestro código tratando de encontrar errores que podrían provocar problemas de compilación o bien futuros bugs en nuestro desarrollo
- ** Babel:** Es un compilador de JavaScript gratuito y de código abierto que se utiliza principalmente para convertir el código ECMAScript 2015+ en una versión de JavaScript compatible con versiones anteriores que pueden ejecutar los motores JavaScript más antiguos
- React-dom: Proporciona métodos específicos del DOM que pueden ser utilizados en el nivel más alto de tu aplicación como una vía de escape del modelo de React si así lo necesitas. La mayoría de tus componentes no deberían necesitar usar este módulo
- Webpack: Es un paquete de módulos JavaScript de código abierto. Es un paquete de módulos principalmente para JavaScript, pero puede transformar activos front-end como HTML, CSS e imágenes si se incluyen los complementos correspondientes
- Dasboard Admin (Muestra toda la información del avance de los candidatos):
- Calendario (Permite a los usuarios agendar la fecha en la cuál serán entrevistados):