Chat de simulación de una ventana modal.
Demo de la aplicación: https://vuechat-7d278.web.app/
Para realizar este proyecto se utilizaron las siguientes tecnologías:
- Vue: Framework JavaScript del proyecto.
- Firebase: Almacenamiento de mensajes y de los documentos adjuntos, login con Google y hosting.
- CSS: Animación del modal para adjuntar archivos.
- Tailwind: Apartado estético de la aplicación.
Los primero que podemos observar al cargar a la aplicación en una ventana con los mensajes que se mandaron anteriormente precargados. Para escribir un mensaje tenemos que hacer click en el botón de "Iniciar Sesión". Nos aparecera una ventana emergente que nos permitirá hacer login con nuestra cuenta de Google.
Una vez iniciada la sesión podemos mandar mensajes escribiendolos en el input de "Introduce mensaje..." y luego hacer clikc en "Enviar".
Los mensajes serán almacenados en una base de datos Firestore de Firebase. Que nos permite modificarlos y eliminarlos si deseamos.
La aplicación también nos permite adjuntar archivos, para ello hay que hacer click en el botón "Archivo" y nos aparecerá un modal que nos permitirá subir un archivo y cuando este haya cargado podremos darle a aceptar y aparecerá en el chat con las especificaciones del archivo (nombre, tipo, tamaño y la fecha en la que fue añadido).
Estos archivos se guardarán en el almacenamiento de nuestra aplicación de Firebase.