Zenn
🎃

【超初心者向け】Gitコマンドを使う感動を教えたい！気軽にpushしてみて！【Git/Github/vscode】

2024/04/21に公開
Git
GitHub
VS Code
Windows
tech

はじめに

Gitコマンドの体験をした時に「お！かっけぇ！」という気持ちになったので、この感動を共有したいがために、コマンドよく分からないけど、触ってみたい人に向けて書いてみました！

対象者

  • Gitコマンドをちょっとだけ使ってみたい人向け

紹介するコマンド

  • git clone
  • git checkout
  • git add
  • git commit
  • git push

環境

  • Windowsを想定しています。

手順

インストールをしよう

今回、必要なものをまずはインストールをしていきます。

  1. Visual Studio Code（VScode）
    https://code.visualstudio.com/

  2. Git
    https://www.curict.com/item/60/60bfe0e.html

  1. GitHub
    https://github.co.jp/

ワークスペースの作成

開発者がプロジェクトやタスクに取り組むための整理された環境を指します。具体的には、コード、ライブラリ、ツール、その他のプロジェクト関連ファイルを格納するための作業用フォルダーやディレクトリのことを言います。

【Windows】C:\works\Zenn\Project1
【Mac】/Users/[user_name]/Projects/Project1

Gitとの連携

Personal Access Tokenの作成

  1. 右上のアイコンをクリック
  2. Settingsをクリック
  3. 左側のメニューの一番下（Developer Settings）をクリック
  4. Personal access tokens (classic)をクリック
  5. access tokensの作成と設定

  6. Generate tokenクリック後のTokenを必ずコピーする

Git clone

  1. さっき作成したワークスペースを開く
  2. Git clone [URL]のURL部分を準備する
    https://github.com/Kwateru/git_practice

  3. VScodeのターミナルを開いて、Git clone


  4. Gitのあるフォルダに移動する

ブランチの作成

履歴の流れを分岐して記録していくためのものです。自分の作業スペース（202404Zenn/hoge）に今の状態をコピーして、追加や編集をすることで他の方に影響を与えずに作業を進めることができます。（もっと知りたい方へ）

Hello World


Git add

Git add .で現在のディレクトリとそのサブディレクトリ内にある全ての変更（新規ファイルの追加、既存ファイルの変更、削除されたファイル）をステージングエリア（またはインデックス）に追加するという処理です。

  • Git add index.html（これでもOKです！）

Git commit

Git push

GitHubを確認

https://github.com/Kwateru/git_practice
branchesをクリックすると、あなたがpushしたものが反映されています。

プルリクはまだ経験したことがないので、一旦はここまでになります！
コミットの履歴はbranchesでも確認ができますので、何度かpushした後に確認してみて下さい。

Discussion