Opeyemi Agbaje
Resume

Personal Engineering Project / Full-Stack Web

MoodPlaylist

A mood-based music discovery application built with Next.js and C#.

Full-Stack Developer · Personal project

Live deployment

MoodPlaylist is a full-stack music discovery application I developed using Next.js for the frontend and C# Web API for the backend.

The application is designed around a simple idea: making music discovery feel more personal by helping users explore tracks and playlists based on their current mood.

Through this project, I have worked on connecting a responsive frontend experience with backend application logic and external music-related services.

  • Next.js
  • C#
  • C# Web API

At a glance

Engineering focus

  • Frontend Engineering

    Responsive Next.js interfaces and interactive application workflows.

  • Backend Development

    C# Web API services and application logic.

  • Music Discovery

    Mood-based discovery and Spotify-related integration work.

  • Full-Stack Integration

    Communication between the frontend, backend, and external services.

01 / Context

Project overview

I developed MoodPlaylist to explore how a music application could provide a more personalized discovery experience through mood-based interaction.

Rather than making users begin with a specific song, artist, or genre, the application presents mood selection as the starting point for discovering music.

I built the frontend with Next.js and used a C# Web API to support the backend functionality. The project gave me an opportunity to work across the application stack, from interface development and user interactions to API integration and data-driven features.

Project objectives

My goal was to develop a full-stack music application that combines a simple user experience with maintainable frontend and backend responsibilities. The main objectives were to:

  • Design an intuitive interface for mood-based music discovery.
  • Support a smooth journey from mood selection to music suggestions.
  • Connect the Next.js frontend to a C# Web API.
  • Integrate the application's music-discovery functionality.
  • Make music selection and playlist interactions easy to understand.
  • Keep application components organized and maintainable.
  • Provide an experience that works comfortably across different screen sizes.

02 / Ownership

My Role and Contributions

As the developer of MoodPlaylist, I worked across both the frontend and backend of the application.

  • Developed the frontend using Next.js.
  • Built backend functionality using C# Web API.
  • Connected frontend user interactions to backend services.
  • Designed and implemented user-facing music-discovery interfaces.
  • Worked on mood-selection and music-discovery workflows.
  • Worked on integrating external music-related services.
  • Worked on backend data handling and application integration.
  • Debugged frontend/backend communication and deployment behaviour.
  • Refined the user experience and application responsiveness.

03 / Technical approach

Architecture and technical approach

I structured MoodPlaylist around a Next.js frontend and a separate C# Web API backend.

The frontend presents the music-discovery experience and handles user interactions, while the backend supports server-side application functionality and integration requirements. This separation allowed me to work on the presentation layer and application services independently, with an API boundary between them.

I also worked on the supporting backend infrastructure needed to run the application beyond local development. I have not included database, authentication, or hosting-provider specifics here because I could not verify those details from the available project documentation.

  • Next.js Frontend

    Interface rendering, navigation, mood selection, and user interactions.

  • C# Web API

    Backend application logic and API services.

  • Music Integration

    Spotify-related discovery interactions described by the application.

  • Data and Infrastructure

    Backend hosting and data handling; provider and persistence details are not asserted.

04 / Trade-offs

Implementation decisions

One important decision I made was to keep the frontend and backend as separate application layers. Using Next.js for the interface and C# Web API for backend functionality helped me organize responsibilities and keep the application easier to maintain.

I focused on making the main user journey straightforward: the user selects a mood, explores music, and interacts with the available playlist features.

I also considered how the frontend should respond to asynchronous backend and external-service operations. This brought attention to loading behaviour, error handling, and how the experience should behave when requested data is not immediately available.

05 / Problem solving

Engineering challenges and solutions

  1. Connecting Two Technology Stacks

    Challenge

    Building MoodPlaylist required coordinating a Next.js frontend with a backend developed in C#.

    My approach

    I approached this by keeping responsibilities clearly separated and using API communication to connect the user experience with backend functionality. This strengthened my practical understanding of full-stack integration across different technology stacks.

  2. Building an Intuitive Discovery Experience

    Challenge

    A key design challenge was keeping music discovery simple while introducing mood-based personalization.

    My approach

    I focused on making the interface straightforward, with clear interactions intended to guide users from selecting a mood to exploring relevant music. This helped me think more carefully about how frontend architecture and user experience influence each other.

  3. Backend Deployment and Reliability

    Challenge

    Running the application's backend outside my local development environment introduced operational challenges, including backend availability and health-check issues.

    My approach

    I investigated how deployment behaviour affected API accessibility. The experience reinforced the importance of deployment diagnostics, service health monitoring, and reliable communication between deployed frontend and backend systems. I do not claim that every historical availability issue has been resolved.

06 / Quality

Testing and validation

My testing approach has involved checking frontend behaviour, API communication, and application workflows. I have also worked on debugging backend responses and deployment-related issues to understand how the application behaves when services are unavailable or respond unexpectedly.

These activities have helped me develop a stronger understanding of end-to-end debugging, frontend/backend integration, and the importance of validating behaviour beyond the user interface alone.

  • Frontend interaction checks
  • API integration and response debugging
  • Responsive interface review
  • Error and unavailable-service checks
  • Deployment diagnostics

Current deployment note: The public landing page is available, but a CORS preflight failure prevented the mood-list API request from completing during review. API-dependent workflows therefore remain unverified in the deployed preview.

07 / Impact

Engineering outcomes

MoodPlaylist demonstrates my experience developing a full-stack application with Next.js and C# Web API.

Through the project, I worked on a user-facing music-discovery experience while also gaining practical experience with backend services, integration boundaries, and deployment-related problem-solving. It has strengthened my ability to approach software development across multiple application layers rather than focusing on the frontend alone.

  • Full-stack Next.js and C# development
  • Music-discovery user interface
  • Frontend-to-backend integration work
  • External-service integration work
  • Backend deployment troubleshooting
  • Responsive application development

08 / Reflection

Lessons learned

Developing MoodPlaylist helped me better understand the relationship between frontend experience and backend reliability.

I learned that an intuitive interface is only one part of a successful full-stack application. The underlying services also need to communicate reliably, handle unexpected responses, and provide the data the interface depends on.

Working with separate technology stacks strengthened my understanding of API-driven development. The project also reinforced the importance of clear component responsibilities, thoughtful user experience, and careful debugging when integrating multiple systems.

Live Application Preview

The live application loads only when requested. Its owner controls which features work in an embedded preview.

MoodPlaylist live preview