Creates a functional spotify search front end using entirelly Angular 9. Uses and connect to Spotify Rest API's for search and listing ElGrandeToTo's albums, and a page that shows selected albums details (see screenshots below). It is integrated with Spotify, so preview of albums and song can be played directly in Spotify (Or on the website). It uses routing mechanism in Angular for moving/showing on diferent views. As spotify API requires authentication is is necessary to register the application into Spotify Dev and then get an authorization token which is used in every API calls.
- Home Page
- Playslit
- View in Spotify
- Search for more Albums
- Example
- Clone the repo
$ git clone
- Install dependency
$ npm install- Run the app
$ ng serve --open- Production build
$ ng build- All of the functions in Spotify require you to authenticate your application.
private access_token: string = 'authorization token'Get Spotify catalog information for a single album.
getAlbum(id:string){
let headers = new HttpHeaders().set('Authorization', 'Bearer ' + this.access_token);
this.albumUrl = 'https://api.spotify.com/v1/albums/'+id;
return this.httpClient.get(this.albumUrl, {headers: headers }).pipe(
map(res => res)
);
}Get Artist information.
getArtist(id:string){
let headers = new HttpHeaders().set('Authorization', 'Bearer ' + this.access_token);
this.artistUrl = 'https://api.spotify.com/v1/artists/'+id;
return this.httpClient.get(this.artistUrl, {headers: headers });
}