LoginSignup
15
13

More than 3 years have passed since last update.

【超初心者向け】GitHubってなんじゃい【Gitすら分からん】

Last updated at Posted at 2020-01-27

※後半からはmac向け記事です

  1. Gitすら分からない(リポジトリ?クローン?何それおいしいの?)
  2. GitHubが分からない
  3. GitHubの操作が分からない
  4. とにかくやってみたいけど何からやればいいかすら分からん

そんな人たち向けの記事です。
本当に基本的な用語を確認したのち、一緒に手を動かしながらGitHubの基本操作をできるようにしましょう。

そもそもGitってなんじゃい

Git = 分散型バージョン管理システム

ファイルを更新していく際、それらを編集前の状態に戻したい場合や、今まで作成したものを残しておきたい場合、最も手軽なのはファイルをいくつもコピーして残しておいて、更新するたびに新たなファイルに日付をつけて更新していくというのがあります。
スクリーンショット 2020-01-25 11.48.28.png
これでは何がなんだか分からん!!
誰が更新したものなのか、いつ更新したものなのか、何が更新されたのか分からん!!
そもそもどれが最新のものかも分からん!!

しかもうっかり共通フォルダで複数人が同時に作業した場合には、後から更新した人の上書き保存によって先に作業していた分が消えてしまうという悲劇も起こりかねません。

これらの問題を解決するものがGitです。

Gitを用いたバージョン管理

Gitでは、ファイルの状態を好きなときに更新履歴として保存しておくことができます。そのため、一度編集したファイルを過去の状態に戻したり、編集箇所の差分を表示したりすることができます。

また、古いファイルを元に編集したファイルで、他人の編集した最新ファイルを上書きしようとすると、サーバにアップロードした時に警告が出ます。そのため、知らず知らずのうちに他人の編集内容を上書きしてしまうといった失敗は起こりません。

チームで作業するならGitでコード管理しよう!

Gitの仕組み

どうやって履歴を管理するの?

リポジトリ

Gitにおいて、ファイルやディレクトリ(フォルダ)の状態を記録する場所をリポジトリといいます。
情報工学において、仕様・デザイン・ソースコード・テスト情報・インシデント情報など、システムの開発プロジェクトに関連するデータの一元的な貯蔵庫を意味する言葉です。

まず、Gitのリポジトリは、リモートリポジトリとローカルリポジトリの2種類に分けられます。その二つから理解していきましょう。

ローカルリポジトリ

ユーザ一人ひとりが利用するために、自分の手元のマシン上に配置するリポジトリ
普段の作業はここ。手元でコード編集などを行います。
自分の手元にローカルリポジトリを作成する方法は二種類あり、一つ目は全く新しいリポジトリを作成する方法、二つ目はリモートリポジトリをコピーして作成する方法です。
具体的にはリモートリポジトリからCloneしてきたところに作られるClone毎のリポジトリとかなんとかあるのですが作成方法については後ほど。

リモートリポジトリ

チームのみんなで共有するためのリポジトリ
ローカルリポジトリで作業した内容はリモートリポジトリにアップロードすることでチームのみんなに公開することができます。また逆にリモートリポジトリにおいてある他の人の作業内容を手元にダウンロードすることもできます。

覚えておきたい言葉

Push(プッシュ) ローカルリポジトリからリモートリポジトリにデータをアップロードすること
Clone(クローン) リモートリポジトリの状態を丸ごとローカルリポジトリにコピーすること
Pull(プル) リモートリポジトリからローカルリポジトリを更新すること
Commit(コミット) ファイルやディレクトリの追加・変更を、リポジトリに記録する操作

超簡単に言うとこんな感じです。

commit → ゲームのセーブ
push → 現在のセーブデータをサーバに保存
Clone → セーブデータを保存してるサーバーの内容を丸々ローカルにコピー
pull → Cloneしたデータを最新の状態に更新

Gitは親切なので、いきなりセーブデータをアップロードして他の作業者とデータがかち合ったり、何が作業前との変更点なのか報告させたりするステップを用意させています。
またバグ修正など軽微な変更をする際には頻繁にコミットを行って、何かあったときにすぐに昔のデータをロードできるように細かくセーブしておくことも大切です。ゲームと一緒ですね。

GitHubが分からない

GitHubとは

GitHubは、ソフトウェア開発のプラットフォームであり、ソースコードをホスティングする。コードのバージョン管理システムにはGitを使用する。(Wikipedia)

