ArtistHub

ArtistHub is a web application I created to explore and display information about various artists using the Spotify API. The inspiration for this project came from my passion for music and the desire to create an interactive platform where users can easily discover and learn more about their favorite artists and their discographies.

Project Overview

The main goal of ArtistHub is to provide a user-friendly interface that allows users to search for artists, view detailed information about them, including their albums and tracks, and interact with the content through liking artists and toggling between dark and light modes.

Problem Statement

Before ArtistHub, finding comprehensive information about an artist's discography often required navigating multiple platforms or dealing with cluttered interfaces. My aim was to create a streamlined, visually appealing, and interactive solution to this problem, making it easier for users to access and enjoy music-related information in one place.

Features

• Search for Artists: Users can search for artists and receive real-time suggestions.
• Artist Information: Display detailed information about selected artists, including their albums and tracks.
• Like Feature: Users can like or unlike artists, with a heart icon indicating their preference.
• Toggle Mode: Easily switch between dark mode and light mode.
• Interactive UI: Hover effects, animations, and tooltips enhance user interaction.
• Particle Background: Dynamic particle background effect for an engaging visual experience.

Future Updates

I plan to add the following features to ArtistHub in future updates:

• User Authentication: Allow users to create accounts, save their favorite artists, and sync preferences across devices.
• Enhanced Search: Include more advanced search filters, such as genre, popularity, and release date.
• Playlist Integration: Enable users to create and manage playlists directly within the app.
• Social Sharing: Allow users to share their favorite artists and albums on social media.
• Artist News: Integrate a news feed to provide the latest updates about artists.

Technologies Used

• HTML: Structure of the web pages.
• CSS: Styling the application, including transitions, animations, and responsive design.
• JavaScript: Functionality and interaction of the application.
• Spotify API: Fetching artist, album, and track information.
• particles.js: Dynamic particle background effect.

Installation and Setup

To get a local copy up and running, follow these steps:

1. Clone the repository:

   git clone [email protected]:joheyhargrett/ArtistHub-2.0.git

2. Navigate to the project directory:

   cd ArtistHub-2.0

3. Open the index.html file in your web browser.

How to Use

1. Open the index.html file in your web browser.
2. Use the search bar to look for an artist by name.
3. View detailed information about the artist, including their albums and tracks.
4. Like or unlike artists by clicking the heart icon.
5. Toggle between dark mode and light mode using the toggle button.
6. Enjoy the interactive UI, hover effects, and particle background effect.

Contributing

Contributions are what make the open-source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement".

1. Fork the Project
2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
3. Commit your Changes (git commit -m 'Add some AmazingFeature')
4. Push to the Branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

Contact

Johey Hargrett - [email protected]

Project Link: https://github.com/joheyhargrett/ArtistHub-2.0