Build and Deploy a Better Spotify 2.0 Clone Music App with React 18! (Tailwind, Redux, RapidAPI)
Master modern web development by building an improved version of Spotify. With a modern homepage, fully-fledged music player, search, lyrics, song exploration features, search, popular music around you, worldwide top charts, and much more, this is the best music application you can currently find on YouTube.
⭐RapidAPI Extension – https://marketplace.visualstudio.com/items?itemName=RapidAPI.vscode-rapidapi-client&utm_source=youtube.com%2FJavaScriptMastery&utm_medium=referral&utm_campaign=DevRel
⭐RapidAPI – https://rapidapi.com/hub?utm_source=youtube.com/JavaScriptMastery&utm_medium=referral&utm_campaign=DevRel
⭐RapidAPI Shazam Core API- https://rapidapi.com/tipsters/api/shazam-core?utm_source=youtube.com/JavaScriptMastery&utm_medium=referral&utm_campaign=DevRel
💻 Build Apps with Professional Mentors – https://resource.jsmastery.pro/masterclass
✅ JSM Masterclass Experience – https://www.jsmastery.pro/full-stack-web-development-bootcamp
Showcase your dev skills with practical experience and land the coding career of your dreams:
💻 JS Mastery Pro – https://jsmastery.pro/youtube
✅ A unique YOUTUBE discount code is automatically applied!
📚 Materials/References:
Starter Code: https://drive.google.com/file/d/1iTlXIZ4T3BBKjgLMsDpQn-Eux1B3ZyXO/view?usp=sharing
GitHub Code (give it a star ⭐): https://github.com/adrianhajdin/project_music_player
In this course, you’ll learn:
– React functional components and their reusability
– React file and folder structure
– We’ll use Redux Toolkit to manage the state of our application
– You’ll achieve mastery using Tailwind and make the app responsive on all devices
– You’ll learn how to fetch data from unlimited sources using RapidAPI.
💻 Join JSM on Discord – https://discord.gg/n6EdbFJ
🐦 Follow JSM on Twitter – https://twitter.com/jsmasterypro
🖼️ Follow JSM Instagram – https://instagram.com/javascriptmastery
💼 Business Inquiries: contact@jsmastery.pro
👇 Time Stamps
00:00:00 – Intro
00:06:31 – Setup
00:12:38 – Discover Section
00:23:50 – Rapid API Music Fetching
00:39:16 – Loader Component
00:40:50 – Error Component
00:41:50 – Song Card Component
00:59:48 – Play/Pause Functionality
01:05:38 – Sidebar
01:19:00 – Top Play Section
01:28:03 – Top Chart Card
01:30:57 – Top Artist – Swiper Component
01:42:50 – Song Details Page
02:12:53 – Artist Details Page
02:20:50 – Around You, Top Charts & Artists
02:36:31 – Search
2:52:48 – Deployment