こんにちは。
今日、ある程度作業した後にコミットしようと思いgit statusコマンドを入力すると、

On branch master
Your branch is up to date with 'origin/master'.

ずっとmasterブランチで作業していたことが発覚しました、

完全にブランチを切り忘れていたわけですが、今回はこんな時の対処法を紹介します。

開発環境

macOS Big Sur 11.0.1
Git 2.24.3

手順

1.変更を退避する

まずはgit stashコマンドを使用して変更を退避します。
すると、

Saved working directory and index state WIP on master: ×××

このように表示され、ちゃんと退避されました。

2.ブランチを切り替える

git stashコマンドで変更を退避させたらgit checkoutコマンドで、作業したかったブランチに切り替えましょう。

ブランチを作成していない場合は、

git branch (ブランチ名)

を実行するとブランチを切ることができるので、この後にgit checkoutコマンドでブランチを切り替えることができます。

3.退避した変更を取り出す

1で退避した変更をgit stash popで取り出すことができます。

これでコンフリクトが起きなければ成功です！

まとめ

これで成功すればそこまでめんどくさくないですが、コンフリクトが発生したら面倒なのでブランチを切り替え忘れないようにします。。

はじめに

最近、Git/GitHubについて学習しております。
今回は、Gitの根本的な知識であるローカルのデータ構造についてアウトプットしたいと思います。
※今回の内容では、GitHub等のリモートリポジトリは含まれておりません。

ローカルのデータ構造のエリア分け

各エリアについて説明

上記で紹介した各エリアについて掘り下げていきたいと思います。

ワークツリー

ワークツリーとは、実際に作業を行う場所です。
ファイルの作業完了後、以下コマンドでインデックスに登録します。

git add <ファイル名>

インデックス(ステージ)

インデックスとは、リポジトリにコミットする準備をする場所です。
別名、「ステージ」とも言います。

インデックス内に必要なファイルが準備できた場合、下記コマンドでリポジトリに登録します。

git commit -m "<コミットメッセージ>"

インデックスがワークツリーとリポジトリの間にある理由

理由は、以下の2点になります。

• ワークツリー内の必要ないファイルを含めずにコミットを行える。
• ファイルの一部の変更だけをインデックスに登録してコミットが可能

リポジトリ(ローカルリポジトリ)

リポジトリとは、ファイルやディレクトリの状態を記録する場所になります。

今回、紹介しているリポジトリの位置づけとしては、「ローカルリポジトリ」になります。

リモートリポジトリとローカルリポジトリの違い

• リモートリポジトリ

専用のサーバにコード等のファイルを配置して複数人で共有するためのリポジトリです。
例)GitHub,BitBucket

• ローカルリポジトリ

ユーザー自身の手元のマシン上に配置するリポジトリです。
※今回紹介しているリポジトリが、こちらにあたります。

まとめ

• ワークツリー

ファイルの作業をする場所

• インデックス(ステージ)

コミット前にファイルを待機させておく場所

• リポジトリ(ローカルリポジトリ)

ファイルの変更履歴を保存する場所

参考

Git： もう怖くないGit！チーム開発で必要なGitを完全マスター
ワークツリーとインデックス
履歴を管理するリポジトリ

概要

独学でプログラミングを学んでいる立場として、一番学んでおかなければならないのは実はGitだと思います。プログラミングスクールでは共同開発の経験が積める場所もありますが、独学では文字通り一人でやっているので、共同開発の経験は積めません。
せめてGitの知識、および使用方法はわかっていないと現場に入れたとしても、開発に携わることができません。
独学で学んでいる時からGitを使用しながらバージョン管理し、実戦でも違和感なく使えるよう学んでいきたいと思います。

参考文献

【Git入門】Git + Github使い方入門講座?Gitの仕組みや使い方を完全解説！パーフェクトGit入門！
YouTubeの動画ですが、こちらが一番わかりやすいです。
特に、実際の現場での使われ方を想定しながら説明してくださるので、理解が深まります。
ありがとうございます。

