GitLabとSourceTreeをつなげよう【windows偏】

前回の講座ではGitLabのアカウントを制作しました。

今回は制作したアカウントとSourceTreeを紐づける作業をしていきます。

アカウントにSourceTreeをつなげることで制作したプロジェクトをSourceTreeからコマンドを入力することなく操作できるようになります。

Gitはコミット、プッシュ、プル、マージなど横文字が多いうえに、ブランチの概念を理解することが難しいです。

ただでさえGit自体の理解が難しいのにそこに使い慣れていないコマンド操作が加わるとさらに理解が難しくなります。

コードを書く前につまずいていてはよくないので直観的で理解しやすいSourceTreeを使用しましょう。

GitとSourceTreeをつなげる方法はMacとwindowsでやり方が少しことなります、今回はwindowsでのやり方を解説します。

Macでのやり方を知りたいかたはこちらを参考にどうぞ。

目次

Gitlabからアクセストークンを制作する

まずはGitLabにアクセスするために必要なトークンを発行しましょう。

GitLabへログイン後、右上にあるアカウントから設定>アクセストークンのページから必要な情報を入力することで発行することができます。

  • 名前
  • 有効期限
  • 有効範囲

【名前】名前は英文字で後で見ても何に使用しているのか判断できる名前を付けておきます。

【有効期限】有効期限は何も入力しなければ無期限になりますので、基本的には何も入力しなくてよいです。

【有効範囲】有効範囲(サポート)とは制作するアクセストークンにどこまでの権限を渡すかということです。自分がマスターなので全てにチェックを入れ、すべての権限を与えましょう。

上記3つの情報を入力したら画面の下の方にある「Create personal access token(パーソナルアクセストークンを作成する)」ボタンをクリックしてアクセストークンを発行しましょう。

SourceTreeへGitLabのアカウントを追加する

アクセストークンを発行したらSourceTreeを開きアカウントを追加します。

画像を撮った際はすでに運用している状態ですのでいろいろタブがありますが、インストールしたばかりのSourceTreeは何もない状態の画面が表示されているはずです。

右上の+(プラス)ボタンを押すことでタブを追加でき、新しいプロジェクトやアカウントを追加できるようになっています。

初めはLocal(ローカル)のプロジェクト一覧が表示されますので(何もプロジェクトが無い場合は表示されません)Remoteへ切り替えます。

Remote(リモート)へ切り替えると「アカウントを追加」ボタンがあるのでそちらをクリックします。

クリックすると上のようなウィンドウが表れますので必要な情報を入力していきます。

  • ホスティングサービス:GitLabを選択
  • 優先するプロトコル:sshを選択

上2つを設定したら「Personal Access Tokenを再読み込み」をクリックします。

クリックすると上のようなウィンドウが開きます。

  • ユーザー名:GitLabのアカウント名
  • パスワード:制作したアクセストークン

を入力し「ok」をクリックします。

先ほどのウィンドウに戻り、ユーザー名が記載され、認証に成功という表示が出ていれば完了です。「ok」をクリックし、初めのRemoteの画面に戻ります。

アカウントが追加されていることを確認し、右のエリアにアカウント制作と一緒に制作したプロジェクト名が表示されていることを確認しましょう。

sshキーを設定する

Macの場合ここで終了ですが、windowsの場合ここからsshキーを発行し、sshキーを設定しなければいけません。

そこがwindowsとMacの違いになります。

sshキーとは非公開のプロジェクトに安全に接続するためのものです。

通常何かプライベートなものにアクセスするときはユーザー名とパスワードを入力して本人確認をしますが、sshというものを使用する確認方法があり、Gitではsshを使っています。

流れ

  1. sshキーを発行する
  2. 公開鍵をGitLabに設定する
  3. config設定を行う

となります。

sshキーには公開する公開鍵というものと公開してはいけない秘密鍵を言うものがありそれらを使用します。

公開鍵はGitLabが持ち、秘密鍵は自分のPCの中に持っておきます。

イメージとしては公開鍵が家の鍵穴で別にそれを見たところで何もありませんが秘密鍵は家の鍵に当たります。

秘密鍵を知られてしまうと簡単に侵入されてしまいますので絶対に公開しないように注意してください。

sshキーを発行する

sshキーはコマンド操作をして発行することができます。

Macのターミナルとwindowsのコマンドプロンプトは入力するコマンドが異なります。

これからVS CodeでMacのターミナルと同じコマンドを使用することが多くなりますので統一してVS Codeのターミナルから制作していきましょう。

