đ± Source Code: https://github.com/CodeWithGionatha-Labs/music-player
đŹ Discord: https://discord.gg/mN8WD6M4dR
đ Resources
Expo development build: https://docs.expo.dev/develop/development-builds/create-a-build/
Expo Router: https://docs.expo.dev/router/installation/#prerequisites
React Native Track Player: https://rntp.dev/docs/basics/installation
In this project, we are going to build a native music player application (inspired by Apple Music design) with many core functionalities such as playing, pausing, seeking, and skipping tracks, along with managing playlists and queues of songs and even a search functionality. We will use React Native, Expo, Typescript, Zustand, and many more technologies.
Timestamps
00:00:00 Intro
00:04:07 Project setup (Expo App)
00:25:36 App navigation (Expo router)
00:43:56 App style (dark mode)
00:57:54 Songs Screen
01:38:16 Adding the Track Player (react-native-track-player)
02:01:10 Floating Player
02:27:57 Adding animated icons
02:38:31 Animated song title
02:52:15 Track Player Screen
03:57:46 Favorites Screen
04:04:38 Adding Zustand (state manager)
04:17:15 Queue management (list of songs1)
04:52:48 Artists Screen
05:21:33 Playlist Screen
05:54:30 Shortcuts (add to playlist, add to favorites)
06:18:27 Track player favorites button
06:27:33 Add to playlist feature
06:42:38 Player remote controls (lock screen, control center)
06:51:22 Outro