Gitとは

いつ、誰が、何を変更したか履歴を記録するバージョン管理ツールです。

基本用語

リポジトリ
プロジェクトの単位であり、Gitのファイルを管理する場所です。この中で作業を行っていきます。
リモート
Gitが用意しているサーバーのこと。GitHubを使用するとブラウザで中身を確認できたりします。
ローカル
個人で作業している端末をgitではローカルといいます。
ステージング
Gitで管理される状態にすることです。正確にはインデックスにコミットするファイルを登録することです。
マスター
元々の変更履歴です。
ブランチ
マスターから分岐させた別の変更履歴です。マスターに影響を与えずリモートにプッシュすることが可能で、後からマスターへ合流させることができます。
マージ
ブランチを別のブランチやマスターへ合流させることです。
フェッチ
リモートの状態をローカルにダウンロードしてくることです。

Gitのコマンド

git clone
新規にリモート場にあるリポジトリをローカルへコピーする。後ろにはGitHubから必要な文字列を確認し入力します。

$ git clone git@github.com:~

git status
Gitの状態を確認するコマンドです。新しいファイルや変更があるファイルはファイル名が赤で表示されます。

$ git status
~
Untracked files:
   (use "git add <file>..." to include in what will be committed)
   ファイル名
~

git add ファイル名
指定したファイルをGitでステージングするコマンドです。git statusで確認すると指定したファイルが緑で表示されます。

$ git add 指定するファイル名
~
Changes to be committed:
   (use "git rm --cached <file>..." to unstage)
   new file: 指定するファイル名

Untracked files:
   (use "git add <file>..." to include in what will be committed)
   ステージングされていないファイル名
~

"git add ."とファイル名ではなくドットを指定する、Gitで管理されていないファイルを全てステージングさせることができます。

$ git add .
~
Changes to be committed:
   (use "git rm --cached <file>..." to unstage)
   new file: ファイル名
   new file: ファイル名
   ~
~

git commit -m "コミットメッセージ"
ステージングさせたファイルをGitに保存するコマンドです。コミットメッセージを書くことでメッセージを書くことができます。

$ git commit -m "コミットメッセージ"
[master (root-commit) ~] コミットメッセージ
2 files changed, 1 insertions(+)
 create mode ~ ファイル名
~

git log
git commitの履歴を確認できるコマンドです。

$ git log
commit ~
Author: ~
date: Mon Nov 18 11:06:23 2020 

コミットメッセージ

git push origin
リモートにアップロードするコマンドです。
originはリモートサーバのことです。

$ git push origin

git push origin ブランチ名
新しいブランチをリモートにプッシュする場合のコマンドです。

git pull origin
ローカルの既存のリポジトリに最新のリポジトリをダウンロードする。

git checkout ブランチ名
ブランチから別のブランチへ切替るコマンドです。

$ git checkout master
Switched to a new branch 'master'

git checkout -b ブランチ名 master
-b ブランチ名で新たなブランチを作成できる。

$ git checkout -b ブランチ名 master
Switched to a new branch 'ブランチ名'

git branch
ブランチの一覧を見るコマンドです。現在のブランチは緑色で表示されます。
-aを後ろに付けると、リモート側のブランチも確認することができます。

$ git branch
* ブランチ名
  master

git merge 合流させるブランチ名
現在指定しているブランチへマージを行うコマンドです。

$ git branch
  ブランチ名
* master
$ git merge ブランチ名
Updating ~
Fast-forward
 file | 1+

git fetch origin
リモートの状態をローカルへダウンロードするコマンドです。

$ git fetch origin
~
From github.com:~
~ ブランチ名 -> origin/ブランチ名

git rebase origin/ブランチ名 ブランチ名
コミットを元々の最終コミットの後ろへ強引に持ってくるコマンドです。コミットツリーがシンプルになりすっきりします。

