メインページに戻る

1. GitHubアカウントの準備

GitHub は、プログラマー向けの SNS のような Web サービスです。ご自身で作成したプログラムの公開や、他の開発者との共同作業をスムーズに行える仕組みが整っています。

まだアカウントをお持ちでない場合は、GitHub公式サイトのリンクからアカウントを作成してください。

2. GitHub Desktopのインストールと設定

次に、GitHub Desktop というツールを準備します。

GitHub は本来「Git」というコマンドラインツールを基盤としていますが、GitHub Desktop を使用すれば、コマンドを入力せずグラフィカルな操作で済むため、初心者の方におすすめです。

お使いの PC にインストールされていない場合は、GitHub DesktopダウンロードページのリンクDownloadボタンからインストーラーを取得し、インストールを完了させてください。

インストール後、先ほど作成した GitHub アカウントでログインしておきましょう。

3. GitHub Desktopでの操作手順

ここでは、基本的なリポジトリ(プログラムの保管場所)の作成から、ファイルの追加・変更、そして GitHub への反映までの手順を解説します。

3.1. リポジトリの新規作成

  1. GitHub Desktop を起動します。
  2. メニューバーから FileNew repository… を選択します。(もしくは左上のCurrent Repository→Ade → Create New repository でもOK)
  3. 以下の項目を入力します。
    • Name: リポジトリ名を入力します(例: sample-repo)。
    • Local Path: ローカル PC 上の保存場所を指定します(任意のフォルダ)。
  4. Create Repository をクリックして作成を完了します。

3.2. GitHubへの公開(Publish)

  1. 画面右上の Publish repository ボタンをクリックします。
  2. Keep this code private にチェックを入れてください。非公開(Private)リポジトリに設定できます。
  3. Publish Repository を押すと、GitHub 上にリモートリポジトリが作成されます。(View on Githubを押せばリポジトリを確認できます)

3.3. ファイルの追加と変更

  1. Showi in Folderを押してローカル PC 上のリポジトリフォルダを開きます。
  2. ローカル PC 上のリポジトリフォルダに、テキストファイルなどを追加したり編集したりします。
    • (例: hello.txt を作成し「Hello GitHub!」と記述します。)
  3. GitHub Desktop に戻ると、行った変更が自動的に検出され、画面に表示されます。

3.4. コミット(ローカル保存)

  1. 画面左下の Summary(必須)に、変更内容の要約を入力します(例: "Add hello.txt"。まあ適当でいいです)。
  2. 必要であれば Description にも詳細を記述します。
  3. Commit to main ボタンをクリックすると、変更内容がローカル PC に保存されます。

3.5. プッシュ(リモートへ反映)

  1. 画面右上の Push origin ボタンをクリックします。
  2. これにより、ローカル PC に保存された変更が GitHub のリモートリポジトリに送信され、反映されます。View on GitHubを押して確認してみてください。

4. リポジトリのクローン(コピー)

ここでは、GitHub 上にあるリポジトリを、ご自身の PC にコピーして編集できるようにする手順を説明します。(参考

  1. GitHub のリポジトリページ(今回の授業のコード集。授業のOrganizationに招待される必要があります。)に移動し、緑色の Code ボタンをクリックします。
  2. Open with GitHub Desktop を選びます。GitHub Desktop を開く許可を求められたら承認してください。
  3. Clone ダイアログが表示されるので、Local path(ローカル保存先)を指定します。
    • 注意: この保存先に日本語(全角文字)が含まれていると、予期せぬ問題が発生することがあります。Windows でユーザー名が日本語の場合は、C: 直下に programming などのフォルダを作成して指定すると安全です。
  4. 設定後、Clone を押せばコピーが完了します。

5. Visual Studio Code(VS Code)連携設定

GitHub Desktop から直接 Visual Studio Code(VS Code)を開けるように設定すると便利です。

  1. Settingsをクリック(もしくはGitHub Desktop のメニューから FileOptionsIntegrations を選択します。)
  2. External Editor の項目で VS Code を選択します。
  3. これで、Open in Visual Studio Code からすぐにプロジェクトフォルダを開けるようになります。
    • もし選択肢に VS Code が表示されない場合は、一度 GitHub Desktop を再起動すると解決することがあります。