Links:
Web Application themed around music where you can:
- Browse artists, albums and songs.
- Save songs into a personal playlist
- Browse popular charts from billboards: Top Songs, Top Albums, Top Songs Globally
- Play music!
Additional Research Process:
- Personas
- User Journeys
- Information Architecture Map
- Survey about UX / UI design for album and artist pages
Web application was made using:
- React
- Vite
- HTML, CSS, Javascript with .jsx extension
React Sublibraries:
- React-Router-Dom
- React-Helmet
- React-Cookies
- Redux Toolkit
Third Party Tools and Libraries:
- Firebase DB
- iTunes API
- Giphy API
Had help from:
- Used Box-Shadow to preview box shadow values.
- HTML color picker to pick color for Figma. Was not helpful honestly.
- Google Fonts
Probably not possible because of the custom .env file which requires Giphy Api key and the Firebase Config ¯_(ツ)_/¯
Install:
- git clone this repo
- npm install
- request for the .env file
- put the .env file in the main directory
- npm run dev for development mode
- npm run build > npm run preview for production mode