【Github】アプリをGithubにプッシュするまでの手順

# Githubへプッシュ手順について

Githubのアカウントは持っているものの、どうやってアプリをプッシュすればよいかを備忘録として残しておきます。

# Guthubにプッシュするまでの手順
## Github公式サイトにアクセスする

https://github.co.jp/

トップページはこのような画面が出てきます。
![Github公式サイト.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1169664/460dc31b-8449-d47b-5d6f-09513b122793.png)

サインインを求められるのでアカウント情報を入力します。
![Githubサインイン.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1169664/ed038147-7771-b6de-1522-a8d5888db593.png)

新規のリポジトリを作成します<font color="red"><b>(赤枠の箇所)</b></font>。
![リポジトリ作成.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1169664/9115e66c-397e-ac13-acc2-77fb9fd49b73.png)

つぎにやることは、
①リポジトリ名の入力
②PublicまたはPrivateの設定
③README.mdのチェックを入れなくて<font color="red"><b>※こちらはチェックしなくてよいです</b></font>

![リポジトリ作成2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1169664/84e50190-4c3e-3b0e-6487-0f99a4e1d268.png)

リポジトリの作成が完了すると下記のが表示されます。

![リポジトリ作成完了.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1169664/2be73b88-3c79-b76b-51c4-4ebf6f18f49f.png)

# さっそくやってみる。

今回は、ReactとLaravelで作ったサンプルプロジェクトをプッシュしてみたいと思います。
## リポジトリの作成
まず、git initコマンドでローカルにリポジトリの作成をします。

```
git init
```

![github1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1169664/36926ed0-a818-8506-ffda-56f37cdfff93.png)

すると、エクスプローラには、「.git」というリポジトリが作成されます。

![github2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1169664/c51f0771-ac9d-e787-d0d0-41266e4f512a.png)


## ローカルリポジトリにすべてのファイルを加える
ローカルリポジトリにすべてのファイルを加えるためgit addコマンドを実行しましょう。
```
git add .
```

すると、こんなかんじにコンソール画面にずらずらーっと出てきます。

```
(コンソール画面)
warning: in the working copy of 'Dir Maker繝・ぅ繝ｬ繧ｯ繝医Μ.txt', LF will be replaced by CRLF the next time Git touches it
warning: in the working copy of 'frontend/.gitignore', LF will be replaced by CRLF the next time Git touches it
warning: in the working copy of 'frontend/README.md', LF will be replaced by CRLF the next time Git touches it
warning: in the working copy of 'frontend/eslint.config.js', LF will be replaced by CRLF the next time Git touches it
warning: in the working copy of 'frontend/index.html', LF will be replaced by CRLF the next time Git touches it
warning: in the working copy of 'frontend/package-lock.json', LF will be replaced by CRLF the next time Git touches it
warning: in the working copy of 'frontend/package.json', LF will be replaced by CRLF the next time Git touches it
warning: in the working copy of 'frontend/postcss.config.js', LF will be replaced by CRLF the next time Git touches it
warning: in the working copy of 'frontend/src/App.tsx', LF will be replaced by CRLF the next time Git touches it
warning: in the working copy of 'frontend/src/main.tsx', LF will be replaced by CRLF the next time Git touches it
warning: in the working copy of 'frontend/src/vite-env.d.ts', LF will be replaced by CRLF the next time Git touches it
```


:::note warn
Github公式サイトのサンプルでは、「git add README.md」と書いてありますが、このREADME.mdファイルのみをプッシュするだけです。

なので、全部のプロジェクトファイルをプッシュするには上記↑のコマンドを使いましょう。
:::

## git commitコマンドを実行する
git commitコマンドを実行してgit addで追加したファイルをcommitしましょう。
```
git commit -m "first commit"
```

するとこんな感じで、コミットされていきます。
```
[master (root-commit) fd7444c] first commit
 115 files changed, 16596 insertions(+)
 create mode 100644 "Dir Maker\343\203\207\343\202\243\343\203\254\343\202\257\343\203\210\343\203\252.txt"
 create mode 100644 "Put\351\200\201\344\277\241\343\201\253\343\201\244\343\201\204\343\201\246.txt"
 create mode 100644 backend/.editorconfig
 create mode 100644 backend/.env.example
 create mode 100644 backend/.gitattributes
 create mode 100644 backend/.gitignore
 create mode 100644 backend/README.md
 create mode 100644 backend/app/Console/Kernel.php
 create mode 100644 backend/app/Exceptions/Handler.php
 create mode 100644 backend/app/Http/Controllers/Controller.php
 create mode 100644 backend/app/Http/Controllers/EventController.php
 create mode 100644 backend/app/Http/Controllers/RegisterController.php
 create mode 100644 backend/app/Http/Kernel.php
 create mode 100644 backend/app/Http/Middleware/Authenticate.php
 create mode 100644 backend/app/Http/Middleware/EncryptCookies.php
 create mode 100644 backend/app/Http/Middleware/PreventRequestsDuringMaintenance.php
 create mode 100644 backend/app/Http/Middleware/RedirectIfAuthenticated.php
 create mode 100644 backend/app/Http/Middleware/TrimStrings.php
 create mode 100644 backend/app/Http/Middleware/TrustHosts.php
 create mode 100644 backend/app/Http/Middleware/TrustProxies.php
 create mode 100644 backend/app/Http/Middleware/ValidateSignature.php
 create mode 100644 backend/app/Http/Middleware/VerifyCsrfToken.php
 create mode 100644 backend/app/Models/Event.php
 create mode 100644 backend/app/Models/User.php
 create mode 100644 backend/app/Providers/AppServiceProvider.php
 create mode 100644 backend/app/Providers/AuthServiceProvider.php
 create mode 100644 backend/app/Providers/BroadcastServiceProvider.php
 create mode 100644 backend/app/Providers/EventServiceProvider.php
 create mode 100644 backend/app/Providers/RouteServiceProvider.php
 create mode 100644 backend/artisan
 create mode 100644 backend/bootstrap/app.php
 create mode 100644 backend/bootstrap/cache/.gitignore
```

## ローカルリポジトリ内で現在のブランチ名を main に変更する
ローカルリポジトリ内で現在のブランチ名を main に強制的に変更します。
```
git branch -M main
```

## リモートのリポジトリの設定を行う。
リモートのリポジトリの設定を行いましょう。

```
git remote add origin https://github.com/(アカウント名)/reactLaravelEventApps.git
```

## git pushコマンドでGitHubのリポジトリにプッシュする
最後にgit pushコマンドでGitHubのリポジトリにプッシュします。

```
git push -u origin main
```

すると、下記のようにプッシュされます。
```
Enumerating objects: 158, done.
Counting objects: 100% (158/158), done.
Delta compression using up to 16 threads
Compressing objects: 100% (126/126), done.
Writing objects: 100% (158/158), 127.24 KiB | 3.63 MiB/s, done.
Total 158 (delta 10), reused 0 (delta 0), pack-reused 0 (from 0)
remote: Resolving deltas: 100% (10/10), done.
To https://github.com/(アカウント名)/reactLaravelEventApps.git
 * [new branch]      main -> main
branch 'main' set up to track 'origin/main'.
```



以上です。

# 参考サイト

https://reffect.co.jp/react/next-js-github-vercel