ここでは、Dreamweaverで行う「変更の記録と送信」の3つの基本操作を詳しく解説します。
ステージ(ステージング)とは?
ステージとは、変更したファイルを「この内容をコミットします」とGitに伝える作業です。Dreamweaverでは、Gitパネル内でチェックを入れるだけでステージできます。
💡コミット(commit)とは、現在のファイルの状態(変更内容)を記録して保存する操作のこと
一番初めの操作手順
- Dreamweaver下部または右側にある「Gitパネル」を開く
- ファイル名の左にあるチェックボックスに✔を入れる(全ファイルを指定)
- コメントは「初回コミット」にします
- ステージ済みのファイルとして分類され、次のコミットで記録対象になります

初回のみ、以下のようなメッセージが出てきます。
名前・・・コミット履歴に記録される名前
メール・・・Gitの履歴管理に必要なメールアドレスを入れます。
💡GitHub連携する場合、このメールとGitHubで使っているメールを一致させるた方がスムーズです。(連携予定がなければ自分の普段使っているメアドでもOK)


💡未追跡のものは緑色に表示され、今後記録対象のものは白色になります
未追跡ファイルの表示

Gitによって認識されたコミットファイル

一般的なGitツールでは「ステージング」という手順を使って、変更内容を一時的に登録し、その後まとめてコミットするのが基本です。
しかしDreamweaverでは、ステージング操作を明示的に行う必要はありません。
ファイルを保存した時点で変更が検知され、Gitパネルに自動的に反映されるため、チェック(✔)によるステージ操作のように見えますが、実際はすぐにコミット可能な状態になっています。
つまり、Dreamweaverでは「更新」→「すぐコミット」というシンプルなフローで管理できます。
コミットとは?
ステージ済みの変更に対し、コメントを付けて保存する操作です。これが「バージョン履歴」として残ります。
コミットは、ステージ済みの変更に説明を添えて記録する操作です。これにより、変更内容を後で振り返ったり、巻き戻すことが可能になります。
操作手順

- Gitパネル下部にある [コミット] ボタンをクリック
- 表示されたコメント入力欄に、作業内容を簡潔に記述(例:「トップページの見出し変更」)
- [コミット] を押すと、履歴として保存されます
🟦style.cssを修正してコミットする
pタグのスタイルを追加しました。
すると、修正したソースコードの行の位置にオレンジ色が追加され、ファイル名も白からオレンジに代わります。
さらに、Gitにも「修正済み」と追加されました。

🟦コミットしてみる
- 対象ファイルの左側にチェックを入れます。
- すると、コミットボタンが押せるようになります

- コミット用のコメントを追加します
- OKをクリックします


🟦リポジトリ履歴
Git操作パネルの時計のアイコン(リポジトリ履歴)をクリックすると、以下の画面が出てきます。
ここで変更した箇所、日付、コミット内容が見れます。

🟦変更を元に戻す
先ほど、style.cssに変更を加えましたが、この操作を元に戻す方法です。
- 「その他のアクション」ボタンをクリックし、「前回のコミット以降に行った~」をクリックします
- OKをクリックします


これで変更前のバージョンが復元されます。
🟦DreamweaverのGitで過去のバージョンを戻す方法
DreamweaverのGitでコミットしたファイルは、ファイル単位で過去のバージョンに戻すことができます。
手順:
- ファイルを開く
- Gitパネルを開く
- 「履歴(History)」タブを選択
- 目的の履歴をクリックして確認
- 「このバージョンを取得」する
- 該当履歴を右クリック
- 「Get this version(このバージョンを取得)」を選ぶ
- 保存・コミットする
💡コミット後にファイルを元に戻すには、ファイルを少なくとも 2 回コミットしている必要があります
💡ファイル単位での操作のみ可能です
💡コミットしていないファイルは戻せません
💡Dreamweaverだけではプロジェクト全体をまとめて過去の状態に戻すことはできません
Dreamweaverのプッシュ
プッシュは、コミットした変更を 外部のGitリポジトリ(例:GitHub) に送る操作です。
DreamweaverでGitを使う際にリモートリポジトリと連携していない場合、プッシュは使えません。
ただし、ローカルの操作だけで完結できます。
手順:
- ファイルを編集する
- 変更を加えると、Gitパネルに「未ステージの変更」として表示
- 変更を「ステージ」する(ステージに追加ボタン)
- Gitパネルで「+」ボタンをクリック
- 変更を「コミット」する(記録を確定する)
- 「✔」ボタンをクリックし、コメントを入力して確定
💡 Pushボタンは、GitHubなどと連携した場合にのみ有効
DreamweaverでGit ブランチ
ブランチとは?
Gitのブランチとは、変更履歴の分岐線を作ることができる仕組みです。たとえば「本番用のコード(mainブランチ)」とは別に、新機能開発や修正作業を安全に進めるための作業用ブランチをつくることができます。
Dreamweaverでは、作業内容を分けたいときに、自分のローカル環境内でブランチを作成して編集を進めることができます。
Dreamweaverでのブランチ作成・切り替え
Gitパネルの上部で現在のブランチ名を確認できます。
ブランチ操作の流れ
- [Git] → [ブランチ] → [新しいブランチ] を選択
- 作業ブランチ名を入力(例:feature-header)
- 切り替えたいブランチを選択して、編集を続ける




マージの考え方
2つのブランチで作業を進めたあと、一方の変更をもう一方に反映させたいときには「マージ(merge)」を行います。
マージを行うと、作業ブランチで加えた変更が元のブランチに取り込まれます。
Dreamweaverでも、複数のブランチを切り替えながら安全に編集内容を試すことができます。
例:headerデザインの調整を feature-header ブランチで行い、完成したら main にマージ
前の記事:[2] .gitignore の考え方と設定 | 次の記事: