Medusa all in nextjs

[samyarkd]

hi

i'm looking for a way to set up medusa all in next.js, i want to run the admin, backend and storefront to be in one Next.js project.
I'm actually wondering why in the documents haven't made the APIs inside the Next.js, this seems a better and easier way to start the backend instate of express.

I'm new to medusa and i took a look at the backend starter and i couldn't find out how all of it got integrated
It's practically cleaner and easier DX, i would like to do that with create t3-stack

if another person has done similar thing please tell me

[durdenx]

For now, you need to run Medusa on its own server. If you want a unified app, your best bet is to create a monorepo with https://turbo.build/repo (by the creators of Nextjs).

[samyarkd]

Ok, great, is there any instructions or something for it ?

[durdenx]

There are many examples here: https://turbo.build/repo/docs/getting-started/from-example

Start with one of them and copy the backend and storefront generared with https://docs.medusajs.com/create-medusa-app in the apps directory of your monorepo. If you read the documentation of turborepo, it is very well explained.

[olivermrbl]

@samyarkd – we are working on modularizing Medusa's architecture and making our product portable to modern environments like Next.js functions as small isolated packages e.g. the entire Cart API bundled in @medusajs/cart.

We are still in the early stages of this work, so you won't be able to do much now, unfortunately. Though, you can read about this approach in our recent blogpost covering our Modules SDK.

I recommend joining our Discord to stay up to date and keep an eye out for our releases.

Though, I am happy to hear your request, as it validates the direction of our current product priorities.

[olivermrbl]

To give you an idea of what this modularization would look like, consider the following code snippet:

import { initialize } from "@medusajs/cart"
import { NextApiRequest, NextApiResponse } from "next"

const cartService = await initialize()

export default async (req: NextApiRequest, res: NextApiResponse) => {
  const { cart_id } = req.query
  const { quantity, variant_id } = req.body

  try {
    const cart = await cartService.addLineItem(cart_id, { quantity, variant_id })

    res.json({ cart })
  } catch (e) {
    res.status(400).json({ error: e.message })
  }
}

I can't guarantee, that this is what it will look like, but it will be pretty close.

[samyarkd]

Wow, that would be awesome 👌
is there any rodemap or something? Because I'm willing to contribute

[olivermrbl]

We'd be happy to accept contributions, thank @samyarkd!

We'll share an updated roadmap very soon. I will make sure to ping you here when it's live. But again, if you join our Discord, you will likely get notified of this.

[samyarkd]

Thank you very much that's great

yes I'm already joined the discord server 🙏

[ringge]

someone created a template for medusajs with T3 stack, you can try it https://github.com/georgwittberger/t3-commerce-template