Demo URL: https://music.icruso.ro

Digital Music Library

Welcome to the Digital Music Library! This application is designed as part of an assignment for the Grad/Junior Full Stack Engineer (Innovation Team) position. The primary goal of this project is to visualize artists and their albums, allowing users to open albums to view a description and a list of songs. Additionally, the app features a search functionality with an autocomplete component to provide suggestions as users type in the search box.

What I Used

• Next.js - A React framework for server-side rendering and static site generation.
• Supabase - An open-source Firebase alternative for authentication, database, and storage.
• React - A JavaScript library for building user interfaces.
• TypeScript - A typed superset of JavaScript that compiles to plain JavaScript.
• SCSS - A CSS preprocessor that adds power and elegance to the basic language.
• Framer Motion - A library for animations and gestures in React.

Features

• List all artists and their albums
• List all the albums
• View detailed information about each album, including a list of songs
• A playlist section where you can create your own playlist
• Search functionality with autocomplete
• User authentication
• Responsive design

Guidelines Followed

The project follows the given guidelines, ensuring a well-structured and maintainable codebase. It includes all required functionalities and considers related security aspects for the search feature.

Getting Started

Follow these instructions to get a copy of the project up and running on your local machine for development and testing purposes.

Prerequisites

Ensure you have the following installed on your local machine:

• Node.js
• npm
• Git

Installation

1. Clone the repository:

   git clone https://github.com/ioancruso/musicapp.git

   cd musicapp

2. Install the dependencies:

   npm install

3. Set up Supabase:

   • Create a .env.local file in the root of your project and add the following:

     SUPABASE_URL=https://horohbpvdxoasuwqopsl.supabase.co
     SUPABASE_SERVICE=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Imhvcm9oYnB2ZHhvYXN1d3FvcHNsIiwicm9sZSI6InNlcnZpY2Vfcm9sZSIsImlhdCI6MTcyMDMwMzAzNCwiZXhwIjoyMDM1ODc5MDM0fQ.f5lPXc-zIXs8dEABmewm0XDSrSQs95HVBLLVZH59Ylw
     

4. Run the application:

   npm run dev

5. Access the application:

   Open your browser and navigate to http://localhost:3000/ to see the app in action.

Contact

If you have any questions, feel free to reach out to me at [email protected].

---

Thank you for checking out the Digital Music Library! If you have any questions or feedback, feel free to open an issue or contact the repository owner.