$ git fetch origin
$ git rebase origin/ブランチ名 ブランチ名
$ git push origin -f

-fはforceプッシュといいリモートの状態を無視してローカルを強引にプッシュするコマンドです。

git reset --hard HEAD
ファイルの変更を最終コミットまで戻ることができるコマンドです。

$ git reset --hard HEAD
HEAD is now at ~ コミットメッセージ

git stash
git stash pop
変更した内容をgit stashコマンドで一度消すことができます。git stash popで消した内容を復元することができます。

$ git stash
Saved working directory and index state WIP on ~
$ git stash pop

プルリクエスト

masterにマージしてもらうよう依頼すること。GitHub上では簡単にプルリクエストを確認でき、メッセージを書くこともできます。

共同開発でのエラー

共同開発の場合、以下のエラーが出る機会がよくあります。

$ git push origin develop
To github.com-~.git
! [rejected] develop -> develop {fetch first}
error: failed to push some refs to 'git:github.com:~.git'
~

リモートサーバーにあるブランチと違う履歴をプッシュする場合に警告として出ます。
その場合、手元のローカルにリモートのブランチをマージさせます。

$ git checkout ローカルのブランチ名
~
$ git merge origin/ブランチ名 
~

実行してviエディタが表示されたら、:wqと入力するとリモートからローカルへマージさせることができます。

---

$ git push origin develop
~
CONFLICT (content):Merge conflict in ~
~

同じファイルの同じ行が違う内容の場合に出るエラーです。該当ファイルを確認すると、該当箇所が編集されているので、正しく編集し直します。

$ git status
~
(fix confilicts and run "git commit")
~

いつも通りgit commitを行えば変更をコミットできます。

コマンドの豆知識

fetch、mergeとpull

$ git fetch origin
$ git merge origin/ブランチ名

この流れは

$ git pull ブランチ名

と同じ意味合いになります。必要に応じて使い方を分けます。

mergeとrebase
mergeとrebaseの使い分けはどちらが正しいというものはないので、必要に応じて使い分けをしてください。

まとめ

Gitの基本的な部分は理解することができました。正確には違う意味の部分もあるかと思いますが、まずは使い方を覚えて使いこなしていきたいです。

エンジニアの先輩から教わったスキルハックです。

ターミナル上で、pushする際に、git branchでブランチ名確認して、
「feature/fix-password-formいちいち打つのめんどくさいな〜。」って思っていました。

Tab補完ができれば、feくらいのタイミングでもう入力できます。
楽ちん楽ちん。

コミットする際も地味にめんどくさい。
git commit -m "xxxxxxxx"

g → tab　→　c → tab → "xxxxxx"
てな感じでスイスイ行きます。

Sourcetreeをaddする時くらいしか使わない自分からするとだいぶありがたい。

だまされたと思ってやってみてください。マジで捗ります。

導入方法

macOS CatalinaからMacのデフォルトのシェルがzshになったそうです。
それまでは、bashだったそう。
シェルについて詳しくないですが、以下の記事がわかりやすくまとまってました。
bashとzshの違い。bashからの乗り換えで気をつけるべき16の事柄

zsh-completionsをインストール

https://formulae.brew.sh/formula/zsh-completions
上記サイトの通り、コマンドを叩く
-[注意]- 就業中や勉強中の方はビール飲みたくなるので、見ないほうがいい。

brew install zsh-completions

設定を有効にするために~/.zshrcに追記

 if type brew &>/dev/null; then
     FPATH=$(brew --prefix)/share/zsh-completions:$FPATH

     autoload -Uz compinit
     compinit
 fi

これだけです。
ちなみに自身は.zshrcファイルがなかったので

touch .zshrc 

でファイルを作ってからvimを使って追記しました。
エディタはなんでもいいと思います。

vim .zshrc

ターミナルを開き直すのは面倒なので以下のコマンドで再読み込み

source .zshrc 

