Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/denoni/SpotifyClone
An iOS app that visually clones Spotify's app and consumes the official Spotify's Web API to show(and play) songs, podcasts, artists and more.
https://github.com/denoni/SpotifyClone
ios spotify spotifyapi swift swiftui
Last synced: 2 months ago
JSON representation
An iOS app that visually clones Spotify's app and consumes the official Spotify's Web API to show(and play) songs, podcasts, artists and more.
- Host: GitHub
- URL: https://github.com/denoni/SpotifyClone
- Owner: denoni
- License: mit
- Created: 2021-08-30T16:44:40.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2023-09-04T21:39:41.000Z (over 1 year ago)
- Last Synced: 2024-08-03T17:15:45.637Z (6 months ago)
- Topics: ios, spotify, spotifyapi, swift, swiftui
- Language: Swift
- Homepage:
- Size: 14.5 MB
- Stars: 230
- Watchers: 2
- Forks: 46
- Open Issues: 7
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- fucking-open-source-ios-apps - SpotifyClone
README
# SpotifyClone
An iOS app that **visually clones Spotify's app** and **consumes the official Spotify's Web API** to show(and play) songs, podcasts, artists and more.
The app can play a **30-second** preview of a song, otherwise, to play the full song it would be necessary to have a physical device and the real Spotify app installed(requirements of the Spotify iOS SDK).
I've built the project by myself to learn more about iOS development, and to consolidate already learnt concepts by putting them into practice. By no means the project is perfect, so feel free to open issues or make pull requests with your own new features.
I hope you enjoy the app. Feel free to hit me up!
*-Gabriel*
| Home Screen | Search Screen | Track Details Screen | Playlist Details Screen |
|:---------------:|:---------------:|:---------------:|:---------------:|
|  |  |  | 
| Artist Details Screen | Podcast Details Screen | Album Details Screen | Active Searching Screen |
 |  |  | 
# How to set up (>5 min)
1. Fork this project and `git clone ...`
2. Create/login with your Spotify Account in the [Spotify for Developers](https://developer.spotify.com) website.
3. Go to [dashboard](https://developer.spotify.com/dashboard/applications) and select '**Create an app**'.
4. Give the name and description that you want and in the dashboard select the app that you've just created.
5. Go to your local clone of the project in your machine and open '**YourSensitiveData.swift**' (./SpotifyClone/SpotifyCloneProject/YourSensitiveData).
6. Back in your application page of the dashboard, copy the '**Client ID**' and '**Client Secret**' and paste them in '**YourSensitiveData.swift**'.
7. Again in the dashboard select '**Users and access**' an then click in '**Add new user**'*(if you try to log-in into an account in the app without adding it here, your app will crash with error 403 because Spotify's API doesn't allow that)*.
8. In the dashboard select 'EDIT SETTINGS', in the field `redirect_uri` paste `https://www.github.com` (can be any website, but needs to match the `redirect_uri` set in `AuthViewModel.swift`, that by default was set to `https://www.github.com`)
9. **Great! Now you just need to run the app!**
If you have any problem, feel free to contact me on [github](https://github.com/gabrieldenoni)
## Concepts & Technologies Used
- Swift
- Consuming a REST API
- Caching
- AVFoundation to play and control audio
- Combine *(minor use)*
- SwiftUI
- XCode Instruments
- Memory Management and Cache Cleaning
- Grand Central Dispatch
- Dependency Injection
- CocoaPods
**External Dependencies:**
- Alamofire
- Introspect *(really small use)*
- SwiftLint
## Turn on the video volume
| | | | |
| :-: | :-: | :-: | :- |
| | |
*Stuttering is due to simulator lag and shouldn't happen on real device.*
## Code Overview
### ViewModels
#### Main
- Navigation
- Source of the Spotify's Authentication Key to the subviewmodels
#### Auth
- *`Coordinator`*: Controls the WebView responses
- Contacts Service(`/APIAuthentication`) to get the Authentication Key
- Controls the state of AuthScreen
#### Home
- Contacts Service(`/HomePageAPICalls`) to get media(tracks, podcasts, playlists, albums, artists and episodes) data from the API
- Controls HomeSubpages(playlistDetail, trackDetail, etc…)
- Controls the state of HomeScreen
#### Search
- *`ActiveSearchViewModel`*: Contacts Service(`/SearchPageAPICalls`) to get response data(based on what the user searched) from the API ¹
- Contacts Service(`/SearchPageAPICalls`) to get media data from API ²
- Controls SearchSubpages(activeSearching, playlistDetail, trackDetail, etc…)
- Controls the state of DetailScreen
#### Details
- Contacts Service(`/MediaDetailsPageAPICalls`) to get the detailed data, for a specific item(the item that was clicked), from the API
- Controls the state of DetailScreen
¹ The viewmodel for when the user is actively searching for an item.
² The viewmodel for when the user just opened the SearchScreen, it's similar to a discover screen.
## Things to do/improve
- [ ] Use protocols to reduce code duplication.
- [ ] Add more animations(like, follow, navigation, etc).
- [ ] Play playlists(one song after another).
- [ ] Use navigation link for navigation.
- [ ] Save that the user is already logged.
- [ ] Unit testing.
- [ ] Solve animation hitches when scrolling in the playlist tracks.
- [ ] Better project architecture.
- [ ] Make the currently playing track bottom bar work.
- [ ] Make the three dots work to open more options.
