NextJS using Django API - How to choose best pattern-CodePudding

I have GeoDjango running on a digital ocean droplet and I'm rewriting project from VueJs to NextJs hosted on Vercel.

In Vue we have service pattern connected with store that is responsible for fetching and updating data.

I figured out the fetching part which is quite good but I'm still trying to figure out the best way to update data.

How should I construct the CRUD layer without using the NextJs API folder ( I don't want to have another backend calling my Django backend).

Should I use context?

Should I use middleware?

Should I create custom services? How to call them then? Is there an equivalent of store in NextJs?

I'm asking because I want to avoid cluttering as right now I'm using fetch POST on pages. I'm using NextAuth that gives me a context with jwt token.

Thank you for any hints

CodePudding user response：

For Next.js, you can use rewrites to proxy requests to your backend. This way you can access your existing backend from relative URLs just like if they were in your API routes. You can do this explicitly for each route, Or you can use the incremental adoption pattern which will check for an existing route in your Next.js app before proxying the request back to your django server.

// next.config.js
module.exports = {
  async rewrites() {
    return {
      fallback: [
        {
          source: '/api/:path*',
          destination: `https://your.django.app/api/:path*`,
        },
      ],
    }
  },
}