This is a Next.js project bootstrapped with create-next-app.

Getting Started

First, run the development server:

npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.

Full Stack (FE+BE) Developer Test

This test consists of a base task and a focus task. The base task is required for all applicants. Choose one focus task depending on your field of expertise.

Introduction

This task should take around 3 hours to complete. Please do not spend more than 4 hours. It is not expected that you finish all tasks with production-level quality in the time given. Besides output, we want to see your understanding of the tasks, your strengths, approach and philosophy. There will be time in the interview to discuss what you didn't have time to finish and the trade-offs you made.

Usage of AI coding assistants is encouraged, but be mindful that we will ask questions to test your understanding of the code in the interview.

When you are done, please create a PR in the repository including a description of your changes.

If you need to be added with a different account, or run into any trouble, contact dario.sanchez@why.de asap.

Setup Notes

• We recommend using pnpm. If you use a different package manager, delete the pnpm-lock.yaml file first.
  • Quick intro: pnpm i to install dependencies, pnpm dev to run dev mode (with live changes), pnpm build to build and pnpm start to serve the built version locally.

Base Task

Display a grid of music search results (artists, albums, songs) with the name and an image if available. Feel free to also display other information returned in the API response.

Here is a Figma file with a basic mockup: https://www.figma.com/design/QaAUTjri39HPaSUTEoMfWQ/Cat-Grid?node-id=282-53

UI polish is not the focus of the base task. Feel free to use component libraries to speed up development. We like shadcn. Other than that, please use TailwindCSS (it's already set up).

Requirements:

• Fetch data from the iTunes Search API
  • Example request: https://itunes.apple.com/search?media=music&entity=musicArtist,album,song&term={your+search+term}
• A search bar for plaintext search. The search should trigger automatically as the user types (debounced), without requiring a button click.
• A filter row below the search bar with:
  • Entity type filter (artist, album, song) — use the API's entity parameter
  • Client side genre filter
  • Explicit content checkbox (defaults to unchecked/hidden) — use the API's explicit parameter
• The grid must be responsive and work on desktop and mobile screen sizes.
• Fetching should be done via Next.js server actions.

Frontend Focus Task

For the Frontend Developer position. This task focuses on page navigation, animations, and data fetching.

Requirements:

• Implement sorting by name (alphabetical ascending/descending). The user should be able to toggle this via a button.
• Use Motion to add interactivity or animation. Where and how is up to you — be creative and show us what you can do.
• Clicking on a card opens a detail view with more information. For example, clicking an album shows a page with all its songs. Be creative with what makes sense for each entity type.
  • Example request: https://itunes.apple.com/lookup?id={albumId}&entity=song

Bonus

• Instead of navigating to a new page, open the detail view in a modal using Next.js route interception. This is an advanced pattern — don't let it eat into time for the core requirements.

Backend Focus Task

For the Full Stack Developer position. This task focuses on API design and AI integration.

Requirements:

Implement a /api/similar/{artistId} endpoint that takes an artist ID and returns 3 similar artist suggestions generated by an LLM. We recommend using the Vercel AI SDK.

• OpenAI API Key will be provided.

This task is not just about structuring the AI output — we're also interested in your thinking behind the prompt design.

Trigger this endpoint from the frontend. Then, use the iTunes API to fetch information about the suggested artists and display them to the user.