sshキーは必ずC>user>あなたのユーザー名>.sshフォルダの中に制作しなければいけません。

VS Codeを立ち上げます。

VS Codeを立ち上げるとC>user>あなたのユーザー名の位置にいますのであとは.sshフォルダを制作すればsshキーを制作場所が作れます。

.sshフォルダを制作する前に一応すでに.sshフォルダがないか確認しておきましょう。移動するコマンドをVS Codeのターミナルに入力します。

移動できなければ存在しないという事になります。

cd .ssh

.sshフォルダが存在しなければ以下のディレクトリを制作するコマンドを入力します。

mkdir .ssh

そして制作した.sshへ移動しましょう。

cd .ssh

移動出来たら以下のコマンドでsshキーを発行します。

ssh-keygen

.sshフォルダの中にis_rsaとis_rsa.pubが生成されます。

is_rsa → 秘密鍵(公開してはいけない)
is_rsa.pub → 公開鍵

になります。普段通りエクスプローラーからマウス操作で中身を閲覧できるのでis_rsa.pubの中身をコピーし、GitLabに登録します。

公開鍵をGitLabに設定する

公開鍵をGitLabに登録しましょう。公開鍵をGitLabに登録することによって自分の持っている秘密鍵を照合し、非公開プロジェクトにアクセスすることができるようになります。

sshキーの設定-1

GitLabにアクセスし設定>SShキーを開きます。

以下の情報を入力し、登録します。

  • keyキー:公開鍵を張り付けます
  • title題名:適当な名前を付けます
  • Expires at期限:有効期限を決めます。入力なしで無期限です

config設定を行う

公開鍵を登録できたら次はpc側(秘密鍵側)の設定です。

SourceTreeにsshキーの情報を教えます。

sshキーを制作した場所、C>user>あなたのユーザー名>.sshの中に「config」という名前のファイルを作ります。

作り方はエクスプローラーから右クリックで制作してもよいですし、ターミナルからでもよいです。

configファイルを制作したらVS Codeで開き以下を記載します。

Host gitlab.com
HostName gitlab.com
User git
identityFile sshキーがある場所までのパス
TCPKeepAlive yes
identitiesonly yes

各項目について解説します。

HostNameですが、今回はGitLabを使用しているのでgitlab.comになっております。GitHubなど別のサービスを利用する際はこちらも変更となります。

今回書き換えなければいけない箇所はidentityFileの部分のみです。

パスの書き方は以下になります。

~/.ssh/秘密鍵の名前

本来なら「c/user/あなたのユーザー名/.ssh/秘密鍵の名前」になりますが「~/」でパスをrootまで省略することができます。

rootは「c/user/あなたのユーザー名」までになります。

秘密鍵の名前ですが、実は鍵を制作する際に名前を決めることができます。今回は名前を指定せず、デフォルトの状態で制作しました。

デフォルトでは秘密鍵の名前はis_rsaですので、こちらを記載します。

ですので、パスを記載したコードは以下になります。こちらを張り付ければ完了です。

Host gitlab.com
HostName gitlab.com
User git
identityFile ~/.ssh/is_rsa
TCPKeepAlive yes
identitiesonly yes

ファイルを保存してSourceTreeを開き、うまくいっているか確認しましょう。

プロジェクトをクローンする

プロジェクトをクローンしてみて、ssh接続がうまくいくか確認しましょう。

クローンとはGitLabにあるリモートプロジェクト(リモートリポジトリ)をローカル(自分のpc)にコピーすることです。

非公開プロジェクトをクローンする場合、ssh接続が必要なのでクローン出来ればsshの設定はできているということになります。

アカウントを追加した画面を開きます。

右側にGitLabで制作したプロジェクトがありますのでCloneを押します。

すると以下のような画面に遷移するので必要な情報を設定しましょう。

まず、ssh接続がうまくいっているか確認します。

一番目の入力エリアの「リポジトリタイプ」の部分に「これはGitリポジトリです」と記載されていればssh接続はうまくいっています。

「ソースパス/ソースURLとして正しくありません」と記載されているとsshが正しく設定できていませんのでもう一度設定しなおします。

ssh接続がうまくいったら2段目の保存先を選択します。保存先は自分が管理しやすい場所にhtdocsというディレクトリを作ってそこを選択します。(htdocsというディレクトリ名は自由に変更しても問題はありませんが、講座を進めていく上で統一した方がよいでしょう。)

次に3段目の名前を決めます、こちらで決めた名前はSourceTreeのタブに表示されます。

以上入力できたら「クローン」ボタンを押して完了です。

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

この記事を書いた人

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

目次