Налаштування Medusa.js Admin Dashboard

Настройка Medusa.js Admin Dashboard

Medusa Admin — React-приложение на Vite, поставляемое отдельным пакетом @medusajs/dashboard. У Medusa 2.x Admin повностю відокремлен від бекенду та підключається як плагін або розгортається самостійно. Розширення здійснюється через систему Extensions — кастомні сторінки, віджети, роути.

Варіанти підключення

# Варіант 1: Вбудований в бекенд (рекомендується для старту)
npm install @medusajs/dashboard
# автоматично додано до medusa-config.ts при create-medusa-app

# Варіант 2: Standalone деплой
npx create-medusa-app@latest --no-boilerplate
cd my-admin && npm install
VITE_MEDUSA_BACKEND_URL=https://api.example.com npm run build
# деплой dist/ на Vercel/Nginx

Кастомні віджети для сторінок товарів

import { defineWidgetConfig } from '@medusajs/admin-sdk';
import { Container, Heading, Text } from '@medusajs/ui';
import { useQuery } from '@tanstack/react-query';

const ProductLoyaltyWidget = ({ data }: { data: { id: string } }) => {
  const { data: stats } = useQuery({
    queryKey: ['loyalty-stats', data.id],
    queryFn: () => sdk.client.fetch(`/admin/products/${data.id}/loyalty-stats`),
  });

  return (
    <Container>
      <Heading level="h2">Лояльність</Heading>
      <Text>Начислено баллів: {stats?.total_points_given ?? '—'}</Text>
    </Container>
  );
};

export const config = defineWidgetConfig({
  zone: 'product.details.after',
});

export default ProductLoyaltyWidget;

Кастомні сторінки

import { defineRouteConfig } from '@medusajs/admin-sdk';
import { GiftSolid } from '@medusajs/icons';

const LoyaltyPage = () => {
  return (
    <Container>
      {/* контент сторінки лояльності */}
    </Container>
  );
};

export const config = defineRouteConfig({
  label: 'Програма лояльності',
  icon: GiftSolid,
});

export default LoyaltyPage;

Запуск та конфігурація

VITE_MEDUSA_BACKEND_URL=http://localhost:9000 npm run dev
# Сборка для production
VITE_MEDUSA_BACKEND_URL=https://api.example.com npm run build
# Расширення автоматически применяются из src/admin/

Терміни: базова настройка + підключення до бекенду — 2–4 години; кастомні віджети та сторінки під бізнес-задачи — 2–5 днів.