study-ecsite

Next.js + Shopify Storefront API を前提にした B2C 向けヘッドレス EC フロントの基盤です。

セットアップ

npm install
copy .env.example .env.local
npm run dev

アプリは http://localhost:3000 で起動します。

必要な環境変数

• NEXT_PUBLIC_SITE_URL: サイトのベース URL
• SHOPIFY_STORE_DOMAIN: your-store.myshopify.com 形式のストアドメイン
• SHOPIFY_STOREFRONT_ACCESS_TOKEN: Storefront API 用アクセストークン
• SHOPIFY_STOREFRONT_API_VERSION: 利用する Storefront API バージョン

利用コマンド

• npm run dev: 開発サーバー起動
• npm run build: 本番ビルド
• npm run start: 本番ビルドの起動
• npm run lint: ESLint 実行
• npm run typecheck: TypeScript 型チェック
• npm run format: Prettier で整形
• npm run format:check: Prettier の差分確認

現在の構成

• src/app: App Router のエントリポイント
• src/components/layout: 共通レイアウト UI
• src/lib/shopify: Shopify 接続設定と API クライアント

商品一覧、商品詳細、カート、検索、E2E テストなどは後続タスクで追加する前提です。