すると、Tab補完が有効になっているはずです。
これで今日から、Tab補完なしで生きれない体になったぜ！！
マジでgitの操作が捗ります。多分1.8倍くらい。ありがたや。アディオス。

参考

Homebrew Formulae
zsh-users/zsh-completions

エンジニアの先輩から教わったスキルハックです。

ターミナル上で、pushする際に、git branchでブランチ名確認して、
「feature/fix-password-formいちいち打つのめんどくさいな〜。」って思っていました。

Tab補完ができれば、feくらいのタイミングでもう入力できます。
楽ちん楽ちん。

コミットする際も地味にめんどくさい。
git commit -m "xxxxxxxx"

g → tab　→　c → tab → "xxxxxx"
てな感じでスイスイ行きます。

Sourcetreeをaddする時くらいしか使わない自分からするとだいぶありがたい。

だまされたと思ってやってみてください。マジで捗ります。

導入方法

macOS CatalinaからMacのデフォルトのシェルがzshになったそうです。
それまでは、bashだったそう。
シェルについて詳しくないですが、以下の記事がわかりやすくまとまってました。
bashとzshの違い。bashからの乗り換えで気をつけるべき16の事柄

zsh-completionsをインストール

https://formulae.brew.sh/formula/zsh-completions
上記サイトの通り、コマンドを叩く
-[注意]- 就業中や勉強中の方はビール飲みたくなるので、見ないほうがいい。

brew install zsh-completions

設定を有効にするために~/.zshrcに追記

 if type brew &>/dev/null; then
     FPATH=$(brew --prefix)/share/zsh-completions:$FPATH

     autoload -Uz compinit
     compinit
 fi

これだけです。
ちなみに自身は.zshrcファイルがなかったので

touch .zshrc 

でファイルを作ってからvimを使って追記しました。
エディタはなんでもいいと思います。

vim .zshrc

ターミナルを開き直すのは面倒なので以下のコマンドで再読み込み

source .zshrc 

すると、Tab補完が有効になっているはずです。
これで今日から、Tab補完なしで生きれない体になったぜ！！
マジでgitの操作が捗ります。多分1.8倍くらい。ありがたや。アディオス。

参考

Homebrew Formulae
zsh-users/zsh-completions

皆さん、Git コマンドをタブ補完していますか？

まだだよ、って方は以下のエントリがオススメです。

• 「Git補完をしらない」「git statusを1日100回は使う」そんなあなたに朗報【git-completionとgit-prompt】 - Qiita

---

では、タブ補完できるようになったところで「Git のエイリアス」の話に戻ります。

Git のエイリアスを設定して、せっかく短いコマンドで実行できるようになったのに、タブ補完が効かなくて逆に面倒くさい

というようなことはないでしょうか？ このエントリはそんな悩みを解決する助けになると思います。

さて、一言で「Git のエイリアス」と言っても、以下ふたつの意味があります。

• alias gco='git checkout' と定義するもの
• git config alias.co checkout と定義するもの

多くの人は前者の gco コマンドをタブ補完したいようで、こちらの情報はググるとたくさん見つかりました。今回私がやりたかったのは後者で、こちらは全然見つけられなかったので、前者と合わせてここにまとめておきます。

alias コマンドで作成したエイリアスのタブ補完

以下のように行います。

$ alias gco='git checkout'
$ __git_complete gco _git_branch
$ alias g='git'
$ __git_complete g __git_main
$

git-completion.bash 内で __git_complete も _git_branch も __git_main も定義されていて、読み込んだ後であれば使用できます。どのコマンドにどの関数を使用すればよいか、は git-completion.bash を眺めればなんとなくわかるので、後は試してみるだけです。

git config alias.* コマンドで作成したエイリアスのタブ補完

以下のように行います¹。

__git_my_main() {
  if [ ${COMP_CWORD} = 2 -a "${COMP_WORDS[1]}" = "co" ]; then
    _git_branch
  else
    __git_main
  fi
}
__git_complete git __git_my_main

