SourceTreeを使ってコミットとプッシュ

SourceTree(ソースツリー)を使って制作した開発環境をGitにコミットをしてプッシュまでを行います。

GitLabとSourceTreeをつなげよう【windows偏】でSourceTreeは動く状態になりました。

次はSourceTreeを実際に使用してGitの操作に慣れていきましょう。

目次

コミットする

何かものを制作したらキリのいい所でGitにコミットし、変更履歴を残しておきます。

コミットとはファイルやディレクトリに変更があった際にその差分を記録する行為です。

変更の差分を記録する事によって、もし、過去のデータの状態に戻したいという事が発生した場合や、過去にどんな変更を行ったかなどを管理する事ができます。

1人で開発を行っている際はこのような事はあまり必要としませんが、チームで開発をしていると、誰がどういった変更をどのタイミングで行ったのかを知る必要が必ず出てきますのでとても重要な機能です。

早速コミットしたいところですが、少しだけgitignoreという設定ファイルを登録する必要があります。

.gitignoreとはコミット対象を設定するファイルになります。

これを設定せずコミットを行ってしまうとデータ容量の大きいnode_modulesなども一緒にコミットされてしまうので、コミットにかなりの時間をかけてしまいます。

ですので、通常はnode_modulesなどはコミット対象からはずすよう.gitignoreにその設定を記載します。

.gitignoreを設定する

.gitignoreファイルをどこか自分が管理しやすい場所に制作します。

制作場所のポイントはhtdocs以外の場所に作るのがポイントです。

htdocsには別でそのプロジェクトごとにカスタマイズした.gitignoreを制作したいという場合があります。

今回制作するのはグローバル(全てに適応する).gitignoreになりますので、共通のディレクトリに制作するのがよいでしょう。

.gitignoreを制作したら以下のコードを.gitignoreに記載してください。

#ignore thumbnails created by windows
Thumbs.db
#Ignore files build by Visual Studio
*.obj
*.exe
*.pdb
*.user
*.aps
*.pch
*.vspscc
*_i.c
*_p.c
*.ncb
*.suo
*.tlb
*.tlh
*.bak
*.cache
*.ilk
*.log
*.dll
*.lib
*.sbr

#Original
node_modules/
dist/
.gitignore

設定の書き方は別の講座で解説します。もし他に除外したいファイルなどあればそちらの講座を参考にしてください。(制作中)

今回は

  • node_modules/以下のファイルすべて
  • dist/以下のファイルすべて
  • .gitignore自身

の3つをコミット対象から除外しています。

.gitignoreをSourceTreeに設定する

SourceTreeに.gitignoreを設定して有効化しましょう。

SourceTreeを開きます。

ツールの中のオプションを開きます。すると以下の画面が表示されます。

①Gitタブを開きます。

②先ほど制作した.gitignoreまでのパスを設定します。

③『ok』をクリックし設定を保存します。

これで.gitignoreの設定は完了です。

コミット

実際にコミットを行いましょう。

『作業ツリーのファイル(緑の点線のエリア)』に変更されたファイルが表示されますので、そのファイルを①の『全てインデックスに追加』ボタンを押して『index(緑の実線の部分)』に追加します。

indexとはコミットするファイルを定義する場所です。

ここに登録されたファイルがコミットされます。

②コミットに添えるコメントを必ず書きます。書き方は様々ですが、私はGitのコミットメッセージの書き方を参考に書いています。

コミットが完了するとブランチに『master』が制作され、masterをクリックするとコミット履歴を見る事ができます。

プッシュする

コミットしたデータをプッシュしましょう。

プッシュとは先ほどコミットして制作したファイルの変更履歴をGitサービス(今回の場合はGitLab)上に送信する事を言います。

ネット上に上げて置く事で他の人とソースコードを共有できようになります。(リモートリポジトリの制作方法によっては誰でも閲覧できてしまう状態になるので注意が必要ですが、今回はプライベートで制作しているので大丈夫です)

『プッシュ』をクリックすると以下の画面が開きます。

右下の『プッシュ』をクリックして完了です。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

プログラムちょと書ける。
いまはバリ島でスクール作っている。
プログラムちょっとできる。

目次