# Git,GitHub講習兼環境構築 ## Gitってなんぞや? Gitとは**バージョン管理システム**の1つ。 そんなこと言われてもわからないかと思うので簡単な例を示しながら説明します。 #### 例 あなたは友達と共同でレポートを書いています。チームからのレポートと自分のレポートをとりあえず1つのフォルダに入れておくことにしました。 するとこんなことになってしまいました。 - レポート.pdf - レポート(最新).pdf - レポート(最新)(修正版).pdf - レポート(田中).pdf - レポート(最新)のコピー.pdf - レポート(令和最新版).pdf このように何も考えずに管理していると,どれが最新のものなのか,誰のものなのか,どんな変更をしたのかが全然把握できないという風になってしまいます。また,先週の編集を無かったことにしたくてもどれが先週の編集かがわからないという問題が発生します。 また,チームで共有しているファイルの場合,複数人で同じファイルを同時に編集していると,先に編集した内容が他の人によって上書きされてしまうといったことも起きかねません。 そのような問題を解決するため,Gitなどのバージョン管理システムが開発されました。 ### Gitの何がうれしいの? Gitを使うと,編集履歴や編集者などの情報を保存することができます。それによって,一度編集したファイルを過去の状態に戻したり,編集箇所の差分を表示したりすることができます。 また,他の人の変更を上書きしようとすると,サーバーから警告が出るため知らないうちに他の人の変更を上書きしてしまうといった事故を防ぐことができます。 ## Gitのインストール ここではWindows(Git BashとWSL)とmacOSの入れ方を解説します。 Linuxユーザーはきっとわかっているはずです。 ### Windows(WSL) 後述のGit Bashを使う方法よりこのWSLを使う方法が後々役に立つと思うのでこちらをおすすめします。ただし,WSLのセットアップを最初から行う場合それなりに時間がかかったり,各々のPCの環境によってはGit Bashを使わざるを得ないことがあるので,自分には難しいかもという人はGit Bashを使う方法をやってみてください(個人的にはWSLでLinuxに慣れてほしい) #### まだWSLの環境構築をしていない人 まず,WSLのセットアップが終わっていない人は弊部の https://d3bu.net/blog/2023-03-arch-on-wsl/ を参考にWSLの環境構築をしてください。 ↑の方法の環境構築なら既にGitはインストールされているので次の初期設定まで飛ばしてください。 #### 他の方法でWSLの環境構築をした人 Ubuntuなど他の方法でWSLの環境構築をした人は,以下のコマンドでGitをインストールしてください。 ```shell $ sudo apt install git ``` これでインストールができます。 諸々の設定が終わった人はターミナルで`git`コマンドを実行してみてください。 gitはこう使うんだよ〜みたいなログが出力されればインストール成功です。 ### Windows(Git Bash) まずは、以下のサイトからGitをダウンロードしましょう。 https://git-for-windows.github.io/ 以下の画面以外はそのままNextを押しまくってください。  ここは真ん中のRecommendedを選んでください。  ここはUse bundled OpenSSHを選んでください。  Checkout Windows-style, commit Unix-style line endingsを選んでください。  Use MinTTY (the default terminal of MSYS2)を選んでください。  Defaultを選んでください。  Git Credential Managerを選んでください。  両方選んでください。  そのままInstallを選択してください。 あとはFinishを押して終わりです。  こんな感じでGit Bashが追加されていれば成功です。 ### macOS Homebrewが入っていない人は https://qiita.com/zaburo/items/29fe23c1ceb6056109fd を参考にインストールしてください。 Homebrewがインストールできたら以下のコマンドを実行してください。 ```shell $ brew install git ``` これでGitがインストールできます。 ## Gitの初期設定 Gitにユーザー名とメールアドレスを登録します。Gitはこの情報を使って誰が編集したかを判断します。 ```shell $ git config --global user.name "<user_name>" $ git config --global user.email "<email_address>" ``` `<>`の中には自分の情報を入れてください。 ## GitHubについて 公式ページにはこう書いています。 > GitHubは、ユーザのみなさんからヒントを得て作成された開発プラットフォームです。 ~~つまりどういうことだってばよ~~ 簡単に言えばGitの仕組みを利用してチーム開発をもっと楽にできるようにしたり,たくさんの人のソースコードを共有できるようにするためのツールです。 Gitを使う上でほぼ必須のツールなので使えるようにしましょう。 ## GitHubの初期設定 ### アカウントの作成 まずアカウントを作りましょう。 以下のリンクからGitHubにアクセスしてください。 [GitHub](https://github.com/) アクセスしたら右上のSign upをクリックし,案内に従ってアカウントを作ってください。 :::info 登録するメールアドレスを学校のrアカウントにしておくと,いろいろな恩恵を受けることができるので,特に事情が無ければ学校のアカウントで登録しましょう。 ::: <details> <summary>恩恵について詳しく</summary> GitHub Proアカウントがもらえます。GitHub CopilotというAIによるコーディング補助が無料で無限に使えます。(月19ドルがタダ) Jetbrainsという会社が作っているIDE(統合開発環境:いわゆる最強の開発アプリ)が全部無料で使えます。(年10万円弱がタダ) みんなマジで活用して。 </details> ### GitHub CLIのインストール GitHub CLIとはGitHub関連の操作をコマンドでできるようにするために入れるものです。今回は認証のために使います。認証以外にも便利な機能がたくさんあるので調べてみてください。 #### macOSの人 ```shell! $ brew install gh ``` これでGitHub CLIがインストールできます。 #### Windowsの人 以下のリンクからインストーラをダウンロードする。 https://cli.github.com/  インストーラを起動し,指示の通りにインストールする。 ### GitHub認証 それでは自分のpcとGitHubアカウントを紐付けていきましょう。 1. `gh auth login`を実行してください。 矢印キーで選択可能(今回はGithub.comを選択し、Enter) ```shell $ gh auth login ? What account do you want to log into? > GitHub.com GitHub Enterprise Server ``` 2. 矢印キーで選択可能(今回は SSH を選択し、Enter) ```shell ? What is your preferred protocol for Git operations? [Use arrows to move, type to filter] HTTPS > SSH ``` 3. Y を選択( 鍵を作りますか?という内容) ```shell ? Generate a new SSH key to add to your GitHub account? (Y/n) ``` 4. 任意でパスワードを入力 ```shell ? Enter a passphrase for your new SSH key (Optional) ``` :::info パスワードを設定すると毎回接続時にパスワード入力が必要になるため,個人用端末ならば無しでも構わない。共有端末ではパスワードを設定することを推奨する。 ::: 5. 鍵の名前を入力してください。 ```shell ? Title for your SSH key: (GitHub CLI) ``` ここでEnterを押すと鍵が生成されます。 6. 矢印キーで選択可能(今回は Login with a web browserを選択) ```shell ? How would you like to authenticate GitHub CLI? [Use arrows to move, type to filter] > Login with a web browser Paste an authentication token ``` 7. ここでone-time code: *****をコピーしてEnterを押下 ```shell ! First copy your one-time code: *******( Press Enter to open github.com in your browser... ``` 8. ブラウザ上の githubログイン画面に遷移するので、ログインする。 9. ログインが完了すると、次の画面が表示されるので手順7のワンタイムコードを入力する。  10. 入力が完了すると、次の画面が表示されるので、画面左下の"Authorized github"を選択する  これであなたのPCとGitHubが繋がりました。 ### リポジトリについて リポジトリとは、ファイルやディレクトリの状態を記録する場所です。保存された状態は、内容の変更履歴として格納されています。変更履歴を管理したいディレクトリをリポジトリの管理下に置くことで、そのディレクトリ内のファイルやディレクトリの変更履歴を記録することができます。 単刀直入に言うと**コード置き場** 今回は時間がないのでとりあえず開発の流れを説明する ### 開発の流れ まずGitHubにあるリポジトリ(これをリモートリポジトリという)を自分のPC上(ローカル)に持ってくる。 対象のリポジトリのURLが必要。  赤枠の部分のURLをコピー ``` git clone リポジトリのURL ``` これで今いるディレクトリに**リポジトリ名のディレクトリ**が作られる。 次にチーム開発する上で必要な**ブランチ**という概念について説明する。 ### ブランチについて 「ブランチ」は、日本語で「枝(えだ)」という意味です。Gitでは、作業を別のルート(枝)で行うことができるのです。たとえば、あるゲームを作っている途中で、新しいキャラクターを追加したいけど、元のゲームはそのまま動かしておきたいとします。そんなときにブランチを使います。 #### 具体的なイメージ 「メインの道」を歩いていると想像してください。このメインの道が「main(メイン)」というブランチです。ここでは今まで作ったものがきちんと動いています。 でも、新しいキャラクターを試してみたいと思ったら、このメインの道から「横道(ブランチ)」を作ります。この横道では、安心して新しいキャラクターを追加したり、変更したりできます。横道でいろいろ試してみて、うまくいったら、その横道をメインの道に「合流(マージ)」させます。もしうまくいかなかったら、横道の変更だけを捨てて、元の道に戻ることができます。 #### ブランチを使うメリット 安全に実験できる:新しい機能を試すとき、メインのブランチを壊す心配がありません。 チームで作業がしやすい:各メンバーが別のブランチで作業して、後でその成果を一緒にまとめることができます。 とGPTさんは仰っていました。わかりやすいですね。 ということで実際にブランチを使った開発の流れを説明します。 #### ブランチの切り方 完成品があるブランチ(大体`main`か`master`か`develop`)からブランチを作ることをブランチを切ると言ったりする。 例: `master`からブランチを切る ブランチを切る時は ``` git branch ``` を実行して自分がどのブランチにいるか確認する。緑になっているのが今いるブランチ 完成品があるブランチにいない場合は ``` git checkout master ``` などで完成品があるブランチにいく ``` git checkout -b ブランチ名 ``` で`master`ブランチからブランチを切れる。 #### ブランチ名の付け方 ブランチ名には日本語は入れずにアルファベット、ハイフン(`-`)、アンダーバー(`_`)のみを使用する ##### 機能追加 `feat`、`feature`などの接頭辞(prefix)を付ける。この開発では`feat`を使う(と思う) 例えば、コメント機能を追加する場合は ``` feat-add-comment ``` みたいな感じで作る ##### 修正 `fix`の接頭辞を付ける このへんの命名規則は場所によって違うと思うので参考程度 ## 開発の流れ 簡単に言うと 0. master(develop)ブランチから`git pull`して最新の変更をローカルに取り込む 1. `git checkout -b ブランチ名`で作業用のブランチを切る 2. コードを書く 3. `git add`して編集内容をgitに伝える 4. `git commit`してその変更を保存する 5. `git push`して保存した変更をリモートに反映する 6. GitHubで自分のブランチのPull Requestを作成する 7. レビューしてもらう 8. master(develop)にマージ という流れ。 それぞれGPTさんに説明してもらう。 --- ### 0. master(develop)ブランチから`git pull`して最新の変更をローカルに取り込む まず、最新の状態で作業するために、**master**や**develop**ブランチから最新の変更を取り込みます。 **コマンド**: ```bash git checkout master # masterブランチに移動 git pull origin master # 最新の変更を取り込む ``` または**develop**ブランチの場合は以下のようにします。 ```bash git checkout develop git pull origin develop ``` --- ### 1. `git checkout -b ブランチ名`で作業用のブランチを切る 次に、新しい作業用ブランチを作成して、そのブランチに移動します。ブランチ名には、作業内容がわかるような名前をつけるとよいでしょう(例: `feature/add-login-page`)。 **コマンド**: ```bash git checkout -b feature/add-login-page # 新しいブランチを作成してそのブランチに移動 ``` --- ### 2. コードを書く ここで、プログラムの変更や新しい機能の追加などの作業を行います。この作業は、自分が今いる新しいブランチで行われます。 --- ### 3. `git add`して編集内容をGitに伝える 作業が終わったら、その変更をGitに伝えるために「git add」を使います。 **コマンド**: ```bash git add . # すべての変更を追加 ``` 特定のファイルだけ追加したい場合は、そのファイル名を指定します。 ```bash git add ファイル名 ```  `git status`でどのファイルがaddされてるかされてないか確認できる。 --- ### 4. `git commit`してその変更を保存する 変更をGitに伝えたら、その変更をコミットしてGitに保存します。コミットには作業内容がわかるようなメッセージをつけましょう。 **メッセージは必ずつけるように!!!!!!** **コマンド**: ```bash git commit -m "ログインページを追加" # 変更内容の説明を追加 ```  --- ### 5. `git push`して保存した変更をリモートに反映する コミットした変更を、GitHubなどのリモートリポジトリに反映させます。 **コマンド**: ```bash git push origin feature/add-login-page # 自分の作成したブランチをリモートに送る ``` --- ### 6. GitHubで自分のブランチのPull Requestを作成する GitHubに行って、自分の新しいブランチ(例: `feature/add-login-page`)に対して**Pull Request(PR)**を作成します。PRでは、変更内容や追加した機能についての説明を書き、他のメンバーにレビューを依頼します。  赤枠のボタンを押せばOK  --- ### 7. レビューしてもらう チームメンバーやリーダーがPull Requestを確認し、コードが問題ないかをレビューしてもらいます。必要に応じて修正を加えたり、コメントに対応したりします。 --- ### 8. master(develop)にマージ レビューが完了して、問題がなければ、Pull Requestをマージします。マージされると、あなたの変更が**master**や**develop**ブランチに反映され、正式なプロジェクトの一部になります。 GitHub上で「マージ」ボタンを押してマージするか、以下のコマンドで手動で行うこともできます。  <!-- アーカイブ ### GitHubにSSHキーを登録する GitHubでは認証のため,SSHキーを登録する必要があります(いわゆる公開鍵認証)。その設定をやっていきましょう。 まずターミナルでホームディレクトリまで移動してください。 そこに`.ssh`ディレクトリがあるか確認してください。無い場合は作成してください。 作成したら`.ssh`ディレクトリまで移動してください。ここに鍵を作っていきます。 以下のコマンドを実行してください。 ```shell $ ssh-keygen -t ed25519 ``` このコマンドを実行するといろいろ出てくるので全部Enterを押してください。 :::info 共有PC等を使っている方はパスワードを設定しておいたほうがいいかもしれません。 ::: これで鍵が作れます。 では`id_ed25519`と`id_ed25519.pub`が生成されていることを確認してください。 ここで,**必ず`.pub`が付いている方**をコピーしてください -->
×
Sign in
Email
Password
Forgot password
or
By clicking below, you agree to our
terms of service
.
Sign in via Facebook
Sign in via Twitter
Sign in via GitHub
Sign in via Dropbox
Sign in with Wallet
Wallet (
)
Connect another wallet
New to HackMD?
Sign up