事務でも使う　Githubを学びました！

Githubとは

Gitとはバージョン管理のシステムです。
ファイルって大抵変更されるとバージョンが変わって名付けられる。
そしてその履歴を管理していくシステム。

エンジニアがチームで開発なら当然のgit。

でも、事務系でもgithubを使ったほうがよくね　という気運がある。

なぜならコードをかかないにしてもファイルの編集作業をしたりすることは十分ある。

CMSサイトをちょこちょこいじるってだけでもチームでやる場合があるかもしれない。
あとはIssueも使える。

確かに共有ツールにdropboxがある。G suiteがある。確かにそのとおり。
onedriveもある。　chatworkもまぁそういうのができたような気がする(うろ覚え)。

だが、そう近いうちにgitを使う業種は増えていくと思います。

なぜならExcelをdropbox内で複数人で編集していたらめちゃくちゃになるかもしれない。

ならないようにロックかけないといけないかもしれない。権限変更しないといけない。
同期のトラブルが起きるかもしれない。
実際Excelを共有ドライブで作業していた際に競合がおきることはあります。

ところで、さらっとgit と　githubをごちゃごちゃにしてる感があるのですが

はい、ごちゃごちゃにしてます♪

インターネット上のサービスとしてがgithub
githubをコマンドで使うのがGit
みたいな認識。

初心者(自分)がGithubを学習

まぁぶっちゃけ私のPCスキル事務系のレベルなんで（たぶん)。
※余談ですが、事務系の仕事でVLOOKUP関数を使える方って事務系でも全体の20％
IT系会社の上司から以前聞きました。Excelを使わないのか使えないのかは不明ですね。

さて、学習なんですけど僕の場合。

youtubeで初心者向けに無料で！基本的なGitフローを解説されていたかたがいたので
学ばせていただきました！

正直Gitなにそれ？の人は以下のYoutube動画(こちら)がすごくためになるのでは！？

なんかSource Treeとかちょっとつついたことあるし、分岐させて開発する進めるっていう
ことはわかるけど、いまいち使いこなせない。(つまり私！）とかのレベルの方は
役立つと思います！

結構今回の手順は以下の動画に倣ってる部分があります。ぜひ参考にしてください！

前提条件

※GitBashとVSCodeは入れておく必要があります。

Githubにサインイン　登録してなければサインアップ

1.　まずこちらのgithub公式サイトでmailアドレスとか各種設定していく。
2. 利用できるようになったら。サインイン。フリープランでいいです。

①Githubの画面のリポジトリから画面上部リポジトリ。
　Newのボタンを押す。

git commit -m “message”

VSCodeを開く。

VSCodeで新規ウィンドウを立ち上げる。
画面上部のターミナル。もしくはCtrl+Shit+@ でターミナルがひらく。

Githubで画面上部の<Code>で先ほど作成したリポジトリ名が
https://github.com/pekepon999/pekepon-wordpress.git　になっているのでコピー。
これは人によると思うけど、例えばテスト用にデスクトップに今回のプロジェクトつくりたいなら

cd desktop
mkdir test-lab(名前なんでもいい)
cd test-lab
と今回しておく

ここで作業。

↑みたいになってる。　画像にのせてないですが、(main)もしくは(master)という表示があるかもしれません。いったんmainになっているものとして進めます。

git clone https://github.com/pekepon999/pekepon-wordpress.git

と打ってEnter。

ターミナルで　Warningとか出る（実際にはリポジトリにファイルなんもないから)。
軽く無視
Errorがでたらうちまちがえか、他の原因 でcloneできてない。

cloneしおえたら、自分がいる階層からcdコマンドで 対象の階層に移動。
つまり以下のディレクトリに移動している状況(もともとなっているなら大丈夫)

上記で
code .
とうってEnterおすと新規でVSCodeが立ち上がる。

この新しい画面ではファイルを作っていない状態なので、下記のような感じになってる。

上記のようになっていたらここまで大丈夫です

さっきまで(git cloneとかで使っていたVSCodeはいらないので対象のアプリがアクティブになった状態でAlt+F4 などで 落として大丈夫です(少なくとも今回の内容に支障はないです)。

中身が空(htmlファイルとかない)だけどとりあえず、リモートリポジトリ(github)上にcommitしたい場合
git commit –allow-empty -m “empty commit”
上のempty-commitはcommitメッセージなので、とりあえず練習的にはなんでもいいです。

上みたいな感じになります！
IDがみえているので、(別にみえてもどうでもいいんですが)
commitによる変更を打ち消すコマンド　git revert を使いました。

ただ、今回はファイルもなんも作ってはいないです。
リモート側のgithubをブラウザで確認してみて変化があったらリモートにコミットができています。

ファイルを編集してリモート(本番環境)にあげる

VSCode内で編集する。

htmlで適当に<h1>変更します</h1> とかしてみた。

Branchを切る！

実際の現場ではmainを本番環境だとしたら世に出るまでに多くのレビュァの方が
フォローアップしていながら改善していく流れだと思うんで。いきなり本番環境には上げないハズ。
それに、ほかにも同じファイルのコード編集している人もいるんでブランチを切って作業しておく。
branch名は　test-envとかにして

git branch test-env
git checkout test-env (mainからtest-envに開発環境変化)

git brach で確認するとmain ではなくtest-env　環境に移っていることがわかる。

　git push origin test-env main

・ローカル(VSCodeから）本番環境へ
　現状　test-envという環境にいる。
　test-env環境のファイルを本番環境へ上げる。

①ステージング：git add .
②test-env環境下でcommit:git commit -m "test-env-first"
③git push origin test-env main

git push origin (今いるブランチ) (送りたいブランチ)
git push origin test-env main

Pull Requestをgithubで送る。

で、リクエストをなげると下の画面に遷移

タイトル部は作業ファイル名は
書いたほうがいいです。

レビュァの方が確認してMerge pull request >confirm> マージされる。

で、上部のタブでpullrequestで変更箇所が確認できます。
今回は全部のタグの前に＋マークがついているので本番環境へは
mainではなくtest-envそのままのコードが追加されているわけです。

git pull origin main　

リモート上でマージした。ファイルをtest-envではなく、mainにもどすわけですよね。
もうローカル(VSCode上のターミナルからtest-envというbranchは削除していいので
git branch -D test-env
main branch に戻りたいので、git checkout main
ひとまずおしまい。

個人的な感想とか

例えばこういうマニュアルとかも

誤字、脱字、衍字、可読性　明らかな間違い　といった事務的な部分でもチームで改良していくサイクルがつくれますよね。

自分もまだまだコマンドとか使いこなせてないし、Markdown記法使っていきたいと思ってます。
学習方法はたくさんの初学者向け書籍、Qiitaさん、youtube、人に聞く　などたくさんありますね！

しっかり学びたい方は、いろんな人があげているGitの動画みるとか本とか。
具体的になりますがUdemyなどで高評価のGitの授業とかおススメです。(1600円くらいのセールしょっちゅうやってます)