top of page

《Bubble》Version管理のベストプラクティスについて

概要

バージョン管理の概要

環境について

bubbleには、開発環境と本番環境の2種類があります。


・開発環境は編集が可能です。

・本番環境は読み取り専用になります。


開発環境で編集をしても、本番環境に変更をデプロイしない限り、本番環境は変更されないので、リリース後も安心して開発を続けることができます。


今回はbubbleのVersion管理のベストプラクティスについて解説していきます。

Version管理のベストプラクティスについて

1. ブランチ

基本的にブランチは本番環境に1つ、開発環境に1つあります。プランによっては開発環境のブランチを複数増やすことができます。開発環境のブランチは複数のブランチで同時に編集することができます。


プレミアムプランの場合はこのように開発環境のブランチを複数作成できます



1. ブランチの作成

ブランチは親子関係になっています。最初に作成したカスタム ブランチは Main ブランチのクローンを作成し、その子になります。


作成方法

①右上近くにあるブランチアイコンをクリックすると、バージョン コントロール パネルを開くことができます。ブランチ アイコンには、現在のブランチの名前が表示されます。


②Create a new branchをクリックします。


③Branch nameに任意のブランチ名(かな、漢字は入力できません)、descriptionに説明を入力し、Createボタンで作成します。



④test-branchができました。こちらはMainブランチのクローンとして作成したので、Mainブランチの子ブランチということになります。



2.ブランチのマージ

ブランチをマージすると、 1 つのブランチで行った変更を別のブランチに追加できます。


マージの方法(子ブランチから親ブランチにマージするとき)

①今回は親ブランチにマージしたいので、親ブランチに移動します


②どのブランチをマージするかを選択します




③変更を確認します。OKであればConfirm changesをクリックしてマージが完了します。


 

📌場合によってはここでコンフリクトが起き、どちらのブランチに合わせるのか問われることがあります。この場合、ボックスをチェックすることで変更点を確認することができます。

 



3.ブランチの削除

ブランチが不要になった場合は削除できます。


削除方法

①削除したいブランチに移動します

②バージョンコントロールパネルの右上の▼をクリックし、Deleteをクリックします


③DELETEを入力し、ボタンを押して削除完了です



4.セーブポイントについて

どのブランチでも、特定の時点でのブランチのスナップショットを作成するセーブポイントを作成できます。セーブポイントは、次の場合に自動的に作成されます。


  • ライブにデプロイする

  • マージを開始する

  • マージを終了する

  • マージをキャンセルする

  • 別のブランチを上書きインポートする

  • ブランチを復元する直前に


特定のブランチで行った変更をロールバックする必要がある場合に備えて、必要なだけカスタム セーブポイントを作成することもできます。


カスタムセーブポイントの作成方法

①セーブポイントを作りたいブランチのバージョン コントロール パネルを開き、HistryタブのCreate a save pointをクリックします。


②任意の名前を入力しConfirmボタンをクリックして完了です




2. 用語一覧

バージョン管理に関する重要な用語の一覧です


用語

定義

ベースブランチ(base branch)

変更をマージしたいブランチ

ブランチツリー(branch tree)

ブランチがどこから来たのか、他のブランチとどのように関係しているのかを示す視覚化

子ブランチ(child branch)

親ブランチを持つブランチ。子ブランチは親ブランチになることもできます

コンフリクト(conflict)

ベース ブランチとソース ブランチが最後に 2 つのブランチが同期してからそれぞれ同じ内容を (異なる方法で) 変更した場合、マージ プロセス中に競合が発生します。

コンフリクト解決(conflict resolution)

コンフリクトを解決するプロセスです。ページごとにコンフリクトを整理し、ページごとに 1 つのブランチを優先してすべてのコンフリクトを解決するオプションを提供します。

カスタムブランチ(custom branch)

上位プランのアプリには1 つ以上のカスタム ブランチをもつことができます

デプロイ、デプロイメント(deploy, deployment)

ブランチをデプロイするとは、変更を本番環境にプッシュすることになります。本番環境にデプロイできるのは、メインブランチと ホットフィックスブランチのみです。

開発環境(Development environment)

開発環境には、メイン、カスタム ブランチ、およびホットフィックス ブランチが含まれています

環境(environment)

環境にはブランチが含まれます。ライブ環境と開発環境という 2 つの環境があります。環境は、使用するデータベースによって定義されます (例えば、ライブ環境はライブ データベースを使用し、開発環境は開発データベースを使用します)。

ホットフィックスブランチ(hotfix branch)


ホットフィックスブランチは、本番環境から分岐できる唯一のブランチです。一度に存在できるホットフィックス ブランチは 1 つだけです。ホットフィックスブランチが存在する間は、メインブブランチを本番環 にデプロイできません。上位プランで利用できます。

同期中(in sync)

