Demo URL: https://music.icruso.ro
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.
- 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.
- 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
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.
Follow these instructions to get a copy of the project up and running on your local machine for development and testing purposes.
Ensure you have the following installed on your local machine:
- Node.js
- npm
- Git
-
Clone the repository:
git clone https://github.com/ioancruso/musicapp.git
cd musicapp
-
Install the dependencies:
npm install
-
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
-
-
Run the application:
npm run dev
-
Access the application:
Open your browser and navigate to
http://localhost:3000/
to see the app in action.
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.