git-completion.bash を読み込むと、この内部で __git_complete git __git_my_main を実行しており、git コマンドに対して __git_main 関数を登録していますが、これを自分で定義した __git_my_main に置き換えます。

__git_my_main 内の COMP_CWORD では入力が確定した引数の数、COMP_WORDS では入力途中を含む引数の内容が配列で得られるため、これらを参照して適切な補完を実装すれば完成です²。

---

1. 今回のような既存のサブコマンドの置き換えであれば、実際は何もしなくても補完は効きますが、簡単のためこの例で説明します ↩

2. bash 以外の方は使用しているシェルに読み替えてください ↩

事象 : リポジトリ作成後に初回addを取り消そうとしたら怒られた

• 環境
  • Windows10 64bit バージョン1909
  • git version 2.25.0.windows.1

1. リポジトリを作成
2. 初回add
3. あっ・・・いらないものまでaddしちゃったから取り消そう

$ git reset HEAD .
fatal: ambiguous argument 'HEAD': unknown revision or path not in the working tree.
Use '--' to separate paths from revisions, like this:
'git <command> [<revision>...] -- [<file>...]'

原因 : HEADがないから

そりゃそうだ・・・で、どうしたらaddを取り消せるのか・・・

HEAD
最新コミットのスナップショットで、次は親になる
Git - リセットコマンド詳説

対応 : なにも指定しないでgit reset

参考 : 初心者のGitメモ

$ git reset

# おぉぉ、戻ったぁ
$ git status
On branch master

No commits yet

Untracked files:
  (use "git add <file>..." to include in what will be committed)
        .gitignore
        docs/

nothing added to commit but untracked files present (use "git add" to track)

はじめに

本記事は、ぼくが2020年7月〜10月までに学習した、Ruby及びRailsの内容を振り返るものです。

今年の2月くらいの段階ではHTMLもまるで書けないくらい無知だったのですが、
等の学習サイトや各種記事を参考にさせていただいて、なんとかデプロイまで漕ぎ着けることができました。

なお現在の状況としては、

• 就職活動中（HTMLコーダー職志望）
• 学習を継続し、社内でのエンジニア登用を希望している
• フロントエンドとインフラに関心が強い
• Railsアプリの他に、Web制作に向けたWordPressの学習も行った
• フロント・バックともにそれらサイトで学習の継続を予定

というところです。

制作したアプリケーション

動いている実際のアプリはこちら。
使用言語はRuby、フレームワークはRuby on Railsです。

AWS EC2サーバーにて、

• アプリケーションサーバ ▶︎ Puma
• Webサーバ ▶︎ Nginx
• データベース ▶︎ MySQL

という構成で動いています。

機能は現在

• 映画作品のランダム表示機能
  

• 記事投稿機能
  

以上の2つのみ。
正直ポートフォリオと呼んでいいのかさえ怪しいものではあります。

しかしながら、学習の目標を立てる際は「方向性だけわかるようにして機能は後回し、まずはデプロイまで一通りやる」ということを重点的に考えていたので、その目標自体は達成できました。本当に難しかったので、機能を書くより先にすませられたのは正直ホッとしています。

学習したこと

【1】Webサイトが動く大まかな仕組みについて

Rubyへの理解というよりは、Railsの仕組みに関して学ぶところが多かったように思えます。
フレームワーク側で効率化されている要素がかなり多く、大したRubyの知識がなくても何かしらの動作をするものは作れてしまうのが、すごいところでもあり、逆に油断してしまいそうだという印象です。

RailsはMVCというデザインパターンを採用しており、
「扱う情報を定義したクラス内で処理を記述する」
「SQL文によってデータベースから情報を取得する」
という概要に触れただけでも、Webサイトの動作に必要な処理の大まかなイメージを掴めたのはよかったと思っています。

【2】サーバーとデータベース

