I’m trying to integrate a Next.js (v14) frontend with a .NET Core 8 Web API backend. My API does not work when I use app.UseSpa. However, when I comment out app.UseSpa you can see before app.Run(), the API works fine.
I am new to Nextjs and .Net Core Web Api, also tell me what are and why these are used SPA, proxies.
Nextjs -v 14
.Net 8

var builder = WebApplication.CreateBuilder(args);

// Add services to the container.
builder.Services.AddControllers();
builder.Services.AddCors(options =>
{
    options.AddPolicy("AllowLocalhost3000",
        builder =>
        {
            builder.WithOrigins("https://localhost:3000")
                   .AllowAnyHeader()
                   .AllowAnyMethod();
        });
});
builder.Services.AddSpaStaticFiles(configuration =>
{
    configuration.RootPath = "ClientApp/.next";
});

var app = builder.Build();

app.UseSpaStaticFiles();

app.UseRouting();
app.UseStaticFiles();


app.UseHttpsRedirection();
app.UseCors("AllowLocalhost3000");
app.UseAuthentication();
app.UseAuthorization();

app.MapControllers();

app.UseSpa(spa =>
{
    spa.Options.SourcePath = System.IO.Path.Combine(builder.Environment.ContentRootPath, "ClientApp");

   if (builder.Environment.IsDevelopment())
    {
        spa.UseProxyToSpaDevelopmentServer("https://localhost:3000");
    }
});

app.Run();