Instagram, Snapchat, Twitter, Facebook, Twitch, Linkedin, etc. Las redes sociales han invadido nuestras vidas. Las amamos u odiamos, y muchos no podemos vivir sin ellas. Hay redes sociales de todo tipo y para todo tipo de intereses.
MusiClub es una red social creada para conectar gente a través de su gusto por la música.
Es una Single-page Application (SPA) que cuenta con una pantalla de inicio que te da la opción de registrarte o iniciar sesión, en ambas opciones puedes ligar tu cuenta de google para acceder. Una vez iniciada la sesión te encontrarás el muro de las publicaciones donde aparecerá el email del usuario para identificarse en la parte superior de la página, encontraras un contenedor donde puedes escribir un post y debajo podrás ver las diferentes publicaciones creadas con respectivo correo de su autor para identificarlo. Podrás dar y quitar like a las publicaciones y también podrás editar y eliminar tus publicaciones.
- Desarrollar una SPA con temática de red social.
- Aplicar los conceptos de responsividad en el desarrollo de las vistas.
- Implementar un router para la navegación entre las diferentes vistas de la aplicación.
- Emplear un servicio externo para la persistencia de datos de la aplicación (Firebase).
- Firebase Auth
- Firestore
Se utilizó Vite para empaquetar los módulos y arrancar
el servidor de desarrollo, el cual provee archivos utilizando
la estrategia Hot Module Replacement, esto significa que al hacer cambios en los archivos que estén siendo
servidos, el navegador automáticamente se actualizará sin tener que refrescar
y volver a cargar todo el sitio.
- Login con Firebase:
- Creación de cuenta de acceso y autenticación con cuenta de correo y contraseña, y también con una cuenta de Google.
- Validaciones:
- Solamente se permite el acceso a usuarios con cuentas válidas.
- La cuenta de usuario debe ser un correo electrónico válido.
- Lo que se escriba en el campo (input) de contraseña es secreto.
- Comportamiento:
- Si hay errores, se mostra mensajes descriptivos del error
- Comportamiento:
- Publicar un post.
- Dar y quitar like a una publicación. Máximo uno por usuario.
- Llevar un conteo de los likes.
- Eliminar un post específico.
- Pedir confirmación antes de eliminar un post.
- Al dar click para editar un post, se permite editar el texto y luego guardar los cambios.
- Al guardar los cambios cambia de vuelta a un texto normal pero con la información editada.
- Al recargar la página se pueden ver los textos editados.
- Separar la manipulación del DOM de la lógica (Separación de responsabilidades).
- Contar con múltiples vistas.(SPA).
- Alterar y persistir datos. Los datos que agregues o modifiques persisten a lo largo de la aplicación.
- Se realizó una encuesta mediate un formulario de google para obtener la opinion de posibles usuarios.
- Se realizaron prototipos de baj y alta fidelidad.
- Se siguieron los lineamientos de Visual design.
