React Bootcamp 2017 - Spotify Client
Set up
- Hacerse un fork.
- Clonarselo.
- En la consola:
- Ir a la carpeta del proyecto nuevo:
cd React-Final-Project
. - Ejecutar el comando
npm install
para instalar las dependencias. - Ejecutar el comando
npm start
para iniciar la aplicación. - Enjoy!
- Ir a la carpeta del proyecto nuevo:
Introducción
Como usuario, quiero poder buscar un artista en spotify y ver sus álbumes y canciones. Además, quiero poder marcar mis canciones favoritas. (opcional)
Objetivos
-
Crear una aplicación web que pueda ser accedida desde un teléfono y desde una máquina desktop.
-
Obtener los resultados que coincidan con el texto ingresado, usando la API de búsqueda de spotify.
-
Poder marcar mis canciones favoritas y que al refrescar el navegador, sigan apareciendo como favoritas. (opcional)
Requisitos Funcionales
Necesarios
-
Como usuario, quiero poder buscar un artista en un formulario y ver el resultado de esa búsqueda.
-
Como usuario, quiero poder seleccionar entre los artistas que aparecieron en el resultado y luego ver un listado de sus álbumes.
-
Como usuario, quiero poder clickear en uno de sus álbumes y ver el nombre del álbum, una foto del álbum y el listado de canciones.
-
Como usuario quiero poder realizar una nueva búsqueda desde cualquier punto de mi aplicación.
-
Como usuario debo poder regresar a la página principal de mi aplicación en cualquier punto del flow.
-
Como usuario quiero poder escuchar un fragmento de cada tema.
Opcionales
-
Como usuario quiero poder ordenar el listado de temas por duración de los mismos.
-
Como usuario, quiero poder refrescar la página con los resultados de mi búsqueda o el listado de álbumes o el listado de canciones, y quiero que se mantenga el estado.
-
Como usuario, quiero poder marcar una canción como favorita y al refrescar el navegador, quiero seguir viendo cómo favoritas las mismas canciones.
-
Las canciones marcadas como favoritas deben aparecer en una sección en la página principal.
Spotify API
-
Base url: https://api.spotify.com/v1/
-
Lista de endpoints: https://developer.spotify.com/web-api/endpoint-reference/
Ejemplo
Traer los datos de un álbum en base al id del album:
GET https://api.spotify.com/v1/albums/10GYbpGRnCbUd5WsDzqHAv