Screenshot of Mustalk

Mustalk

Un lugar donde puedes compartir tus gustos musicales y contar sobre eso con más detalles

Stack: JavaScript, SASS, NextJS, Redux, Supabase

Revisa el código Demo en linea

Creado el:

ReactJS, Personal


Este fue un proyecto personal que sigue funcionando. La idea llego a mi porque estaba reflexionando mucho sobre las redes sociales y quise saber como era crear una. Este fue un proyecto muy emocionante y entretenido.

Tecnologías utilizadas

Las tecnologías que use en este proyecto y las razones por las que las escogí:

  • SASS: Implemente los estilos de este proyecto con esta tecnología con la metodología BEMIT, porque los estaba aprendiendo.
  • NextJS: Así como el anterior, estaba aprendiendo este framework de ReactJS.
  • Redux: Lo utilice para el manejo del estado general entre los componentes.
  • Supabase: Lo utilice porque estaba buscando una alternativa a firebase, y me encanto. Supabase me ayudo a manejar el proceso de autenticación con su API.

Funcionalidades

Las principales funcionalidad de este proyecto son:

  • Log in con un enlace mágico: Olvídate de crear una nueva contraseña, solo ingresa tu email y recibirás un correo con un link para ingresar.
  • Publica una canción que te guste: Comparte con el mundo que es lo que estas escuchando justo ahora y que es lo que piensas sobre esa canción.
  • Dale me gusta, guarda en marcadores y comparte la publicación de otro usuario
  • Edit your profile: Añade una foto de perfil, edita tu biografía y añande un link a tu página web.

Puntos débiles

  • El proceso de verificación de nuevos usuarios esta pobremente implementado y llego mucho spam cuando compartí este proyecto en un grupo de facebook. Lo mejoraré en el futuro.
  • Los Me gusta y marcadores se ven bastante fácil cuando uno solos los usa, pero en la parte técnica son más complejos.

Lo que aprendí de este proyecto

Las cosas más importantes que aprendí de este proyecto son:

  • Cómo los Me gusta y marcadores funcionan internamente.
  • Cómo funciona el proceso de verificación de correos electrónicos.
  • Cómo implementar mis estilos con SASS y la metodología BEMIT con una estructura especifica de archivos y carpetas.
  • Como implementar reducers y dispatchers en Redux.