Medusa: The WooCommerce of NextJS

Medusa: The WooCommerce of NextJS

Table of Contents

Medusa

Well I felt like it (The WooCommerce of NextJS) is but I am not sure it really is so here I will be exploring about it, which is based on Postgres.

The world’s most flexible commerce platform

The most popular open-source platform for commerce. Use Medusa as your foundation and focus on building the customizations that move the needle.

Items Medusa provides:

  1. Starters

alt text

  1. Admin

alt text

  1. Commerce Modules

alt text

  1. Framework

alt text

  1. Cloud

alt text

alt text

Documentation

NextJS Starter:

I went and started the project:

npx create-medusa-app@latest --with-nextjs-starter

This assumes that you have a Postgres database up and running.

Medusa server (Admin)

1. Initialize a new server:

npx create-medusa-app@latest --db-url "postgresql://neondb_owner:TOMbGz8sB@ep-young-lab-aak91.tus3.azure.neon.tech/neondb?sslmode=require"

So you need to add your database URL.

Here I have added a Neondb but it seems to take a lot of time while migrating!

Yes it is now seeding the database.

alt text

Medusa has created many tables, literally many tables!

After the database work is done:

  • Medusa Admin will be up at http://localhost:9000/app/

Creds: atulya@raaj.com

alt text

alt text

alt text

This is so awesome!

my-medusa-store-storefront (Client)

  • The Store Frontend will be available at http://localhost:8000/

Store:

- Products are loading

- Added to cart too

alt text

- Checking out

alt text

- Placed order

alt text

Admin:

- See order details

alt text

alt text

- Accepted Payment

alt text

- Stock Preview

alt text

- Delivery status

alt text

- Final

alt text

- Inventory (Just got reduced by 1)

alt text

- Customer view

alt text

- Customer order view

alt text

- Beautiful dark theme

alt text

Tech stack:

  1. NextJS
  2. Postgres
  3. Redis
  4. Vite

Overall Medusa is a good platform, I need to dig deep to get more details.

Getting started:

  1. Installation guide: https://docs.medusajs.com/learn/installation

  2. Install admin project

  3. Create admin via UI or CLI :

npx medusa user -e admin@medusajs.com -p supersecret
  1. Admin app consists of:
    "jest": "^29.7.0",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "typescript": "^5.6.2",
    "vite": "^5.2.11"
  1. Project structure

alt text

  1. Medusa’s Architecture

alt text

  1. Running Medusa:
yarn dev

alt text

I thought there will be code here but here is only Readme files.

Useful:

  1. Plugins