git/githubでweb共同制作

#実現したいこと

• webをチームで共同制作しやすくするためにgitを導入する
• ローカルでgit pushした時に、本番環境（xserver)とリモートリポジトリ(github)に同時に反映させる

（個人でも便利って聞くからやってみたいという方も大丈夫です）
（git,vi,linuxコマンドやssh、パーミッションなどの知識があった方がいいですが、ここで必要なものは後述します）

##開発環境
以下の環境ならどれでも大丈夫だと思います

os: windows,mac
chell: git bash,ターミナル
エディタ: atom, SublimeText, vim (vi)
ftpサーバー:filezilla,cyberduck

##目次

• 作業の流れ確認
• 作業
• 知らない、うろ覚えの人のためのgit,vi,linuxコマンド一覧

###作業の流れ確認

1. githubアカウントを取り、リモートリポジトリを作る
2. windowsにgitとgitを使う環境を構築
3. githubとxserverにssh（Secure Shell）接続
4. xserverにgitを使う環境を構築
5. ローカルリポジトリを作り、add && commitする
6. ローカルでgit pushした時に、本番環境とリモートリポジトリに同時に反映させる設定をする

###作業

####1.githubアカウントを取り、リモートリポジトリを作る

• 共同作業をする人

[githubの公式サイト] (https://github.com/) に行って、人数分のgithubアカウントを取ってください
すでにある人はそれでokです
それからorganizationを作成し、リモートリポジトリを作ります
ブラウザ上でぽちぽちやってください

こちらが参考になりました

リモートリポジトリは　
https://github.com/<組織名>/<リポジトリ名>
にできるはずです

チームのメンバーの権限は、きちんとしておきましょう
https://github.com/<組織名>/
からメンバーを追加して探し、そのアイコンをクリックした時に飛ぶ画面でメンバーの権限を変えられます
最初は、組織を作ったメンバーがメンバーの権限を変えられるようにしていることが多いです

• 個人作業をする人

共同制作をしないのであれば、organizationではなく、個人のリモートリポジトリで大丈夫です
リモートリポジトリは
https://github.com/<個人用アカウント名>/<リポジトリ名>
にできるはずです

####2.windowsにgitとgitを使う環境を構築

• Windowsの場合

Git for Windows をインストールします。
git bashもインストールされるので立ち上げておいてください

• Macの場合

すでにあるはずです

gitコマンドが使えるかどうかは、Windowsはgit bashで、macはターミナルで

$ git --version

で確認できます。
バージョンが表示されたらokです

####3. githubとxserverにssh接続

githubはsshではなくhttps接続でも大丈夫ですが、sshだとパスワードを省略できたりします

xserverがopenssh（開鍵認証方式）しか対応していないようなので、両方opensshしました

エックスサーバーにSSHで接続してみよう！がすごくわかりやすかったです
ある程度sshとviとlinuxコマンドとパーミッションの意味とか知っておいた方がいいので後述します

ただ、ssh xsrvするたびにパスワードを聞かれるのは面倒だという人は
以下のコマンドでssh-agentさんに秘密鍵を認識させてください

$ eval `ssh-agent`
$ ssh-add ~/.ssh/id_rsa

直で打つと、シェル終了後は働いてくれないです
bashrcに書いておくと、起動時に毎回実行してくれるようになります

ちなみに、

$ ssh-add -l

で、今ssh-agentさんが認識しているものを表示してくれます

また、

$ ssh -A xsrv

でssh-agentさんとその管理下の秘密鍵と一緒にxserverへログインできます
また、

$ ssh -T github

で、xsrvからgithubにsshできたりします
ちなみに、xsrvやgithubという簡単なコマンドだけでsshするには、~/.ssh/configに、別途設定が必要ですが、紹介してあるサイト通りに進めていけばやっていると思います
ForwardAgentはyesにしておいてください

こちらがわかりやすかったです
ssh-agentの使い方
ssh-agentを使って公開鍵認証方式のsshパスワード入力を省略する方法

githubのssh接続も同様にやって行きましょう
２個目のssh接続ですが、同じ鍵を使ってもいいです（それが公開鍵の利点のようです）
ただ、２、３個くらいなら、私は別々にしました

名前の変更方法は

$ ssh-keygen -t rsa -b 4096 -C "[e-mail]"
Enter file in which to save the key (/Users/hoge/.ssh/id_rsa):

でエンターを押さずに

~/.ssh/id_rsa_github

などと指定します

こちらが参考になります

4. xserverにgitを使う環境を構築

2017,9月現在　xserverにはgitが入っていました
が、それだけではgit commitした時にerror: Error building treesと出たので
gettextをxserverにインストールしましょう

curlはhttps（SSL）を使いたかったらインストールしてください

エックスサーバーにGitを導入する手順 の、gettextの導入とcurlの導入がとても参考になりました

####5. ローカルリポジトリを作り、add && commitする

gitbashまたはターミナルで管理下におきたいディレクトリまで移動し、

$ git init

で初期化します
その直下に.gitディレクトリができるはずです

ファイルの位置がみれるfilezilla, cyberduck,　finderなどを開いていて、そんなものないよと思った人は、ツールバーの表示にある、隠しファイルを可視化するをonにしてみてください
もしくはgitbashやターミナルでlsと叩くと確認できます

この.gitディレクトリと同じかそれ以下の階層にあるものをgitの管理下に置けます

次は、ステージングしなくてはいけないので

$ git add .

します
git add の次にはファイルパスがくるので、ここでは相対パスで、現在のディレクトリ全てを指定しています
その中にlogfileなど、gitの管理下になくてもいいものがあるなら、あとで.gitignoreに書きましょう

または、git管理が必要なファイルだけをgit addしてください
指定したいファイルはスペース区切りで指定できます
例えば、現在のディレクトリ直下のファイル三つを指定したいなら、
$ git add .file1 file2 file3
という感じです

次に

$ git commit -m "メッセージ"

と打って、エラーがなけれはローカルでコミットができました
これで、いつでもそのコミットに戻れます
個人作業の人はこれで終わりで大丈夫だと思います。
あとは、git addとgit commitを繰り返すだけです。
add と　commitを両方するには、
$ git commit -am "メッセージ"
という方法もあります
変更されたファイルがaddされcommitされます

####6. ローカルでgit pushした時に、本番環境とリモートリポジトリに同時に反映させる設定をする

まずはローカルからリモートへ接続します
リモートリポジトリをブラウザで作ったあと、画面に従ってgit remoteを登録します
下記のようなコマンドを、ブラウザからコピーするか、自分用に書き直して使ってください

$ git remote add origin [e-mail]:your-account/repository-name.git

次に、git push -u origin master で成功したら、git remoteのpush先に本番環境（xserver）のベアリポジトリを追加します

git pushで本番環境に“自動デプロイ”できる環境を作ってみよう！ がすごくわかりやすかったです

流れは、大まかにいうと、ローカルもxserver上にもgithub上にもリポジトリを作成し、ローカルでxserverとgithubに同時にgit pushする、です

上記のサイトは、開発環境がここで紹介しているものと同じなので、そのまま進めていけます
ただ、ベアリポジトリの設定がめんどくさいことや、pullやbranchする時の手順も多くなることで、あんまりスマートじゃないかなと思い始めて来ました

ここまでで設定が終わったら、textエディタatomのgit plusプラグインなどで、簡単なgitコマンドが打てるので、やっとgui生活に戻れます

[Atom]Gitを利用するためのプラグインgit-plusを導入してみる

###　知らない、うろ覚えの人のためのgit,vi,linuxコマンド一覧

全く知らない人は、すでにわかりやすくまとめてある記事がたくさんあるのでそちらを貼っておきます

私のvi初心者おすすめ記事
また、vimtutorをとてもオススメしたいです
実際に手を動かして練習できるものです
これで慣れます
やり方は簡単です
gitbashや、ターミナルで

$ vimtutor

と打つだけです
３０分ぐらい時間があるなら是非やってみてください

私のlinux初心者おすすめ記事
チートシートがやばいです

私のgit初心者おすすめ記事

以下は、自分のメモ用に、よく使うものや、うろ覚えコマンドを書き留めておきます

git 主にローカル

$ git add <file名>
    //　特定のディレクトリを作業dirからステージングエリアへ
$ git add . 
　　　　　　　 //その下全てのディレクトリを作業dirからステージングエリアへ
$ git commit  ーm　"commment" 
　　　　　　　 //ステージングエリアからリポジトリ（ローカルのdb)へ
$ git log —oneline
    //１行でlog表示
$ git checkout — <file名>
    //ステージングエリアから作業dirへ　　　もしくはブランチを切り替える
$ git checkout　-b <branch名>
    //ブランチを切り替える
$ git diff (ステージングされてるなら—cached) 
　　　　　　　　//変わった箇所をみる
$ git status 
　　　　　　　　//次することを教えてくれる
$ git reset —hard　
    //作業dirからステージングエリアにaddしたものを戻したい
　　　　　　　　　　　　（リポジトリにあげたら　 HEAD　　をつけると一つ前に戻る　　、＾つけるともう一個前に戻る）
$ git marge <branch名> 
    //masterにいる時に、master　と<branch名>を統合
$ git checkout -b <branch名>
   　　//branch変更
$ git tag
　　　　　　　　//tagがつけられる

git 主にリモート

$ git remote add origin
$ git config -l 
　　　　　　//configが１行でみれる
$ git push origin master

linux コマンド

rmdir -r　　
　　　　//　を削除
　　//ディレクトリは再帰的にコピーするという意味で recursive の -r をつける

less /検索語 　　　　//検索する
　　　　//検索する
grep '検索語'
　　　　//検索する
mv
　//move 同じなら名前変わる
ls -l
　　//所有者　グループ　その他 の順にパーミッション確認
chown 　
　　//change owner
wc
//word count
mkdir test && cd test　
//など&&で続けて実行できる

vim

終了はcontrol+cや:q
uで戻る
取消しの取消し:CTRL-R
ddからのp　でカットペースト
yyからのp
/検索語　　で検索
画面単位の移動 CTRL+fとCTRL+b でfoword back
^　行頭へ移動
$　行末へ移動
fキーを押した後に、行きたい地点のキャラクタを入力　　　　；　　or n or N　で候補を回る
　全選択の仕方は、gg　からの　Vで選択にして「G」