ユーザーからのリクエストを処理するWebサーバ（Nginx）と、Webサーバからのリクエストを受けてRailsを実行するアプリケーションサーバ（Puma）など、サーバーサイドの初歩的な技術を体験することができました。

AWS EC2で立てたインスタンスにNginxとPumaをインストールした構成にしており、データベースはRDSを使わずに、直接MySQLをインストールしてRailsと接続しています。

また、ターミナルからコマンドを使用したサーバーへのSSH接続も大変にいい経験でした。
FTPを使わなくてもサーバーに直接ログインし、viコマンドでファイルの書き換えなどを行うことができるようになりました。
作業の安全性を確保する上で、重要な知見になったと思います。

機能が少ない段階で一度デプロイしようと思ったのは、

1. 初めは難しいだろうから、先に乗り越えてしまおうと思ったから
2. 機能を実装しても、Web上で動作できなければ人に見せられないから
3. 一度デプロイしてしまえば、その後はコードを書くことに集中できると判断したから
4. さらにその過程で、Capistorano等の自動デプロイの方法も勉強できるから

というのが理由です。
実際unicornサーバが起動できずに何日も浪費してしまうなど、ローカル環境構築以上につまづくことの多い部分でした。公開が無事に完了しただけでもまずはよかったと思っています。

【3】フロントエンド

JavaScriptはProgateを一周しただけでしたが、少し苦手意識がありました。
処理が軽快になるというメリットもあって、動作させる部分はしばらくCSSアニメーションによって記述していたのですが、結果的にそれはjQueryを理解する大きな助けになりました。

いずれにせよクラスやidを使って直接的に動作を指定するという点では、両者に違いはないと気がつきました。
同時にCSSの場合、モバイル（タップ操作）での動作が厳密には定義されていない部分があり、レスポンシブ対応する上ではjQueryでなければ書けないこともあるのだ、というのも興味深い発見でした。

フロントエンドは現在特に関心を持っている分野であり、今後は基礎的なJavaScriptへの理解をもっと進めていきたいと考えています。
さらに、「jQueryによるDOM操作は規模が大きくなればなるほど面倒が増えていくだろう」という見当もついたため、今後はVue.jsによる柔軟な実装にも対応できるようになりたいと考えており、今後しばらくの学習目標として考えています。

---

今後の学習について

これらの経験を踏まえ、今後の個人学習は以下のような内容を考えています。

1. JavaScriptを初め、RubyやPHPなどの動的型付け言語の基本文法

   1. 復習的な内容にはなりますが、一旦インフラは置いておき、まずはプログラミング言語自体の理解をどんどん深めていきたいです。
   2. JavaScriptの理解から派生して、フロントならVue.jsやTypeScript、バックエンドはPHP等、学習内容を応用しながら順序立てて理解していきます。

2. HTML・CSSに関する更なる理解

   1. HTML5及びCSS3の機能の多さに驚きました。SVG素材がとても使いやすく、音声や動画も簡単に挿入できたり、文字の折りたたみや計算などもHTMLだけで記述できます。CSSではアニメーションをつけたり、Sassによる効率化も可能です。
   2. これらを学習するだけでもレベルアップできますし、併せてJavaScriptの学習も続ければ、すぐに複雑なサイトを作れるようになると思います。

3. デプロイの自動化
   　1.Circle CIやCapistranoを使った自動デプロイももちろんですが、今一番やりたいのはWordPressテーマのソースコードを変更した際、GitHubのmasterブランチにPushした時点で自動的に反映できるようにすることです。
   Railsアプリで同様の自動化を行う入門もかねて、WordPressによるコーディング・フロントエンド学習を効率化したいと考えています。

最後に

7月に前職を退職してから現在に至るまで、学習においては多数の方のお世話になっております。
Qiitaやブログ、オウンドメディア等にあるたくさんの記事を参考にさせていただきましたし、teratailで拙い質問に答えていただいたこともありました。

皆様にはこの場を借りてお礼を申し上げます。