Zenn
🤖

VSCodeからAWS CodeCommitを利用する

2023/10/19に公開
AWS
Git
VS Code
CodeCommit
tech

前提

以下の前提で進める

  • Windows（他OSでもそんなに変わらないと思うけど）
  • Gitクライアントインストール済み
  • VSCodeインストール済み
  • AWSアカウント作成済み

AWS CodeCommit上にリポジトリ作成する

AWS上のサービス「CodeCommit」にリソースを保存するリポジトリを作成する

  1. AWSコンソールにログインし、CodeCommitを検索する

  2. CodeCommitにてリポジトリを作成する

    ↓

  3. クローン用のURLを控える
    ※今回はHTTPSによる接続を利用する
    ※「Git認証情報を作成する」リンクから、後続に行うGit認証情報作成手順をAWS公式記事からも確認できる

Git認証情報を作成する

CodeCommitにローカルPC上のVSCodeからアクセスするためのGit認証情報を、AWS上のサービス「IAM」にて作成する

  1. AWSコンソールにログインし、IAMを検索する

  2. Git認証情報を作成する
    「ユーザ」メニューからGit認証情報を作成するユーザを選ぶ。
    「セキュリティ認証情報」タブ＞「AWS CodeCommit の HTTPS Git 認証情報」にて認証情報を生成する

  3. 生成した認証情報を控える
    ユーザID・パスワードを控えておく
    ※認証情報をダウンロードするとCSV形式でダウンロードされる。取り扱いは要注意

VSCodeにGit認証情報を設定してクローンする

IAMにて作成したGit認証情報をVSCode（厳密にはGitクライアント）に設定する

  1. Gitクライアントにユーザ名とメールアドレスを設定する
    Git認証情報の設定の前に、Gitをインストールしたらユーザ名とメールアドレスを設定する必要がある

設定するコマンド（WindowsのPowerShellやVSCode上のTerminalから実施）

$ git config --global user.name [ユーザ名]
$ git config --global user.email [メールアドレス]

※--globalオプションをつけることで、自身がそのシステム上で行うGit操作に対して常にこの設定を使うようになる。

確認はgit config --global --listコマンドか、.gitconfigファイルの中身を参照する

  1. VSCodeのコマンドパレットからgit cloneを選択し、控えていたクローンURLを入力する

    ↓

  2. Git認証情報を入力する
    初回であれば、ここで認証情報を入力するフォームが出現する

上記フォームが出現しない・過去に別のGit認証情報を登録済みなどの場合は、Windowsの「資格情報マネージャー」＞「Windows資格情報」から削除/編集する
※マスクした箇所にCodeCommitのGit認証情報がある

認証情報を入力すると、クローン先のフォルダを聞かれるので好きなクローン先を選択する
クローンしたローカルリポジトリを開くかポップアップがでるので「Open」する

実際にローカルからCodeCommitのリポジトリにpushしてみる

ここまでの手順でVSCodeからCodeCommit上のリポジトリを操作できるよう設定が済んでいるはずである
実際に適当なファイルを作成してpushしてみる

  1. VSCode上でファイルを作成する

  2. VSCode上からコメントを入力してCommit&Pushする

  3. AWS CodeCommitに戻り、リポジトリをリフレッシュしてみる
    pushしたファイルが新たに格納されていることが確認できるはず

Discussion