Upgrade to PRO for Only $50/Year—Limited-Time Offer! 🔥

[GitHub勉強会資料 CLI版]How To Use GitHub In CLI

[GitHub勉強会資料 CLI版]How To Use GitHub In CLI

[初めに]
プログラマーなら誰しも使うアプリGit・Githubを簡単に一時間程度で学ぶことができるHowToものを作成しました。
ぜひこのスライド用いてGitの基本の機能を使って、学んでもらえると嬉しいです。

[ターゲット]
・GitやGithubを知らないプログラマ初学者。
・ターミナル操作はある程度慣れていると良いが、特にその技能がなくても使えるように作成しました。
・Gitを使う流れやなぜ使うかを知りたいかた。

[内容]
1. バージョン管理ツールとはなにか?
2. Gitのインストール
3. GitHubアカウントを作成しよう
4. Gitの初期設定を行う
5. VSCodeの初期設定
6. Gitの基本的な流れ
7. 実際にcommitまでやってみる
8. ファイルの変更を行ってみる
9. ブランチを切ってみる
10. チェックアウトをしてみる
11. プルリクをしてみる

harutiro

June 01, 2022
Tweet

More Decks by harutiro

Other Decks in How-to & DIY

Transcript

  1. お品書き 1. バージョン管理ツールとはなにか? 2. Gitのインストール 3. GitHubアカウントを作成しよう 4. Gitの初期設定を行う 5.

    Gitの基本的な流れ 6. 実際にcommitまでやってみる 7. ファイルの変更を行ってみる 8. ブランチを切ってみる 9. チェックアウトをしてみる 10. プルリクをしてみる 2
  2. このスライドの見方(CLI) 3 $ brew -v > Homebrew 3.5.4 $が書いてある場合は入力して欲しいコマンドです >

    が書いてある場合は出力される結果です $ git config >-global user.name "ユーザー名" “〜〜〜”と書いてある時は〜〜〜だけ入力してください
  3. Gitをインストールしてみる(Mac) $ brew install git $ git -v > git

    version 2.37.0 バージョンが帰ってきたらインストール 完了です。 13
  4. Topic! Brewが入っていない方へ。 $ /bin/bash -c "$(curl -fsSL https:>/raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)" $ echo 'eval

    $(/opt/homebrew/bin/brew shellenv)' >> ~/.zprofile $ eval $(/opt/homebrew/bin/brew shellenv) & brew -v > Homebrew 3.5.4 > Homebrew/homebrew-core (git revision 7d69acd3065; last commit 2022-07-13) > Homebrew/homebrew-cask (git revision ce084d024b; last commit 2022-07-13) Brewが入っていない方は上の3行を貼り付けてみましょう!! 14
  5. ローカルとリモートの紐付けする設定 33 リモート ローカル • SSHキー • ユーザー名 • メールアドレス

    ローカル側とリモート側を紐づけるためにSSHキー、 ユーザー名、メールアドレスを用いる この内容を用いて、ソースコードに自分が書いた 情報を付け加える
  6. ユーザー名とアドレスを登録する $ git config --global user.name "ユーザー名" $ git config

    --global user.email "メールアドレス" $ git config user.name > “ユーザー名” $ git config user.email > “メールアドレス” 37
  7. SSHキーを作成する $ ls -al | grep .ssh > -rw------- 1

    k22120kk staff 20 7 13 18:48 .lesshst > drwx------ 18 k22120kk staff 576 7 12 03:34 .ssh //.sshが表示されない時はmkdirで作成しましょう $ mkdir .ssh $ cd .ssh 40
  8. SSHキーを作成する $ ssh-keygen -t ed25519 引用元:(【Windows】Gitの環境構築をしよう!) https://prog-8.com/docs/git-env-win ⏎ Enter ⏎

    Enter ⏎ Enter ファイル名の指定 今回はデフォルトなので そのままエンター パスワードの設定 今回はそのままエンター パスワードの確認 今回はそのままエンター 41
  9. SSH接続を確認する $ ssh -T [email protected] > This key is not

    known by any other names Are you sure you want to continue connecting (yes/no/ [fingerprint])? yes Hi <ユーザー名> ! You’ve successfully authenticated, but GithHub does not provide shell access. 実行して、yesかnoかを聞かれたら、yesと答えましょう。 Hi の後にユーザー名が出力されれば成功です。 50
  10. Gitの大きな流れ • Add コミットするファイルを追加する • Commit 追加・変更点をGitに追加する • Puth リモート(ネット)に打ち上げる

    • Pull リモート(ネット)から変更点をもらう 52 引用元:(Progate-Git) https://prog-8.com/slides?displayed_id=2642&lesson=66
  11. pushすると 64 ローカル リポジトリ id: 1 id: 2 GitHub リモート

    GitHub側で、リポジトリは 作って、ローカルと 紐付けは終わっている状態
  12. Gitの大きな流れ • Add コミットするファイルを追加する • Commit 追加・変更点をGitに追加する • Puth リモート(ネット)に打ち上げる

    • Pull リモート(ネット)から変更点をもらう 67 引用元:(Progate-Git) https://prog-8.com/slides?displayed_id=2642&lesson=66
  13. 簡単なコンソールのおさらい for Mac $ mkdir gitTest //ディレクトリの作成 $ cd gitTest //ディレクトリの移動

    $ ls //今いるフォルダーに何があるか確認 $ touch index.html //からのファイルの作成 $ cat ファイル名 //ファイルの中身を表示 $ echo "追加で書くもの" >> ファイル名 //ファイルに追加書き込み 77
  14. 簡単なコンソールのおさらい for Windows $ mkdir gitTest //ディレクトリの作成 $ cd gitTest //ディレクトリの移動

    $ dir //今いるフォルダーに何があるか確認 $ type nul > index.html //からのファイルの作成 $ type ファイル名 //ファイルの中身を表示 $ echo "追加で書くもの" >> index.html //ファイルに追加書き込み 78
  15. プロジェクトを立ててみる $ mkdir src //srcファイルがある時はやらなくて大丈夫です $ cd src $ mkdir

    gitTest $ cd gitTest $ git init > Initialized empty Git repository in <それぞれのパス>/.git/ GitTest “Git init”でバージョン管理を 行う設定をした 79
  16. ファイルを作成する Macの場合 $ touch index.html windowsの場合 $ type nul >

    index.html 81 ワークツリー ステージ リポジトリ ワークツリーのファイルを 編集する
  17. Addをしてみる $ git add index.html $ git add -A //Aは大文字

    Topic!今のプロジェクトのデータをすべて選択 したい場合 82 ワークツリー ステージ リポジトリ ターミナルの内容
  18. ステータスを見てみる $ git status > On branch master Changes to

    be committed: (use "git restore --staged <file>..." to unstage) modified: index.html 今のファイルの状態を見ることが出来ます。 今は、コミットされるファイルが表示されています。 83
  19. コミットした履歴を見てみる $ git log > commit 0cd513265131d7f2d915e9965d5b10ba94e80a44 (HEAD -> master

    )  Author: harutiro <[email protected]>  Date: Wed Jul 13 10:48:44 2022 +0900 初めてのコミット コミットをした履歴をみることが出来ます。 85
  20. プッシュをしてみる $ git push origin main 86 ワークツリー ステージ リポジトリ

    id: 1 GitHub id: 1 ターミナルの内容 ローカル側の変更点を リモートにアップロードする
  21. まとめ $ git init //gitを使えるようにする $ git remote add origin

    <URL> //リモートの追加 $ git add <ファイル名> //コミットするファイルの追加 -Aですべて選択 $ git commit -m “コミットメッセージ”//コミットをする $ git push origin main //リモートに打ち上げる $ git pull origin main //リモートからデータを貰う 基本使うのはこの6つのコマンド Gitを使いこなして、Gitマスターになろう!! 92
  22. おまけ $ git status $ git log $ git diff

    Git状態を知る様々なコマンド、 どういった動きをするか、実行をしてみよう。 93
  23. ファイルの変更を行う(Macの人) $ nano index.html GitTest index.html UW PICO 5.09 File:

    index.html Modified       こんにちは世界 ^G Get Help ^O WriteOut ^R Read File ^Y Prev Pg ^K Cut Text ^C Cur Pos ^X Exit ^J Justify ^W Where is ^V Next Pg ^U UnCut Text ^T To Spell エディターを使って ファイルを編集して みましょう 97
  24. add・commit・pushをしてみる $ git add -A $ git commit -m “indexに文を追加した”

    $ git push origin main これで新しい変更を保存することが出来ました。 99
  25. ギットログをグラフ形式で見てみる(短い版) $ git log --graph --all > * harutiro 9471325

    (HEAD -> master) indexに文を追加した * harutiro 0cd5132 初めてのコミット 今はただの点に見えますが、今後Gitをたくさん 使っていくとどんどんカラフルになります。 100
  26. ギットログをグラフ形式で見てみる $ git log --graph --all --format="%x09%C(cyan bold)%an%Creset%x09%C(yellow)%h%Creset %C(magenta reverse)%d%Creset

    %s" > * harutiro 9471325 (HEAD -> master) indexに文を追加した * harutiro 0cd5132 初めてのコミット 今はただの点に見えますが、今後Gitをたくさん 使っていくとどんどんカラフルになります。 101
  27. ブランチの一覧を表示してみる $ git branch > * master masterブランチ 今あるブランチの一覧を表示します *がついているところが今いるブランチです。

    109 注意!  ブランチ名がmasterの場合とmainの場合があるので、確認をお願いします。 そしてmainだった場合はうまく読み替えてください。
  28. ブランチを作ってみる $ git branch newBranch $ git branch > *

    master newBranch masterブランチ newBranchが 出来た 110
  29. チェックアウト • ブランチを切った後に、その場所にずれる • HEADは今いるブランチの最新の変更点 Origin / HEAD Origin /

    HEAD 今いる場所からずれる Headとは何か説明をする記事 https://qiita.com/takeokunn/items/5bc499121a21f8c5b990 111
  30. ブランチを移動してみる $ git checkout newBranch $ git branch > master

    * newBranch masterブランチ Origin / HEAD Origin / HEAD 今いる場所からずれる 112
  31. 新しいコミットをつくってみよう $ echo 追加で書くもの >> index.html $ git add -A

    $ git commit -m “indexに文を追加した2” $ git push origin newBranch masterブランチ newBranch 114
  32. ログを確認してみよう $ git log --graph --all --format="%x09%C(cyan bold)%an%Creset%x09%C(yellow)%h%Creset %C(magenta reverse)%d%Creset

    %s" > * harutiro d4f1cc9 (HEAD -> newBranch) indexに文を追加した2 * harutiro 9471325 (master) indexに文を追加した * harutiro 0cd5132 初めてのコミット masterブランチ Origin / HEAD 115
  33. ブランチを移動してみる $ git checkout main $ git branch > *

    master newBranch masterブランチ Origin / HEAD Origin / HEAD 今いる場所からずれる 122
  34. ログを確認してみよう $ git log --graph --all --format="%x09%C(cyan bold)%an%Creset%x09%C(yellow)%h%Creset %C(magenta reverse)%d%Creset

    %s" > * harutiro d4f1cc9 (newBranch) indexに文を追加した2 * harutiro 9471325 (HEAD -> master)indexに文を追加した * harutiro 0cd5132 初めてのコミット masterブランチ Origin / HEAD 127
  35. まとめ $ git branch //作業領域を切り分けるコマンド $ git checkout //ブランチを移動するコマンド チーム開発で使うのはこの2つのコマンド

    Gitを使いこなして、Gitマスターになろう!! 141 Pull request //マージを他の人にお願いするgithubの機能
  36. 参考文献・引用文献 142 [【Windows】Gitの環境構築をしよう!] https://prog-8.com/docs/git-env-win [【Mac】Gitの環境構築をしよう!] https://prog-8.com/docs/git-env [フリーアイコンの数千人] https://icon-icons.com/ja/ [【MacOS】Homebrew経由でGitをインストールする方法] https://blog.cloud-acct.com/posts/u-homebrew-git-install/ [コマンドプロンプトを起動する] https://www.javadrive.jp/command/ini/index1.html

    [【Linux】ファイル検索のあれこれ【ls/find/grep/xargs】] https://kojimanotech.com/2018/12/28/113/#outline__3 [サル先生のGitHub入門 プルリクエストとは?]https://backlog.com/ja/git-tutorial/pull-request/01/ [git log を見やすくする]https://qiita.com/takasianpride/items/842a785af610025a2030