GitHubのプロフィール画面を作成する

# 目的
GitHubのプロフィール画面を作成する


# 完成形
今回の記事を進めると、下図のようなプロフィール画面が作成できます。
(表示される内容は ユーザー によって異なります)
![スクリーンショット 2022-01-12 2.35.39.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/2b526b71-3543-5d22-6e9e-8e942bca593d.png)


# プロフィール用のリポジトリを作成

<img src = "https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/ad37d31c-4ea7-f340-813f-7d758b9d88a6.png" width = 600>

### リポジトリを新規作成
<img src = "https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/fd4a9116-1faf-0326-e8ec-644f08355765.png" width = 300>

### リポジトリ名を自分のアカウント名に設定
<img src = "https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/bcb3d19d-5a41-1c51-1b01-5fadfa95191d.png" width = 600>

### (やりたい人だけ)リポジトリの説明を設定
<img src = "https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/d7d9eb6c-01d8-22c0-bde0-93f8fdf68d05.png" width = 600>

### 公開先を「Public」に設定
GitHubページを見た全員に公開する という設定
<img src = "https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/11cf1a82-e2f8-aa12-08b1-f077caffe2a4.png" width = 600>

### 「Create Repository」をクリックする
リポジトリを作成
<img src = "https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/b2446fb8-43a2-04d1-8896-64662f84079a.png" width = 600>

### 作成結果を確認
自分のGitHubページにアクセスしてプロフィール画面が作成されていることを確認
<img src = "https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/338718a2-0c36-b137-53b7-610e0a76c32c.png" width = 500>
<img src = "https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/981d0e14-e904-b384-9d49-d05a7292fa2a.png" width = 500>


# プロフィール画面を編集する

### 「Edit README」をクリック
<img src = "https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/3e498a2a-0684-4160-9742-788cd5e3a8b7.png" width = 600>

<img src = "https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/8a3ea5c3-f7ff-89ea-7f51-143768661221.png" width = 300>


### README.md を編集する
<img src = "https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/c89e2df4-d6e2-02f7-34cf-2a96056380bd.png" width = 300>


### 編集(コピペでOK, ユーザー名は各自変更してください)

```README.md
<a href="https://github.com/anuraghazra/github-readme-stats">
  <img align="left" src="https://github-readme-stats.vercel.app/api?username=hamadayuuki&count_private=true&show_icons=true" />
</a>

<a href="https://github.com/anuraghazra/github-readme-stats">
  <img align="left" src="https://github-readme-stats.vercel.app/api/top-langs/?username=hamadayuuki&langs_count=8" />
</a>
```


### コードの説明

**↓(完成形 左側) GitHub へのコミット数やプルリク数を表示**

```
<a href="https://github.com/anuraghazra/github-readme-stats">
  <img align="left" src="https://github-readme-stats.vercel.app/api?username=hamadayuuki&count_private=true&show_icons=true" />
</a>
```

**↓(完成形 右側) 公開しているリポジトリで使用している言語ランキング を表示**

```
<a href="https://github.com/anuraghazra/github-readme-stats">
  <img align="left" src="https://github-readme-stats.vercel.app/api/top-langs/?username=hamadayuuki&langs_count=8" />
</a>
```


(やりたい人だけ)画面下までスクロールして、コミットメッセージを入力
「Commit changes」をクリック

<!-- <img src = "https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/cdc06f77-42b9-c438-d542-2362cb3b4ed2.png" width = 800> -->


### 編集結果
![スクリーンショット 2022-01-12 2.35.39.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/2b526b71-3543-5d22-6e9e-8e942bca593d.png)


# 参考文献

https://docs.github.com/ja/account-and-profile/setting-up-and-managing-your-github-profile/customizing-your-profile/managing-your-profile-readme

https://zenn.dev/yutakatay/articles/kirakira-github-profile