Git / GitHubの学習記録と小さなTips

今回はGit、Githubをどのように学んだのかについて記録しておきたいと思います。また、学習の過程でつまずいたことについてもお話していきます。

ちなみに、GitやGithubは学校の制作実習で軽く使ったことがありますが、よく理解はできていません。

今回の学習を通してより理解できたので、気になる方はぜひ読んでみてください。

# 学習の動機

今回私がGitとGithubについて学んだ理由は以下の通りです。

:::note info
- 転職の際のポートフォリオとして使いたいから
- 実務で活かせるようにしたいから
- 開発効率を上げたいから
- 自分が開発したモノを綺麗に管理したかったから
:::

# 前提知識と環境

**前提知識**
- Gitの基本操作（clone, commit, push）を軽く知っている状態。
- 自分だけで一から環境を作れない状態
- Git FlowやGitHub Flowというものは知らなかった（GitとGithubについて学習するうちに知った）

**環境**
- Windows 11
- VSCodeを使用

# 学習プロセス
今回は主にYouTubeを使用して学習し、わからないことをひたすらChatGPTに聞きまくりました。

参考にした動画以下の動画です。

**1個目**
<iframe width="560" height="315" src="https://www.youtube.com/embed/Zpw-XFydjUc?si=zgvTmIbWef4OWq3G" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>

この動画は、GitとGitHub、Git Flowについて学ぶことができ、且つ個人開発でこれらをどうやって使うのかがハンズオン形式で学べるものでした。

**2個目**
<iframe width="560" height="315" src="https://www.youtube.com/embed/Dz95iUNt-fg?si=R9GeaKYjnlZKseFI" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>

こちらの動画では、


- 「GitHubの初期設定」
- 「すでにPC内にあるソースコードをGitHub上で管理したい場合」
- 「すでにGitHub上で管理されているソースコードをPC内にダウンロードして編集したい場合」

などについてハンズオン形式で学べるものでした。

ただし、こちらではGit Flowについてあまり詳しく説明されておらず、GitHub Flowのやり方について説明されていました。

:::note info
**Git FlowとGitHub Flowの違い（理解が間違っていたらすみません）**

Git Flowはmainとdevelopを基本ブランチとして、そこからfeature, release, hotrixなど多数のブランチ使い分けます。

一方、Github Flowはmainを基本ブランチとして、そこからfeatureブランチのみを使用して開発を行っていきます。

**下の方でも詳しく説明しています。**
:::

# 躓いたこと＆小さなTips

## つまずき①：リモートにプッシュしようとしているアカウントが **GitHubのリポジトリ所有者と異なることでエラーの発生**

**実行したコマンド**
```
git push -u origin main
```

**発生したエラー**
```
remote: Permission to アカウント名①/リポジトリ名.git denied to アカウント名②.
fatal: unable to access 'https://github.com/...': The requested URL returned error: 403
```
**原因**
これは、GitHubのアカウントを複数持っており、リモートにプッシュしようとしているアカウントがGitHubのリポジトリ所有者と異なることで発生しました。

**解決方法**
以下の手順で解決しました。

- 本来使いたいアカウントでGithubにログインできているかを確認
- Gitの認証情報を修正する（HTTPS認証キャッシュの削除）
    - `rundll32.exe keymgr.dll,KRShowKeyMgr`このコマンドをコマンドプロンプトで実行。
    - 「ユーザ名およびパスワードの保存」という画面になる
    ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3909660/327612f9-4ab7-40de-8ab8-767abb4bf7bc.png)

    - 表示されたリストの中から以下に該当するものを削除
        - `git:https://github.com`
        - `git@github.com`
        - `github.com`
- パーソナルアクセストークン（PAT）を使って再認証
    - Githubに使いたいアカウントでログイン
    - 新しいトークンを発行（repo権限にチェック）
    - 再度 push すると、Gitが「ユーザー名とパスワード」を聞いてきます
    - ユーザー名 → 任意
    - パスワード → 発行したトークン（コピー貼り付け）

## つまずき②`apt-get install git-flow`の意味

ここでは、先ほど1個目に紹介した動画の中でライブラリのインストール「apt-get insatall git-flow」をしてくださいと言っていたことについて説明します。

**解説**

　apt-getはLinux用のパッケージ管理コマンドで、WindowsではWSL（Windows Subsystem for Linux）を使って実行する必要があります。

**手順**
以下のような手順でインストールすることができます。
- WSL(Ubuntuなど)が入っていることを確認
    - 入っていない人は下の記事を参考に入れてください

https://and-engineer.com/articles/Y-LnkhAAACUAb9Z9#heading3-3
- Ubuntuアプリを起動（Windowsに標準に入っていることも）
- Ubuntu上で以下を実行。実行後にパスワードを聞かれるかもしれません。入力してEnterでOKです（入力中に画面に表示されなくても大丈夫！）。
```
sudo apt-get update
sudo apt-get install git-flow
```
:::note info 
**WSLとubuntuとは？**
**WSL：** Windows上でのLinuxの環境を動かすための仕組み。
**Ubuntu：** Linuxディストリビューション（ソフトウェアの配布みたいな意味）の一つ
::: 

### 小さなTips：git flow feature pulish ブランチ名とgit push origin ブランチ名の違い
`git flow feature pulish ブランチ名`
`git push origin ブランチ名`
の違いがよく分かっていなかったが、今回の学習を通して理解できた。

前者（`git flow feature pulish ブランチ名`）は、ローカルで作成したfeatureブランチをリモート側に公開（作成）するコマンド。

そして、後者(`git push origin ブランチ名`)はすでにリモート側に目的のfeatureブランチが存在する場合のみ使用でき、ローカル側で加えた変更を反映させるために使う。

つまり、リモート側にfeatureブランチを始めて反映させるときにはpublishを使用し、2回目以降（変更を加えた後）はpushを使用するということ。

# 得られた気づき
## Git FlowとGitHub Flowについて
今回、GitとGitHubについて学んでいく中で、Git Flowという考え方とGitHub Flowという考え方があることを知りました。ここでは、軽くそれぞれがどういうものなのか簡単に説明します。

Git Flowはmain(master, 本番用)とdevelop(開発用)ブランチがあり、ルールに従っていろいろな種類の作業ブランチを管理します。

こうすることで、大規模開発を効果的に進めることができるそうです。ただし、個人開発をする人にとっては手順が多く、使いづらい点がデメリットです。

![スクリーンショット 2025-06-07 215025.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3909660/f98867d3-788c-4693-a6a3-2cefa9af58ce.png)

>引用：https://nvie.com/posts/a-successful-git-branching-model/

一方で、GitHub Flowはdevelopブランチを使用せず、mainブランチとFeatureブランチのみを使用して開発を進めます。

そのため、Git Flowよりも学習しやすく、スピード感をもって開発を進めることができます。

個人的にも、今後はGitHub Flowで開発を進めていきたいなと考えています。

## その他
その他にも、今回の学習では以下のことが分かったので記録として残しておきます。

- アカウント管理は重要
- VSCodeを使用すれば、煩わしいコマンド操作がなくなるが、ときにはコマンド操作を行うことで今自分が何をやっているのかを把握するのは大事

# 次のステップ

今後は、個人開発の中でGitHub Flowを使用することで、Git&Githubの使い方をマスターしていきたいと考えています。また、以前学習したPythonの知識をもとに個人開発を進め、随時技術ブログも更新していきたいと思います。

興味のある方はこちらの記事も読んでみてください。

https://qiita.com/Yu-Yu0308/items/f05992ea196de2966b6d