Requesting Next.js web service through public http route returns 404 error on Digital Ocean App Platform

Question

Problem

I am setting up an App Platform on Digital Ocean using a Strapi web service component as CMS and a Next.js web service component as Front-End. Strapi is accessible on the route /api and Next.js on /sporus. According to the runtime logs building and deployment are both successful and no errors are shown. When I try to access my Next.js web service through the route/sporus I am met with a 404 screen. Strapi on /api is working including the admin panels and requests.

Goal

Next.js Webservice is accessible through the /sporus route and does not return a 404.

What I've tried

• Set npm run start to next start -H 0.0.0.0 -p ${PORT:-8080} according to two guides by Digital Ocean tutorial video.
• Added basePath: process.env.BASE_PATH to next.config.js according to the Next.js docs
• Checked if Next.js was served on the standard domain provided on creation of the App Platform instead of custom domain.

Files

next.config.js

const domains = (process.env.APP_URL) ? [process.env.APP_URL] : ['localhost'];

module.exports = {
  reactStrictMode: false,
  images: {
    domains: domains,
  },
  basePath: process.env.BASE_PATH,
}

env variables

App wide:

- key: STRAPI_URL
  scope: RUN_AND_BUILD_TIME
  value: ${APP_URL}/api
- key: NEXT_PUBLIC_STRAPI_URL
  scope: RUN_AND_BUILD_TIME
  value: ${APP_URL}/api
- key: DATABASE_URL
  scope: RUN_AND_BUILD_TIME
  value: ${db.DATABASE_URL}
- key: APP_URL
  scope: RUN_AND_BUILD_TIME
  value: ${APP_URL}

Next specific:

key: NEXT_URL
    scope: RUN_AND_BUILD_TIME
    value: ${APP_URL}/sporus
  - key: BASE_PATH
    scope: RUN_AND_BUILD_TIME
    value: /sporus

N.B.

I have very little experience with D.G. App Platform & Next.js or deploying node.js servers in general. Most of my projects I run locally so I apologise if this question isn't very descriptive. All additional debugging steps or general tips are welcome.