はじめに

このページでは、Adobe Dreamweaver を使って「Git(ギット)」を簡単に扱う方法を解説します。特に、以下のような方に向けてです。

  • HTMLやCSSは触れるが、GitやGitHubはよく分からない
  • ターミナルが苦手
  • DreamweaverだけでGitのバージョン管理やGitHubとの連携をしたい

GitとGitHubの違いとは?

用語かんたんに言うと例えるならDreamweaverでの役割
Gitファイルの変更履歴を管理する道具(ローカルで使える)コードのタイムマシン履歴管理を行う/GUI閲覧
GitHubGitのデータをインターネットで共有・保存できるサービスクラウド上の倉庫(+SNS)公開・共有してチームや別端末で作業する/PushやPull

🟦新規リポジトリの場合

  • Dreamweaverが.gitフォルダを作成し、そのフォルダ内で履歴管理が始まります
  • この時点からDreamweaverは、ファイルの変更をGitで自動的に追跡し始めます
  • GitHubに接続しなくても、ローカルでのコミット(履歴記録)や履歴の確認、巻き戻しといった操作は可能です
作業フォルダ内の.gitフォルダ

Step 1:DreamweaverでGitを有効化する

1-1. 事前準備

DreamweaverでGitを設定する場合、あらかじめGitをインストールする必要があります。
Gitのインストール方法については以下を参考にしてください

adobe公式:Dreamweaver で Git の使用を開始
Progate[プロゲート]

インストール完了後。。。

Dreamweaverでは、Git用のパネルが用意されています。自分のパソコンにGitクライアントがインストールされている場合のみ、表示できます。

自分のパソコンにGitをインストール完了したのち、次に進んでください。

1-2. GitをDreamweaverで有効にする

Dreamweaverではすでに新規サイトを設定している場合、新規リポジトリがグレーになり、ボタンをクリックできません。そのため、新規サイトを設定している場合でも、新たに新規サイトを作成してください。

新規リポジトリ

  1. [サイト] → [新規サイト] を選択
  2. ローカルサイトフォルダー(Gitで管理したいフォルダ・作業フォルダ)を選択・作成
  3. このサイトにGitリポジトリを関連付けるを選択
  4. Gitリポジトリとして初期化を選択
  5. 保存を選択
[サイト] → [新規サイト] を選択
ローカルサイトフォルダー(Gitで管理したいフォルダ・作業フォルダ)を選択・作成
  • サイト名・・・好きな名前。「サイトの管理1」で一覧に表示されます
  • ローカルサイトフォルダー・・・ファイルをアップロードするフォルダ(作業フォルダ)
  • 「このサイトにGitリポジトリを関連付ける」にチェックす
  • 「Gitリポジトリとして初期化」にチェックを入れ、保存
  1. サイトの管理 ↩︎

次の記事:[2] .gitignore の考え方と設定

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です