ブログ
  • EC・ビジネス
  • ·

  • 2026年05月17日

Draft

【2026年最新】Medusa.jsでECサイト構築する3ステップ完全ガイド

【2026年最新】Medusa.jsでECサイト構築する3ステップ完全ガイド

【2026年最新】Medusa.jsでECサイト構築する3ステップ完全ガイド

自社ECサイトの構築を検討しているけれど、Shopifyなどの既存プラットフォームでは柔軟性に限界を感じていませんか？Medusa.jsは、Node.jsベースのオープンソースECプラットフォームとして、カスタマイズ性と拡張性を重視する開発者に注目されています。本記事では、Medusa.jsを使ったECサイト構築の全工程を、実務担当者が即実践できる3つのステップで詳しく解説します。

Medusa.jsとは？なぜ今注目されているのか

Medusa.jsは、Node.jsとTypeScriptで構築されたヘッドレスコマースプラットフォームです。2026年現在、グローバルで開発者コミュニティが拡大しており、以下のような特徴から多くの企業で採用が進んでいます。

主な特徴

  • オープンソース: 無料で利用でき、ソースコードの完全なカスタマイズが可能
  • ヘッドレスアーキテクチャ: フロントエンドを自由に選択でき、Next.js、Gatsby、Nuxt.jsなどと連携可能
  • モジュラー設計: 必要な機能だけを組み込める柔軟な構造
  • REST/GraphQL API: 豊富なAPIにより外部システムとの統合が容易

従来のShopifyやWooCommerceと比較して、Medusa.jsは開発の自由度が高く、エンタープライズレベルのカスタマイズにも対応できる点が大きな強みです。

ステップ1：Medusa.js開発環境のセットアップと初期設定

まずは開発環境を構築しましょう。以下の手順で、ローカル環境にMedusa.jsをインストールします。

必要な環境

  • Node.js 16以上（推奨：18.x以降）
  • PostgreSQLまたはSQLite（開発環境ではSQLiteでも可）
  • Redisサーバー
  • Git

インストール手順

bash

Medusa CLIのインストール

npm install -g @medusajs/medusa-cli

新規プロジェクトの作成

medusa new my-store

プロジェクトディレクトリに移動

cd my-store

初期データのシード

medusa seed -f ./data/seed.json

環境変数の設定

.envファイルを作成し、必要な環境変数を設定します。

DATABASEURL=postgres://username:password@localhost:5432/medusa-store REDISURL=redis://localhost:6379 JWTSECRET=your-secret-key COOKIESECRET=your-cookie-secret

セキュリティのポイント: シークレットキーは必ず強力なランダム文字列を生成し、本番環境では環境変数管理サービス（AWS Secrets ManagerやHashiCorp Vaultなど）で管理することを推奨します。

開発サーバーの起動

bash

開発サーバーの起動

medusa develop

管理画面（Admin UI）は別途起動

cd my-store-admin npm run start

これで、http://localhost:9000でMedusa.jsのバックエンドAPI、http://localhost:7001で管理画面にアクセスできます。

ステップ2：商品データベース構築と管理画面のカスタマイズ

環境構築が完了したら、商品データベースの設計と管理画面のカスタマイズに進みます。

商品データの構造設計

Medusa.jsでは、以下の基本エンティティで商品を管理します。

  • Product: 商品の基本情報（名前、説明、画像など）
  • Variant: 商品のバリエーション（サイズ、色など）
  • Price: 価格情報（通貨、地域別価格）
  • Inventory: 在庫管理

管理画面からの商品登録

  1. 管理画面（http://localhost:7001）にログイン
  2. 「Products」メニューから「Add Product」を選択
  3. 必要情報を入力：
    • タイトル
    • 説明文
    • カテゴリー
    • 商品画像（複数アップロード可能）
    • バリエーション（サイズ、色など）
    • 価格設定

カスタムフィールドの追加

標準の商品属性だけでは不足する場合、カスタムフィールドを追加できます。

typescript // src/models/product.ts import { Column, Entity } from "typeorm" import { Product as MedusaProduct } from "@medusajs/medusa"

@Entity() export class Product extends MedusaProduct {   @Column({ type: "varchar", nullable: true })   manufacturer?: string

@Column({ type: "int", nullable: true })   warranty_period?: number }

管理画面のカスタマイズ

Medusa.jsの管理画面は、React（Admin UI）で構築されており、カスタムウィジェットやページを追加できます。

jsx // src/admin/widgets/custom-widget.tsx import { defineWidgetConfig } from "@medusajs/admin-shared"

const CustomWidget = () => {   return (     <div>       <h2>カスタム売上ダッシュボード</h2>       {/ カスタムコンテンツ /}     </div>   ) }

export const config = defineWidgetConfig({   zone: "product.details.before", })

export default CustomWidget

実務のコツ: 商品データのインポートには、CSV一括インポート機能を活用すると効率的です。また、Activepiecesなどのワークフロー自動化ツールを使えば、外部システム（ERP、在庫管理システム）からの商品データ同期を自動化できます。

ステップ3：決済・配送システムの統合と本番デプロイ

最後に、実際に販売するために必要な決済機能と配送システムを統合します。

Stripe決済の統合

Medusa.jsは、Stripeをはじめとする主要な決済サービスとの統合をサポートしています。

bash

Stripeプラグインのインストール

npm install @medusajs/medusa-payment-stripe

medusa-config.jsに設定を追加：

javascript module.exports = {   plugins: [     {       resolve: @medusajs/medusa-payment-stripe,       options: {         apikey: process.env.STRIPEAPIKEY,         webhooksecret: process.env.STRIPEWEBHOOKSECRET,       },     },   ], }

重要: Stripeのwebhook設定を必ず行い、決済完了イベントを正しく受信できるようにしてください。これにより、注文ステータスの自動更新が実現します。

配送プロバイダーの設定

bash

日本の配送業者向けプラグイン（カスタム実装も可能）

npm install medusa-fulfillment-manual

配送方法の定義：

javascript // medusa-config.js {   resolve: medusa-fulfillment-manual,   options: {     providers: [       {         id: "yamato",         label: "ヤマト運輸",         price: 800,       },       {         id: "sagawa",         label: "佐川急便",         price: 750,       },     ],   }, }

本番環境へのデプロイ

推奨デプロイ先

  • Vercel/Netlify: フロントエンド（Next.js）
  • Railway/Heroku: Medusa.jsバックエンド
  • AWS ECS/Google Cloud Run: エンタープライズ向け

デプロイ前チェックリスト

セキュリティ対策

  • [ ] 環境変数の安全な管理（シークレットキーの暗号化）
  • [ ] CORS設定の確認（許可するオリジンの制限）
  • [ ] SSL/TLS証明書の設定
  • [ ] API Rate Limitingの実装
  • [ ] SQLインジェクション対策の確認

パフォーマンス最適化

  • [ ] データベースインデックスの最適化
  • [ ] Redis キャッシュの設定
  • [ ] 画像の最適化（WebP形式、CDN利用）
  • [ ] バックアップ設定の確認

監視・ログ

  • [ ] エラーロギング（Sentry等）の設定
  • [ ] パフォーマンスモニタリング
  • [ ] アップタイム監視

bash

本番環境用ビルド

npm run build

データベースマイグレーション

medusa migrations run

本番サーバー起動

npm run start

注文管理の自動化

Medusa.jsのイベント機能を活用すれば、注文ステータスの変更に応じた自動処理が可能です。例えば、Activepiecesと連携することで、以下のような自動化が実現できます。

  • 注文確定時に自動で在庫システムを更新
  • 発送完了時に顧客へ追跡番号をメール送信
  • 返品リクエスト時に自動でSlackへ通知

このようなワークフロー自動化により、運営コストを大幅に削減できます。

まとめ

Medusa.jsを使ったECサイト構築の3ステップを解説しました。重要なポイントを振り返ります。

  • ステップ1: Node.js環境とPostgreSQL、Redisを準備し、Medusa CLIで簡単にプロジェクトを開始できる
  • ステップ2: 管理画面から直感的に商品登録が可能で、カスタムフィールドやウィジェットで独自の拡張も実現できる
  • ステップ3: Stripe等の決済サービスとの統合は公式プラグインで簡単に実装でき、配送システムも柔軟にカスタマイズ可能
  • セキュリティとパフォーマンス: 本番デプロイ前のチェックリストを確実に実行し、安全で高速なECサイトを構築する
  • 運営効率化: Activepiecesなどのワークフロー自動化ツールと組み合わせることで、日々の運営業務を大幅に効率化できる

Medusa.jsは、自由度の高いECサイトを構築したい開発者やビジネスにとって、2026年現在最も注目すべきプラットフォームの一つです。本記事の手順を参考に、ぜひ独自のECサイト構築にチャレンジしてみてください。

無料相談

お気軽にご相談ください

ヘッドレスEC構築やワークフロー自動化について、15年以上の経験を持つコンサルタントがお客様の課題を深く理解し、最適なソリューションをご提案します。

無料相談を予約する
00 %

お客様満足度

課題に寄り添い、成果にこだわるパートナーシップを大切にしています

00 +

年以上の経験

技術トレンドの変化に対応し続けてきた確かな知見があります

000 +

プロジェクト実績

業界や規模を問わず、幅広いお客様の成長を支えてきました