This project was developed during a 5-day immersion event organized by Alura. It involved recreating the landing page of Spotify, providing an oportunity for learning and practice in various Front-end technologies.
I have taken the initiative to customize according to my favorite artists and playlists 💜
- HTML: Structured the web content.
- CSS: Styled the web page.
- JavaScript: Added interactivity and allowed fetching information from the API.
- React.js: Built the user interface with reusable components and allows using JSX to write HTML inside React.
- Node.js: Provided the environment to work with JS and to developed a local mock API from a JSON file.
- Json: Structure the fake database.
✔ Recreated the Spotify landing page.
✔ Added responsiveness to the project using Media Queries.
✔ Developed a mock API for local testing.
After the Alura Immersion, I've enhanced the project with new functionalities.
The data for the fake API, previously kept localy, has been migrated to a JSON Server hosted on Vercel. The application now communicates with two different endpoints of the Spotify fake API to fetch the required data for artists and playlists.
The data is fetched using hooks in React, simplifying the reuse of stateful logic between components without altering the component hierarchy.
One of the primary goals for this project is to replace the current fake API with the official Spotify API. This will allow the application to interact with real Spotify data, enhancing the overall functionality and user experience.
Stay tuned for updates on this project as I continue to work towards this goal!
Note
Please note that this project is a work in progress and may require further development to fully replicate the functionality of the original Spotify landing page.