2 つのブランチが同期している場合、2 つのブランチをマージすることで生じるコンフリクトは発生しません。

ライブ(Live)

インターネット上で実際にユーザーが利用可能なアプリケーションのバージョン。公開されている実運用版を指します。

ライブ環境(Live environment)

ライブ版のアプリケーションが運用されているサーバーやネットワークの環境全体。

メインブランチ(Main branch)

すべてのアプリにはメインブランチがあります。ホットフィックスブランチを除いて Live にデプロイできる唯一のブランチです。ブランチ ツリー階層の最上部に位置します

マージ、統合(merge, merging)

1つのブランチの変更点を別のブランチに取り込むプロセス。複数の開発作業を一つのブランチに統合します。

親ブランチ(parent branch)

分岐する子ブランチを持つブランチ。親ブランチから分岐する子ブランチが複数存在することがある。

コンフリクトを解決する(resolve conflicts)

異なるブランチのマージ時に発生する矛盾や衝突を解消するプロセス。どの変更を優先するか選択し、問題を解決します。

復元する(restore)

セーブポイント機能を使用するか、カスタムの日付/時刻を入力して、ブランチの過去のバージョンに戻ることです。

セーブポイント(savepoint)


Liveへのデプロイ時、マージの開始時、マージの終了時、マージのキャンセル時、またはブランチを復元する直前に、ベース ブランチに自動的に作成されます。 カスタム セーブポイントは、いつでも手動で作成できるセーブポイントです。

セーブポイント保持期間(savepoint retention window)

どれだけ古いセーブポイントまで保持し、利用できるかを定義する期間。

ソースブランチ(source branch)

ベースブランチにマージする変更のソースであるブランチを指します。このブランチから変更が他のブランチに取り込まれる。

同期(sync)

2 つのブランチを同期するとは、Live または Main の変更をベース ブランチに取り込む目的でそれらをマージすることです。

ブランチの作成、分岐(to branch, branching)

既存のブランチから新しいブランチを作成すること。異なる機能の開発や修正を分けて行うことが可能になります。

バージョン管理(version control)

アプリへの変更を追跡および管理するためのシステム。過去のバージョンの復元や変更点の比較が容易になります。


3. 社内での運用方法

社内でのバージョン管理の基本的な流れについて説明します。


ステップ1.ブランチの作成

新しいチケットや修正に取り組む際、ベースブランチ(基本的にMainブランチ)から新しいブランチを作成します。

  • ブランチ名→チケット名(例:No1-login、No2-chat_list など)

  • ブランチの説明→必須ではないがどのような開発や修正を行うかを後から見返してわかるように書きます


※開発や修正はそのブランチ内で必ず行ってください



ステップ2.親から子への変更をマージ(大抵はメイン環境を該当ブランチに同期させる)

該当のブランチでSync withを選択して親ブランチ(メイン環境)と同期をさせます。(Sync with Mainボタンをクリックします)



※コンフリクトがある場合は、コンフリクト内容を精査してコンフリクトを解決します


 

コンフリクトの解決方法

  1. 自分の担当範囲かどうか確認

  2. 担当範囲だったら適切なブランチの実装・修正を取り込む

  3. 担当範囲外の時は担当の人と協議して適切なブランチの実装・修正を取り込む

 


ステップ3.子ブランチで必要なテストを実行

親ブランチ(メイン環境)の変更分がきちんと子ブランチに反映されているかエラーがないかをテストをします。



ステップ4.子から親への変更をマージ

親ブランチに移動して、Merge changes from another branchをクリックして該当のブランチをマージします。

※コンフリクトがあった場合はステップ2を参照



ステップ5.マージ完了確認

Historyからマージが完了しているかを確認し、エディターやプレビュー画面でも正しくマージできているかテストをします。



ステップ6.ブランチを削除

親ブランチへのマージが正しく行われていることが確認できたら、子ブランチに移動して、Deleteを選択してブランチを削除します。



 

注意点


  1. API開発などURL依存があってメイン環境で作業するときは、コンフリクトを防ぐためメイン環境での開発完了までマージ作業を行わないようにしてください。

  2. メイン環境はステージング環境としていつでも本番環境にデプロイできる(エラーがない状態、開発が完了した最新の実装・修正が取り込まれている)状態にしておいてください。

  3. ブランチ (Development と Live 以外) の存続期間を可能な限り短く保つようにしてください。

  4. あるブランチで修正または機能の実装に取り組んでいる場合は、関連する項目 (要素、ワークフロー、ページなど) を別のブランチで編集しないでください。


 

参考資料



 

関連記事

SPA
StripeConnectについて
@未完成@初期設定
@未完成@パフォーマンス
SPA
SPAガイド
@未完成@パフォーマンス
保守性
保守性高く開発するガイド
bottom of page