anaconda上のDjangoファイルをＧitHubにpushする手順

こんにちは。
株式会社クラスアクト インフラストラクチャ事業部の大塚です。

今回はタイトルの通り、anacondaで作ったDjangoのファイル達をGitHubにpushする為の手順を備忘録的な感じでメモっておきたいと思います。これで「間違って消しちゃった！！！」的な事故を減らしたいですね。。。（手順確認時本当に今まで作っていたファイル達を消してしまったのは内緒（白目））

ちなみに私はWin11にanacondaをインストールしたり、Django環境を作ったりしています。

# 手順
## GitHubにリポジトリを作成
GitHubにユーザ登録を実施したのち、Dashboardに移動します。
すると以下のような画面が表示されているはずなのでStart a new repositoryのところにリポジトリの名前を記載して緑色のCreate a new repositoryを押下します。
今回はdjango-devという名前のプライベートリポジトリを作成します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3219385/1d8a860b-4084-7446-919b-6f52971657dd.png)
うまく作成されると画面が自動的に遷移します。この画面のQuick setupに表示されているコマンドを控えます。httpsであることを確認してください。
![image (1).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3219385/80fff0c9-f901-95ce-eb8f-fb8409ae46d2.png)

## PCにgitをインストール
windowsにgitをインストールします。Downloadを押下します。

https://gitforwindows.org/

![image (2).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3219385/c133c110-c88a-507b-c167-2a914205573a.png)
ダウンロードのフォルダにexeファイルがあるはずなのでこれを実行します。
設定は特に気にせずバンバンデフォルトで先に進めてしまって問題ありません。。。。と言いたいところだったんですが、以下3つに注意してインストールを実行します。
- Choosing the default editor used by GitでVSCodeを選択。
- Adjust the name of the initial branch name for new repositoriesのラジオボタンを選択して、mainと記載されていることを確認。
- Configuring extra optionsで両方選択。

![image (3).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3219385/50689753-1017-1a82-3714-5b2e4ebaf3d6.png)
![image (4).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3219385/239de381-37be-255c-6221-036951ec89b1.png)
![image (5).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3219385/183beab3-dc5e-6e53-4bee-f4ff4fd231ec.png)
![image (6).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3219385/e0f3fd8d-915c-1ba6-e7fa-5315e90f73e5.png)

## VSCodeを起動してGitHubと連携する
次にanacondaを起動してDjangoの開発環境を選択してVSCodeをLaunchします。
![image (7).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3219385/96bab9b0-e62a-24fd-3f15-5768d0857533.png)
Ctrl + @を押下するとVSCode画面下部にTerminalが表示されます。
Terminalの右上にある+を押下して、Git Bashを選択します。
![image (8).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3219385/8e962420-ce9c-fddb-9dbb-abc8ba5bb267.png)
GitHubで使用しているメールアドレスとユーザ名を記載します。
```
$ git config --global user.email "メールアドレス"
$ git config --global user.name "名前"
```
![image (9).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3219385/41a7716f-d4df-4e0a-b675-c2543c342e68.png)
次に以下のコマンドを実行して、GitHubからクローンします。
git clone以下の引数はリポジトリを作成した際のhttpsから始まるものをペーストすればOKです。
![image (10).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3219385/df7ba18a-eae5-0bb2-122f-55f389f8587b.png)
上記コマンドを実行すると以下のポップアップが表示されます。
Sign in with your browserを押下します。
![image (11).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3219385/fc064a3a-fa3b-2f44-06ab-81736c0d4eca.png)
こんな画面が出てくると思いますので、Authorize git ecosystemを押下してください。
![image (12).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3219385/33baaf80-a42e-8a65-43b4-42eec1e1bc80.png)
認証が上手くいくと、リポジトリ名のフォルダが作成されることが確認できます。
![image (13).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3219385/61a27e17-0fb0-e40e-1105-14cac08da2a9.png)
## GitHubにpushする
作成されたフォルダの中に以下のコマンドを使いDjangoのプロジェクトとアプリを作成してみます。
```
PS C:\Users\ohtsu\Documents\DjangoEnv> cd .\django-dev\
PS C:\Users\ohtsu\Documents\DjangoEnv\django-dev> django-admin startproject devEnv
PS C:\Users\ohtsu\Documents\DjangoEnv\django-dev> cd .\devEnv\
PS C:\Users\ohtsu\Documents\DjangoEnv\django-dev\devEnv> python manage.py startapp devApp
```
![image (14).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3219385/59e101b3-9ba1-d1f3-2936-a636d76d2253.png)
左にあるSource Controlのアイコンを押下して、Commitと書かれた青いボタンの「▿」を押して、Commit & Pushを押下します。
![image (15).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3219385/c1c678d9-6f57-f63c-b069-37b7f41760fa.png)
これはYesでOKです。
![image (16).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3219385/c71889a6-ebfb-353f-dcfc-82ee91c1a15a.png)
画面上部にCOMMIT EDHIMSGが表示されるので一番上に適当にコメントを書いて、右上のチェックマークを押下します。
![image (17).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3219385/b2012714-1a59-b7ba-9887-d83f7122904d.png)
この後GitHubのリポジトリを確認してみます。
ファイルが表示されていればpush成功です。
![image (18).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3219385/64bb059c-1060-562c-ddbe-d00408c501c9.png)