{"id":18789498,"url":"https://github.com/louiejancevski/spotifyclone","last_synced_at":"2026-05-03T15:33:58.932Z","repository":{"id":252563222,"uuid":"285717127","full_name":"louiejancevski/SpotifyClone","owner":"louiejancevski","description":"🟢 Spotify clone built using React JS and the Spotify Web API. Users are able to see all of their playlists, play songs, control the volume, and also entirely mute the audio. Everything happens dynamically and each user gets displayed their respective information.","archived":false,"fork":false,"pushed_at":"2020-08-29T02:17:26.000Z","size":1848,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-05-21T13:16:43.519Z","etag":null,"topics":["audio","playlists","react","spotify","spotify-account","spotify-api","spotifyclone","volume","web-player"],"latest_commit_sha":null,"homepage":"https://louiejancevski.github.io/SpotifyClone","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/louiejancevski.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2020-08-07T02:23:28.000Z","updated_at":"2020-09-15T06:41:04.000Z","dependencies_parsed_at":"2024-08-10T19:45:50.429Z","dependency_job_id":"79066b45-dde3-4dbd-b083-4b89dd777e36","html_url":"https://github.com/louiejancevski/SpotifyClone","commit_stats":null,"previous_names":["louiejancevski/spotifyclone"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/louiejancevski/SpotifyClone","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/louiejancevski%2FSpotifyClone","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/louiejancevski%2FSpotifyClone/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/louiejancevski%2FSpotifyClone/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/louiejancevski%2FSpotifyClone/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/louiejancevski","download_url":"https://codeload.github.com/louiejancevski/SpotifyClone/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/louiejancevski%2FSpotifyClone/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32575111,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-03T06:36:36.687Z","status":"ssl_error","status_checked_at":"2026-05-03T06:36:09.306Z","response_time":103,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["audio","playlists","react","spotify","spotify-account","spotify-api","spotifyclone","volume","web-player"],"created_at":"2024-11-07T21:07:42.832Z","updated_at":"2026-05-03T15:33:58.887Z","avatar_url":"https://github.com/louiejancevski.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"## 🟢 Spotify Clone \n- Built using ReactJS and the Spotify API\n- User authentication\n- Audio controls\n- Version 3.0\n\n## URL / Live version\nTo use the live demo of this app:\n- [louiejancevski.github.io/SpotifyClone](https://louiejancevski.github.io/SpotifyClone/)\n\n## About this project\nThis project is a ReactJS clone of the Spotify web player.\n\nThe main idea is to have users be authenticated through Spotify, and then display them some basic information about their own account.\n \nUsers are able to: \n- Play or pause a song\n- Skip to the next or previous track\n- Control the volume\n- And also entirely mute the audio\n\n## Taking a look inside\n\nWhen you first go to app, you get presented with a login page in which you are required to login with your Spotify account in order to proceed to see the web player clone. \n\n![Login Page](https://github.com/louiejancevski/SpotifyClone/blob/master/src/Images/spotify-login.png)\n\nAfter clicking the 'Login with Spotify' button, you will be taken to the actual Spotify website where you will be asked to authorize this app to see and do things for you. \n\nThese permissions are to view:\n- Content you have recently played\n- The content you are playing\n- The content you are playing and Spotify Connect devices information\n- Your top artists and content\n\n![Spotify Auth](https://github.com/louiejancevski/SpotifyClone/blob/master/src/Images/spotify-auth.png)\n\nAside from those permissions, the app will also see your name and username, your profile picture, how many followers you have on Spotify and your public playlists.\n\nYou can unauthorized this anytime, by going to your Spotify account settings:\n- [spotify.com/us/account/apps/](https://www.spotify.com/us/account/apps/)\n\nAnd clicking 'Remove Access' from 'SpotifyClone'.\n\nThis app also never saves your information at no point.\n\nNow...\n\nAfter you have logged into Spotify and gave the right access, you will finally be presented with the web player:\n\n![Web Player](https://github.com/louiejancevski/SpotifyClone/blob/master/src/Images/player-demo.png)\n\nIn previous versions, you weren't able to do anything at all, and it served no other purpose than visual.\n\nI've made it more functional and dynamic now.\n\nYou can access any of your playlists and play any of your songs for a max of 30 seconds, change the volume and mute any song, and also skip to the next or previous track. \n\nFor each song that is being played, the `document.title` will also change accordingly.\n\n![Document title](https://github.com/louiejancevski/SpotifyClone/blob/master/src/Images/document-title.png)\n\n**Note:** I added a static version as well for people that just want to take a quick glance at the app.\n\n## Built with:\n- [ReactJS](https://reactjs.org/docs/create-a-new-react-app.html)\n- [Spotify API](https://developer.spotify.com/documentation/web-api/)\n- [Material UI](https://material-ui.com/)\n\n## Available Scripts\n\nIn the project directory, you can run:\n\n### `npm start`\n\nRuns the app in the development mode.\u003cbr /\u003e\nOpen [http://localhost:3000](http://localhost:3000) to view it in the browser.\n\nThe page will reload if you make edits.\u003cbr /\u003e\nYou will also see any lint errors in the console.\n\n### `npm test`\n\nLaunches the test runner in the interactive watch mode.\u003cbr /\u003e\nSee the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.\n\n### `npm run build`\n\nBuilds the app for production to the `build` folder.\u003cbr /\u003e\nIt correctly bundles React in production mode and optimizes the build for the best performance.\n\nThe build is minified and the filenames include the hashes.\u003cbr /\u003e\nYour app is ready to be deployed!\n\nSee the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.\n\n## Learn More\n\nThis project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).\n\nYou can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).\n\nTo learn React, check out the [React documentation](https://reactjs.org/).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flouiejancevski%2Fspotifyclone","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Flouiejancevski%2Fspotifyclone","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flouiejancevski%2Fspotifyclone/lists"}