メインコンテンツへスキップ

GitHubからzipでダウンロードしたソース一式をリポジトリにしてGitLensで管理する方法

🧩 はじめに

この記事では、GitHubからZIPファイルで取得したソースコードを、Ubuntu環境で新規のGitリポジトリとして初期化し、VSCodeのGitLens拡張機能で編集履歴を色分け表示できるようにする一連の手順を紹介します。

Gitを使った履歴管理の第一歩として、ダウンロードしたプロジェクトを自分のリポジトリとして扱いたい方、またGitLensの視覚的な便利さを活かしたい方におすすめです。

🗂️ ステップ1：ZIPファイルを展開する

まず、GitHubからダウンロードしたZIPファイルをUbuntu上で展開します。

unzip ダウンロードしたファイル名.zip -d 展開先ディレクトリ

例：

unzip myproject-main.zip -d ~/projects

【情報】GUIで展開した場合も、展開先のパスを把握しておけば問題ありません。

🛠️ ステップ2：Gitリポジトリを初期化する

展開したフォルダに移動し、Gitのリポジトリを初期化します。

cd ~/projects/myproject-main
git init

これでそのフォルダがGit管理対象になります。

📄 ステップ3：最初のコミットを作成する

すべてのファイルをGitに追加し、初期状態としてコミットします。

git add .
git commit -m "Initial commit"

これにより、以降の編集内容が差分として記録され、GitLensでの視覚化が有効になります。

🧠 ステップ4：VSCodeで開く

以下のコマンドでVisual Studio Codeをこのディレクトリで開きます。

code .

【情報】codeコマンドが使えない場合、PATHが通っていないか、VSCodeの「コマンドパレット」で Shell Command: Install 'code' command in PATH を実行してください。

🧩 ステップ5：GitLensをインストールする

VSCode内で以下の手順でGitLensをインストールします。

  1. 左の拡張機能（四角いアイコン）をクリック

  2. 「GitLens」と検索

  3. GitLens — Git supercharged をインストール

GitLensはGitの履歴、変更行の作者、過去のコミットなどを視覚的に表示してくれる強力なツールです。

🎨 ステップ6：GitLensの色分け表示を確認する

GitLensが有効になっていると、次のような表示が確認できます：

  • コードの行末に誰がいつ変更したかの情報（インラインブレーム）

  • ファイルのタイムライン表示（サイドバー）

  • 変更された部分の色（通常は緑、青、赤など）で視覚的に差分を表示

Gitの初期コミット以降に行った編集は、GitLensによって明確に色付きで表示されるようになります。

✅ 補足：GitHubに再アップロードしたい場合

新しいリポジトリとしてGitHubにアップロードしたい場合は、以下の手順でリモート設定とpushを行います：

git remote add origin https://github.com/あなたのユーザー名/リポジトリ名.git
git branch -M main
git push -u origin main

最初にGitHub上で空のリポジトリを作成しておく必要があります。

🎉 おわりに

これで、ZIPファイルから取得したプロジェクトをGitで管理しつつ、GitLensで直感的に変更を確認できる開発環境が整いました。

VSCode＋Git＋GitLensの組み合わせは、個人開発でもチーム開発でも非常に強力な武器になるので、ぜひ活用してみてください！

上に戻る