Shopifyテーマ開発フロー:github連携による効率的な開発と運用

Shopify

Shopifyテーマの開発を始めたばかりの方や、外注パートナーを含む複数名でテーマ開発を行っている方にとって、効率的に作業を進めるためのフローを構築することは、とても重要です。

本記事では、実際の開発現場で使われる具体的な手順を元に、どのようにして効率的かつミスの少ない開発を実現するかを詳しく解説します。

具体的な開発フローについて見ていきましょう。

開発フロー

1. 基本ブランチ設定

  • mainブランチ:本番公開中のテーマと自動同期中。
  • featureブランチ:新しい機能や修正を行うためのブランチ。

2. 最新のmainからfeatureブランチを作成

  1. mainブランチの最新状態を取得
   git pull origin main
  1. 新しいfeatureブランチを作成
   git checkout -b feature/タスク名
  1. Shopifyテーマとfeatureブランチを連携
  • 外注の場合、必ずこのfeatureブランチで作業を進める。
  • 表示確認はプレビューモードで行う。

3. ローカル開発環境の設定

  • ローカルサーバの起動
  shopify theme dev
  • 管理画面の更新差分をローカルに取り込みながら進行
  shopify theme pull

4. 開発後の手順

  1. PR(プルリクエスト)&レビュー
  2. mainブランチにマージ
  • マージ後、本番にデプロイ
  1. 不要なブランチとテーマの削除
   git branch -d feature/タスク名
  • Shopify管理画面でfeature用テーマも削除

参考リンク

失敗事例:別の開発ストアでの完全分離開発

  • 問題点:本番とプラグインや画像、商品データも同期が必要。
  • 結果:開発ストアの管理画面により、自動でコードが書き換わり、意図しない差分が発生。
  • 特に外注依頼時:差分が明確化されず、運用上問題が発生。

このフローを遵守することで、Shopifyテーマの効率的な開発と安定した運用が実現できます。