よく分かりませんね。
分からない時にはとりあえずやってみよう、ということで数ステップに分けて一緒に初めてのGitHubやっていきましょう。

GitHubをweb上で触ってみよう

Gitはターミナル上で操作することも可能ですが、GitHubを使うとより直感的にGitを操作することができます。まずはここから慣れていきましょう。

Step0 アカウントを作る

これがなければ始まらない。とりあえずアカウントのない方は作ってきてください。
【2019年1月現在】GitHubアカウント作成方法

Step1 リモートリポジトリを作る

GitHub上にリモートリポジトリを作成してみましょう。
左上のgithubの猫ちゃんマークをクリックするとリポジトリの新規作成ボタン(Newボタン)が現れるのでクリック
スクリーンショット 2020-01-25 13.27.20.png
各項目を入力しCleate Repository
スクリーンショット 2020-01-25 13.33.38.png
* Repository name 作成するリポジトリの名前。スペースがあっても大丈夫。
* Description 作成するリポジトリの説明
* Public/Private 作成するリポジトリを公開するか、非公開にするかを選択
* Initialize this repository with a README リポジトリーにアップするコードの説明書を作成するか。できるだけ作っておきましょう。作成するとDescriptionに書いた説明が自動的に反映されます。

この画面になったら作成完了
スクリーンショット 2020-01-25 13.48.55.png

Step2 リモートリポジトリにファイルを追加してみよう

簡単な方法はCleate new fileから直接コードを書き込むか、Upload fileから手元にあるファイルをアップすること。まずは何か作ってみましょう。

今回はtest.txtを作成しました。
スクリーンショット 2020-01-25 18.36.24.png
作成したらコミットしてみましょう。
スクリーンショット 2020-01-25 18.37.10.png
上の行は何をしたか(何も書かなければ適当に追加してくれます)
下の行は詳しい説明を書き加えられます。
記入できたらCommit directly to the master branch.を選択しCommit new fileをクリック

これで新しいファイルを追加できました。

Step3 変更を加えてみよう(Commit)

先ほど作成したファイルに少し手を加えてセーブ(コミット)してみましょう。
test.txtを選択し右にある鉛筆アイコンをクリックすると編集できます。
適当に編集したらCommit directly to the master branch.を選択しCommit new fileをクリック。
これでコミット完了です。
スクリーンショット 2020-01-25 18.51.05.png

Step4 branchを使ってみよう

さっきは変更をそのまま適用しましたが、実際にチームでプロジェクトを進めていく場合にはいきなりオリジナルのコードに変更を適用するのはリスクがあります。そこでブランチ(branch)機能を使うことで一度本番のコードとは別に変更を加えて、後からチームのレビューを行ったのち本番のコードに変更を適用することができます。

もう一度鉛筆アイコンをから編集してみましょう。
編集が完了したら今度はこちらにチェックマークをつけてコミット。
スクリーンショット 2020-01-27 12.59.32.png
こうすることでoozzZZZZ-patch-1というブランチが生成され、本番のコードとは別に開発を進めることができるようになります。

また、コミットするとこちらの画面に切り替わります。これはPull requestです。スクリーンショット 2020-01-27 13.05.24.png
ブランチで行った開発に不具合がなさそうならPull requestを作成することでプロジェクトのコード検証者にチェックしてもらう要望を送ることができます。今回はあなたが責任者なのでCreate pull requestをクリックし、遷移した画面でMarge pull requestをクリックしてください。Marge(マージ)することで、枝分かれ(ブランチ)した開発を本番のコードと統合することができます。

ところで画面上のタブにInsightsがあるのでそこをクリック、そしてNetworkをクリックしてみてください。
するとNetwork graphがみられると思います。枝分かれ(branch)した開発が本番のコード(master)統合(Marge)されているのがわかると思います。
スクリーンショット 2020-01-27 13.16.56.png

以上で簡単なGitHub上での開発の流れとGitの大まかな仕組みについてはわかったかと思います。
今度はGitHubのようなリモートリポジトリでの操作ではなく、あなたのPC上にローカルリポジトリを作成し、ローカルリポジトリでのClonePullCommitPushを行っていきましょう。

ターミナルからGitを操作してみよう(Mac)

これまで私たちはGitHubの画面を通じて直接リモートリポジトリにアクセスし、ファイルの変更や追加を行ってきました。
次のステップでは自分のマシンにローカルリポジトリを作成し、リモートリポジトリからファイルをダウンロードしたり、逆にアップロードする方法について学んでいきましょう。

