Skip to content

codeurjc-students/2024-snap-study

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

92 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

SnapStudy

Alumno: Javier Rodríguez Salas

Tutor: Micael Gallego

Funcionalidades de la aplicación

Funcionalidades básicas

  • Registrarse: un usuario anónimo debe poder crear una cuenta.
  • Iniciar sesión: un usuario debe poder acceder a su cuenta introduciendo sus credenciales.
  • Buscar un grado y asignatura: un usuario registrado debe poder ver los grados universitarios disponibles, así como las asignaturas de cada grado.
  • Seleccionar asignaturas de las que se quieren obtener los apuntes: un usuario registrado debe poder seleccionar las asignaturas de las que desea obtener apuntes.
  • Borrar grado universitario: un usuario con rol de administrador debe poder borrar un grado universitario.
  • Borrar asignatura: un administrador debe poder borrar asignaturas de un grado universitario.
  • Dar de alta un grado: un usuario con rol de administrador debe poder dar de alta un grado universitario.
  • Dar de alta una asignatura: un usuario administrador debe poder crear una nueva asignatura en un grado universitario.
  • Editar perfil: un usuario registrado debe poder editar la información de su perfil.
  • Subir imagen de perfil: un usuario registrado debe poder subir una imagen para editar su imagen de perfil.
  • Editar grado universitario: un usuario administrador debe poder editar la información de un grado universitario.
  • Subir un documento: un usuario administrador debe poder subir un nuevo documento a una asignatura.
  • Descargar documento: un usuario registrado debe poder descargar un documento.

Funcionalidades avanzadas

  • Volcar los apuntes en la carpeta de Drive estructurados en subcarpetas: un usuario registrado debe tener la opción para volcar los documentos de una asignatura seleccionada en una carpeta de Google Drive.
  • Almacenar documentos en AWS S3: los documentos disponibles deben almacenarse en el servicio de AWS S3.
  • Búsqueda avanzadda: un usuario debe poder buscar un documento mediante su nombre o su contenido.
  • Resúmenes de documentos: al subir un documento a la plataforma se generará un resumen que estará disponible para el usuario.

Aspectos principales de la aplicación web

Entidades

  • Usuarios
  • Grados universitarios
  • Asignaturas
  • Apuntes de asignatura

Relación: un grado tiene múltiples asignaturas y una asignatura tiene apuntes. Los usuarios pueden obtener estos apuntes de asignaturas.

Permisos de usuarios (qué puede hacer cada uno)

  • Usuario anónimo (no registrado): puede visualizar el contenido informativo de la web como, información de contacto, listado de grados universitarios y, además, puede registrarse como nuevo usuario.
  • Usuario registrado: este tipo de usuario debe acceder al inicio de sesión con sus credenciales correspondientes para tener acceso a la principal funcionalidad de la aplicación web: puede obtener apuntes de las asignaturas que desee. Además, puede modificar sus datos personales como nombre de usuario, foto de perfil y cambio de contraseña.
  • Usuario administrador: Tiene control total sobre la información de la web. Puede añadir nuevos grados universitarios, añadir nuevas asignaturas a grados ya existentes y subir nuevos apuntes a una asignatura.

Imágenes

Los usuarios registrados podrán subir imágenes para modificar su foto de perfil.

Gráficos

En el panel de administrador habrá un gráfico de barras donde se mostrarán los grados universitarios a los que más recurren los usuarios.

Tecnología complementaria

Uso de la API de Google Drive para realizar el volcado de documentos pedidos por el usuario. Se creará una carpeta donde se añadirán subcarpetas, una por cada grado y dentro de cada grado, una subcarpeta por cada asignatura solicitada. Almacenamiento de documentos en AWS Simple Storage Service (S3). Uso de un indexador (Lucene/ElasticSearch) para realizar búsquedas avanzadas. Integración de una IA para realizar resúmenes del contenido de un documento.

Algoritmo o consulta avanzada

Buscador avanzado que permita buscar documentos mediante su nombre y contenido.

Wireframe de pantallas y navegación

Wireframe

Fase 1

Pantallas

Página principal

Una landing page donde puedes usar un buscador, ver los grados disponibles o acceder a información de SnapStudy.

Landing Page

Inicio de sesión

En esta pantalla podrás acceder a tu cuenta.

Login

Registro

En esta pantalla podrás crear una nueva cuenta.

Registro

About

En esta página encontrarás información sobre la funcionalidad y objetivo de SnapStudy, además de conocer la tecnología con la que trabaja.

Información de SnapStudy

Explore

Representa el mismo listado de grados incluido en la página principal.

Listado de grados

Lista de asignaturas

Muestra un listado de las asignaturas de un grado.

Listado de asignaturas

Listado de documentos

Representa el listado de recursos disponibles para una asignatura.

Listado de documentos

Búsqueda

Muestra todas las coincidencias encontradas a la hora de realizar una búsqueda.

Resultados de búsqueda

Panel principal de administrador

Listado de grados con opciones de borrado y creación de nuevos.

Panel principal de administrador

Listado de asignaturas (administrador)

Listado de asignaturas con opciones de borrado y creación de nuevas.

Listado de asignaturas - panel administrador

Listado de documentos (administrador)

