I’m working on building a website using Next.js, where I perform some image calculations on user inputs in the backend and render some images on the frontend based on the results. I need to use a Node based backend because I’m using the library called Sharp which requires native Node dependencies. Initially my backend code was under the “pages/api” directory in my Next project and I had deployed the whole thing to Netlify. It was working fine but on the free plan Netlify allows only 10s for a function invocation before timing out, and my backend code takes slightly longer than that. So chose to make a completely separate folder for my backend and deploy it on Vercel as it allows 60s on the free plan. This went according to plan.

But the thing is that my frontend and backend both need access to the same folder of images, which might be frequently updated, so it is not really feasible to have 2 copies on that folder and make changes to both places every time an image needs to added. So I set out to make a new “monorepo” folder, which contains “frontend”, “backend”, and “shared” as its subfolders. I copied in my old code into these subfolders, including the netlify.toml and vercel.json files. I locally hosted the frontend or the backend, and they ran fine. But when I put the entire monorepo folder on my GitHub and imported them onto Netlify/Vercel, they are “deployed” with absolutely no error logs, but the links generated simply give 404 errors.

Could anyone tell me where exactly I went wrong and how to fix it?