30歳未経験からのITエンジニア

GitHub の基本操作

  • GitHub
    •

    今回は、GitHubです。この記事を書けるようになるまで長かったですね～。

    独学でGitHubの勉強をするのは結構、大変じゃないかなと思いました。なにせ、仲間がいないですから全ての操作をこなすには、一人三役くらいでやらないといけません。

    実施した内容を図にすると以下のような感じです。

    github-10

    それでは、詳細について解説していきたいと思います。

    GitHub基本操作の手順

    最初にレポジトリを作成すると、master が自動的に作成されます。新たに develope を作成してデフォルトレポシトリに指定します。

    その後、ローカルに develope を clone して feature/test ブランチを作成して add , commit , push , pull request , merge をしました。

    1. アカウント作成

    まずは、GitHub アカウントを2つ用意します。メインの pull request をレビュー・マージするメインアカウントと、作業用アカウントです。

    2. ブランチ『 develope 』を作成

    下記のブランチのボタンを押すとプルダウンが表示され、作成したいブランチ名を入力して Enter を推すと作成されます。

    github-10

    develope ブランチを作成したら、デフォルトブランチに設定します。

    設定方法は、 setting > branch > Default Branch で develope をデフォルトに設定して update すれば完了です。

    ローカルでの作業

    さあ、ここからはローカル PC での作業です。

    ローカルで GitHub を使えるようにするためには Git をダウンロードしておく必要があります。

    ※ダウンロード方法など、一つ一つ細かく書いていくと長くなってしまいますので省略気味にいきます。

    1. config 情報を更新しておく

    remote repository に push したときに、名前などが表示されますので、きちんと自分の名前が表示されるように設定しておく必要があります。

    git config --local user.name aqua-systems git config --local user.email attsun1031@gmail.com git config --local -l # 設定内容を確認

    2. ローカル作業　clone / branch

    以下のコマンドでローカル上に GitHub のデータを持ってきて、作業用ブランチを作成します。

    git clone -b develope https://github.com/atsushikoizumi/Twemily.git git branch feature/test # ブランチ feature/test を作成 git branch # ブランチの一覧表示 * develope feature/test git checkout feature/test # ブランチの移動 git branch # ブランチの一覧表示 develope * feature/test

    3. ローカル作業 git add / git commit

    編集内容は何でも良いのですが、今回は Readme.md の内容を修正しました。

    github-10

    これを add して commit しましょう。

    git add README.md git commit

    git commit を入力すると、vim の編集画面に遷移します。そこで、コメントを残しておきましょう。

    一般のプロジェクト開発では、コミット履歴を参照して、これまでにどんな変更を加えてきたか、どんな機能を追加してきたか確認することがあります。

    その際にコミット履歴のコメントが役立ちます。必ず、作業内容が明確に伝わるような内容を意識して残しておきましょう。

    会社ごとにマナーは異なるようですが、タイトルは50文字以内、1行空けてから詳細を書くのですが、詳細の説明は70文字以内で改行すると良いらしいです。

    Readme.md にコメント記入 github-10.png をアップロード GitHubの調査のため、基本操作を実践した。その概要をReadme.mdに記載した。 また、Readme.mdに画像を載せるため、github-10.pngも同時に追加した。 :wq

    4. remote に push

    では、ローカルでコミットした内容を remote に push しましょう。この時、直接 develope に push するのではなく、remote の feature/test に push します。

    そうすると、remote で新たに feature/test が作成されることになります。

    git push origin feature/test:feature/test Enumerating objects: 5, done. Counting objects: 100% (5/5), done. Writing objects: 100% (3/3), 271 bytes | 67.00 KiB/s, done. Total 3 (delta 0), reused 0 (delta 0) remote: remote: Create a pull request for 'feature/test' on GitHub by visiting: remote: https://github.com/atsushikoizumi/Twemily/pull/new/feature/test remote: To https://github.com/atsushikoizumi/Twemily.git * [new branch] feature/test -> feature/test

    再び GitHub のブラウザ画面に戻る

    変更内容が push できたら、作業用アカウントでの GitHub のブラウザ画面での操作になります。

    1. pull request

    作業用アカウントで GitHub のブラウザにログインすると、『 Compare & Pull request 』というボタンが表示されていますので、実行します。

    title

    メッセージ、Reviewer、Assigness、Labels などを入力し、『 Create pull request』を実行します。

    title

    2. Review

    Reviewer にメッセージが届きます。私の場合、以下のようなメールが届きました。

    title

    通知方法は Webhook で slack に飛ばしたりとカスタマイズが可能です。

    メールの内容にあるリンクから、対象の pull request の画面に遷移します。

    title

    内容が問題ないかレビューします。問題なければ、approve（承認）します。すると、作業用アカウントのメールアドレスにメッセージが届きます。

    title

    3. feature/test から develope に merge

    approve すれば、後は merge するだけです。以下が、merge 後の状態のキャプチャです。

    title

    pull request の画面では以下のようになっています。

    title

    これで、Delete Branch を実行すれば一通りの作業が終了です。

    最後にローカルで後始末

    remote repository では feature/test ブランチは削除されましたが、ローカルでは削除されていません。

    また、ローカルの develope は更新されていません。

    以下のコマンドでローカルの状態を更新します。

    git checkout develope # develope に移動 git diff develope origin/develope # remote との差分を確認 git pull origin develope:develope # remote のデータを pull git branch -d feature/test # feature/test を削除 git log # commit 履歴を確認

    以上で、GitHub の基本操作を終わります。

    個人開発に向けて

    今回の作業は、個人開発（ポートフォリオ作成）に向けて GitHub の基本的な扱いを習得するために実施いたしました。

    実際には、コンフリクトの解消など、まだまだ確認すべき GitHub の操作もあります。

    そういったことも、個人開発の中で試していきたいなと思っています。

  • GitHub
    •