Listado de recursos disponibles para una asignatura con opciones para añadir nuevos, previsualizar o eliminar existentes.

Listado de documentos - panel administrador

Añadir recurso (administrador)

Popup que permite subir un nuevo recurso a una asignatura.

Añadir recurso

Añadir asignatura (administrador)

Panel que permite al administrador crear una nueva asignatura.

Añadir asignatura

Añadir grado (administrador)

Panel que permite al administrador crear un nuevo grado.

Añadir grado

Listado de documentos (usuario registrado)

Listado de documentos de una asignatura, donde se permite descargar y previsualizar estos.

Listado de documentos usuario registrado

Perfil (usuario registrado)

Información principal del usuario, donde puedes modificar esta información o añadir una foto de perfil.

Perfil

Añadir imagen de perfil (usuario registrado)

Popup que permite subir una nueva imagen de perfil.

Subir imagen de perfil

Diagrama de navegación

Diagrama de navegación

Diagrama de entidades de base de datos

Diagrama de entidades de base de datos

Diagrama de clases backend

Diagrama de clases backend

Diagrama de clases frontend SPA

Diagrama de clases frontend SPA

Construcción de la imagen Docker

Para construir la imagen docker de SnapStudy debemos seguir los siguientes pasos:

  1. Clonar el repositorio
https://github.com/codeurjc-students/2024-snap-study.git
  1. Navegar hasta el directorio "docker" dentro del proyecto
cd 2024-snap-study/docker
  1. Instalar docker en nuestro sistema here

  2. Busca docker y ejecútalo

  3. Haz login en tu cuenta de Docker

docker login
  1. Para generar la imagen Docker, ejecuta
./create_image.sh

Este script contiene los siguientes comandos

# Establece el contexto de compilación para el padre y compila usando Dockerfile desde el directorio de Docker
docker build -t jrodriguezs2020/snapstudy -f docker/Dockerfile .
# Sube la imagen a DockerHub
docker push jrodriguezs2020/snapstudy
# Ejecuta la imagen usando docker-compose desde el directorio de Docker
docker-compose up

Instrucciones de ejecución de la aplicación dockerizada

Para ejecutar la imagen Docker de SnapStudy debemos seguir los siguientes pasos:

  1. Clonar el repositorio
https://github.com/codeurjc-students/2024-snap-study.git
  1. Navegar hasta el directorio "docker" dentro del proyecto
cd 2024-snap-study/docker
  1. Instalar docker en nuestro sistema here

  2. Busca docker y ejecútalo

  3. Ejecuta el comando

docker-compose up
  1. Podemos elegir entre usar el servicio de AWS S3 para el almacenamiento de los archivos o MinIO en local. Para usar AWS S3 es necesario tener una cuenta AWS y configurar un bucket de S3. Únicamente necesitamos sustituir los campos change-me en el archivo docker-compose.yml, en este caso AWS_S3_ACCESS_KEY_ID y AWS_S3_SECRET_ACCESS_KEY que se corresponden con el Access Key y Secrect Key del bucket S3.

Si deseamos usar MinIO, y no vamos a ejecutar la aplicación web con docker-compose, debemos tener instalado en nuestro sistema este recurso instalación. Una vez instalado abrimos una consola de comandos y debemos navegar hasta la ruta donde se encuentre el archivo minio.exe y, una vez en la ruta, debemos ejecutar el siguiente comando

minio.exe server D:/minio --console-address ":9001"

De esta forma tendremos un sistema de almacenamiento en local que simula a AWS S3.

Ten en cuenta que si decides usar MinIO con docker-compose debes ajustar las rutas a la IP del contenedor docker que se cree, además de iniciar MinIO con docker, aquí te dejo un ejemplo

version: "3.9"
services:
  web:  
    image: jrodriguezs2020/snapstudy
    ports:
      - "8443:8443"
    environment:
      - SPRING_DATASOURCE_URL=jdbc:mysql://db:3306/snapstudy
      - SPRING_DATASOURCE_USERNAME=root
      - SPRING_DATASOURCE_PASSWORD=DAWWebapp09+
      - JWT_SECRET=snapstudy
      - AWS_S3_ACCESS_KEY_ID=change_me
      - AWS_S3_SECRET_ACCESS_KEY=change_me
    depends_on:
      - db
      - minio
    restart: on-failure

  db:
    image: mysql:8.0.22
    restart: always
    ports:
      - "3307:3306"
    environment:
      - MYSQL_DATABASE=snapstudy
      - MYSQL_ROOT_PASSWORD=DAWWebapp09+
    volumes:
      - mysql:/var/lib/mysql

  minio:
    image: minio/minio:latest
    ports:
      - "9000:9000"
    environment:
      - MINIO_ROOT_USER=minioadmin
      - MINIO_ROOT_PASSWORD=minioadmin
    command: server /data
    volumes:
      - minio_data:/data
    restart: always

volumes:
  mysql:
  minio_data:

Podemos conocer la IP de nuestro contenedor docker así

docker inspect -f '{{range .NetworkSettings.Networks}}{{.IPAddress}}{{end}}' docker-minio-1
  1. Una vez finalizado el paso anterior, abre un navegador y busca https://localhost:8443