Hello everyone, I'm sharing this Spotify Clone that I made with React, Redux, and Typescript. If you wanna head straight to the live version you can click on this link: http://spotifyclooone.netlify.app/.
If you wanna check the source code head to my Github by clicking here https://github.com/diogo405/spotify-clone.
About the project
The project is actually very simple, it's just two pages: Home and Album that pull data from a fake API.
Redux & Typescript
I'm not gonna lie if you are new to Typescript your chances to hate it gonna be 100%. Typing almost everything can be very painful for the first time. After a few components, you get used to it and sometimes it saves your ass. My advice is if you wanna taste Typescript start with a Javascript project, not React.
Redux is another thing that's not very pleasant (I've always been a fan of Recoil - simple and easy). They are trying to reduce the boilerplate with the toolkit - and it's better now - but still, there's a lot to be coded to get/set your state (especially with Typescript).
Fake API
The fake API is a set of async functions that return JSON files in a random interval of 0 to 3 secs. While the data is not ready, I'm using some skeletons as placeholders so the layout doesn't jump too much.
Conclusion
Experimenting with React and Typescript is very interesting as you learn a new way to develop with Javascript and familiarise yourself with a technology that I believe is gonna stay.
Top comments (18)
Really liked it!
Thanks ✌️
You are telling true i like it bro
Keep it up.. 🤙
Looks awesome, thanks for sharing!
Please deploy the application on any of the cloud provider and share the live link.
You've missed the first paragraph of the article.
Yes, Thanks
Is there any API for playing songs?
Spotify provides a way to play songs using their SDK, check here:
developer.spotify.com/documentatio...
Thank you.
Nice Job Brother!
Thanks 👍🏽
Why redux and not Context hook?
Hey :) Could've been Context. Just wanna try TS with Redux like: "bring all the pain together" 😁
Some song are not playable
It doesn't play anything hehe. It's just placeholders 😁
Just checked it out. Looks clean. Ofcourse you know it takes a lot more to get it working for real. Like what you've done is nice but its just 1% of the effort 😂😂😂. I'm sure you understand.
Maybe 0.5% 😁 It's just to give an idea about developing with React, Redux and TS.