如何建立獨一無二的 GitHub Profile！與三個很酷的設計及應用 🚀
Hi！大家好，我是神 Q 超人！相信各位平時在閒暇之餘都會付出一些自己的心力到 GitHub 上面，為的就是在世界最大的交友平台上留下自己在青春中奮鬥的一頁，然後十年後，很熱血的打開 GitHub 和自己的小孩分享那些年的我們一起寫的程式。但我告訴你，他一定會這樣想：
「你在公三小？」
對！這很殘酷，但請不要放棄治療！原因在 GitHub 的 Overview 上，每次點進個人頁，在 Overview 上映入眼簾的總是 Popular repositories，然後就是下方的 Contributions 熱力圖和活動紀錄，我就問你：
「這樣子的頁面到底哪裡吸引人了？」
光是現在當我看到那個 Overview，就想把螢幕打爆，難道我沒有辦法讓人點進我的 Overview 就有像被海嘯打到的驚奇感嗎？讓我的小孩看到 Overview 就身受感動，哭著對我說：「父親，我好想打程式...」，我跟你說：
「可以的！」
所以在這篇文章裡面（現在才進入正題 😂），我就要來介紹 GitHub 最近推出的新功能，它可以讓你在 GitHub 個人頁中的 Overview 上放上自己設計的 README.md，像是這樣子：
而除了告訴大家怎麼設定外，文章裡也會分享幾個筆者看到很酷的 Profile 給大家分享，那我們就直接開始吧！
如何設置專屬的 GitHub Profile？
建立同名 Repository
首先到 GitHub 上建立一個與自己 GitHub 帳號同名的 Repository，如果正確的話下方也會出現提示，告訴你這是一個特別的 Repository ，如下圖：
接下來別忘了點選下方的「Initialize this repository with a README」，這樣在這個 Repository 裡就會自動有個 README.md 了，如果在創建的時候太興奮忘記勾選的話也別緊張，也能自己建一個 README.md。
總之建完後，與其他專案不同，他的 README.md 會預設是這樣：
這時候我們的個人 Profile 上也就會出現該 README.md 的內容了：
設置 Profile 的內容
接下來讓我們打開 README.md 進入編輯模式：
可以看到 GitHub 非常貼心地告訴你你可以放些什麼東西，然後因為是在 README.md 中編輯，如果之前就有稍微碰過 Markdown 的話，在排版方面應該不會太困難，但還是附上 Markdown 的 cheat sheet，不熟的朋友可以對照來看。
那下方筆者先提供基本的介紹格式（其實也就是去參考其他人的 Profile 組合而成的 😂）：
上方最花時間的就是打英文了，哈哈哈哈哈！至於怎麼去擺放的話，訣竅應該是適當的放一些 emoji，讓整個版面看起來比較有色彩，有興趣的朋友們可以到 這裡 clone 下來自由修改。然後也附上幾個參考的來源，大家也可以看看：
- https://github.com/katmeister：基本上都是參考她的。
- https://github.com/WaylonWalker：圖文並茂整個就很好看，但我不會做那些美美的圖，就只能欽佩而已 🙌。
- https://github.com/Mangamaui：也是很俐落的放了幾張圖，整個版面看起來很舒適。
Progile Generator
那如果真的懶的自己去寫那些 Markdown 怎麼辦？我就想要在畫面點點按按，然後生出一個 Profile 貼到 GitHub 上結案，有這種想法應該不為過吧？
廢話！當然不為過啊！
畢竟 Markdown 產生的內容還是有規律的，所以國外也有開發者寫了 Profile 的產生器做 Side Project（這個產出速度真是快狠準）：
我也試著填寫了一下，所產生的畫面大概像是：
所以如果真的很懶的話，就可以考慮用上方的產生器快速做一個。阿你說這個界面太簡單了，你不想要？
現在還來得及！直接怒做一個當自己的 Side Project
有興趣做 Side Project 的話，可以使用 marked 來幫忙處理轉換 Markdown 到預覽的邏輯，然後如果真的做出來，也歡迎在文章下方留言和我分享 😃
炫砲的三個設計
用 Gif 讓 Profile 動起來
既然我們可以在 Markdown 中放上圖片，那放個會動的 gif 是不是又更上一層樓了？因為做起來真的很酷，所以筆者有實做一個簡單的版本，讓看看應用的效果吧：
上方的 gif 是我用 Keynote 先把要出現的字打好，然後播放時用 GIPHY Capture 錄製來的，Markdown 的部分也相當簡單，各位可以看 這裡。下方是靈感來源：
- https://github.com/CyrisXD：打字效果更真實了，而且還配上背景，光看 Profile 就知道是個狠角色。
- https://github.com/mmphego：除了 gif 外，也可以加上其他內容（他下方的資訊是用 github-readme-stats 這個 Side Project 產生的），看起來更讚。
- https://github.com/donavon：用來當圖片的輪播也是很棒的選擇！
自動更新的 Profile
有個開發者把自己的 Profile 當作一個看板，能夠自動更新最近發佈功能的專案、文章和今天我學了什麼，效果如下：
作者也寫了 這篇文章 分享他是如何做的，有興趣的話也可以試著做看看，但筆者的 GitHub 沒有那麼多東西，所以如果要展示的話可能會很空虛 😂。下方提供 Profile 來源：
- https://github.com/simonw：就是上方截圖的 GitHub。
- https://github.com/jacques-blom：作者根據在 Youtube 發布影片時來動態更新 Profile，他有在 這部影片 中解釋如何做到。
和全世界的開發者做互動吧！
這個是我覺得最猛的，但是因為太猛所以我只找到一個 Profile，先讓大家看圖（但真的不是圖看起來那麼簡單，請各位一定要點進去看看，然後試著操作下一步棋）：
作者非常厲害，而且相當的有創意，他也有在下方說明是如何做到的（真心覺得國外的開發者太友善了，非常不吝於分享）：
How this works
When you click a link, it opens a GitHub Issue with the required pre-populated text. Just push “Create New Issue”. That will trigger a GitHub Actions workflow that’ll update my GitHub Profile with the new state of the board.
然後我真的也沒找到第二個做互動遊戲的，所以這部分就不列表了。但是我非常期待有鄉民能夠在中秋節前趕出一個讓開發者們線上烤肉 Profile 😂。
想看更多 Profile
如果覺得上面那幾種還看不夠，想要更多能夠激發你深層靈感的 Profile，也可以到 creative-profile-readme 和 Awesome-Profile-README-templates，這兩個是國外的開發者建立的 Repository，目的是讓大家發 PR 收集大家精心製作的 Profile，所以如果大家看完這篇文章，也製作了自己的 Profile，不妨可以考慮順手送個 PR 貢獻開源囉！
希望本篇文章的整理對你有幫助，如果各位有做出什麼有趣的 Profile 頁面或是應用，都歡迎在下面留言跟我分享。那文章內有任何解釋不清楚或是錯誤的地方，也麻煩留言告訴我！感謝大家 🙌！