簡単のために、今回はあなたのマシンのデスクトップ上にテスト用のディレクトリを作成し、そこにリモートディレクトリの内容をクローン。そこでファイルの変更を行いコミットし、最後にリモートディレクトリにプッシュしてみましょう。

Step1 Cloneしてみよう

今回は先ほど作成したGitHub上のリモートリポジトリをあなたのマシンにCloneしてみましょう。

まずデスクトップにディレクトリを作成します。
ターミナルを開いてください。

cd desktop

を入力してください。cdはUNIXコマンドと言って、macやLinuxなどUNIX系のマシンを操作するためのコマンドです。
たくさんありますがよく使うところから慣れていきましょう。cdはCurrent Directryで、ターミナルで触る場所に移動することができます。cd desktopならデスクトップに、cd documentsならドキュメント(書類)に移動します。

次はデスクトップにtestという名前のフォルダを作り(make directry mkdir)、そこに移動します(cd test)。

mkdir test
cd test

あなたのPCのデスクトップ上にもtestという名前のフォルダが生成されていますね。

次はここにGitHubに作ったリモートリポジトリーをクローンしましょう。
まずスクリーンショット 2020-01-27 14.16.14.png
GitHubのページのここからURLをコピーしてきてください。
できたらターミナルに

git clone [URLをペースト]

を入力してください。(もしGitHubからログインを求められた場合はアカウントとパスワードを入力してください)
するとデスクトップ上のtestフォルダの中にリモートリポジトリ上のファイルがコピーされています。

Step2 ファイルを開いてみよう

 testディレクトリの中に生成されたMy-New-Repositoryに入り、test.txtを開いてみましょう。
txtファイルの中身を確認するコマンドはmoreです。

cd My-New-Repository
more test.txt

先ほど作成したtxtフィイルの中身を閲覧できます。
もう一度Enterキーを押せばファイル閉じられます。

Step3 pullを使ってみよう

もう一度GitHubに戻り今度はtest2.txtを作成してみてください。記述は何でもいいです。
作成できたら再びURLをコピーしターミナルで

git pull [URLをペースト]

してみてください。するとあなたのデスクトップのディレクトリにもtest2.txtが追加されていると思います。pullを使うと更新することができます。

Step4 ファイルを作成してみよう

次はマシンのローカルディレクトリからファイルを作成し、GitHubのリモートディレクトリに変更内容を反映させてみましょう。

ファイルを新規作成するUNIXコマンドはtouch ファイル名ですので、

touch test3.txt

と入力することで新しいtxtファイルtest3.txtが作成されました。確認してみてください。
ちなみに、現在のディレクトリのファイル一覧を表示するコマンドlsを入力すれば、ターミナルからも確認できます。

ls

----------
README.md   test.txt    test2.txt   test3.txt

Step5 ローカルディレクトリに変更内容をコミットしよう

GitHubでも行ったように、ローカルディレクトリでも変更や追加、修正を行った場合には細かなセーブ(コミット)が必要です。コミットはgit commit -m "コメント"で行えます。(コメントはちゃんと書こうね!!)

git commit -m "test3,txtを 追加しました"

ちなみにこれまでのコミット内容はgit logコマンドでチェックできます。

Step6 ローカルディレクトリでの変更内容をリモートディレクトリに反映させよう(Push)

まずは準備をします。Gitの変更を反映させるためにはまずindexにファイルを追加する必要があります。

git add .

これで現在のディレクトリ(My-New-Repository)以下がindexに追加されます。

これをリモートリポジトリに反映させます(Pushします)。
今回はブランチなどせずmasterの更新として反映させます。

git push -u origin master

これでPush完了です。GitHubに戻りページを更新してみると新たなファイルが追加されていることが確認できます。

Step7 新たなブランチとしてpushしてみよう

もちろんGitHubで行った時と同様、いきなりmasterに変更を加えるにはリスクがありますので、今回の変更をブランチとしてpushすることも可能です。

新しいブランチを作成するには次のコマンドを入力します git checkout -b 作成するブランチ名

git checkout -b testbranch

作成したtestbranchにPushするには

git push -u origin testbranch

これで完了です。GitHubから確認してみてください。

終わりに

以上でGitの簡単な使い方についてでした。
ここまで記載した一連の流れを踏めばある程度Gitの流れは確認できると思います。
あとはもう自分で好きなように今回作成したリポジトリを機能のテストなんかに使えばいいと思います。

慣れてきたらこっちにもチャレンジ!!(Qiita記事)
git100本ノック

15
13
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
15
13