如何製作一份獨特創意的Github Profile？

嗨大家好，延續上一篇透過Wakatime，紀錄你的開發時間。今天手把手教大家，如何透過Wakatime，豐富自己的Github Profile。並且也附上Github Profile的其他相關教學。
當中包含了「定時更新自己的Youtube播放列表」，「定時更新自己的部落格文章連結」…等等豐富的內容嚕。

建立Github Profile

About your profile，其實就是各個Github帳號的個人頁面。做好一份Github Profile，也讓自己的個人品牌大加分。
以下是各個精美的範例：
https://github.com/timburgan （超炫砲，下棋的Github profile）
https://github.com/katmeister （簡單俐落的Gif）
https://github.com/M0nica （漂亮的大Banner）
https://github.com/ashbakernz （透過程式碼，自我介紹）

看完上述的Github Profile，有沒有發現Github Profile其實是一個簡易的個人網頁。在這裡可以展現自己的個人特色。
這裡是我的Github Profile >>> Steven Cheng Github Profile

步驟1. 新增Github Repository

新增一個Github Repository >>> https://github.com/new

注意！紅色方框的repository 名稱，要跟你Github 帳號名稱一樣， 這樣就會判定是一個Github Profile的專案。才可以將這一份的README.md檔案顯示在你的Github Profile上。像我這邊就必須輸入"steven130169"。
下方的「Add a README file」，記得要打勾。
新增Repository 完畢後，會呈現類似下圖的畫面。在畫面的右方，會呈現一個綠色區塊，告訴你說" is a special repository." 這才代表成功。如果沒有呈現的話，代表你的repository 名稱沒有與你的帳號相同。

步驟2. 編輯Github Profile

完成之後，點擊「Edit README」。

進入編輯頁面。

在編輯完成之後，記得要按下commit，這樣才代表儲存完畢。

步驟3. 確認編輯後的Github Profile

在網址列輸入：https://github.com/你的帳號名稱 。
Example: https://github.com/steven130169
確認一下，完成後的結果如何嚕。

Wakatime 嵌入教學

我們將透過waka-readme-stats，這個open source專案，讓我們的Profile可以呈現精美的每週開發時間分配的圖表。不過，首先還是要讓你的wakatime，有記錄這樣在嵌入的時候才會有感覺。歡迎參考: >> wakatime 介紹
Github Profile 呈現如下圖

步驟1. 在你的readme.md 標記要呈現wakatime的區域

在希望wakatime呈現的地方，加入以下程式碼。並且儲存。

<!--START_SECTION:waka-->
<!--END_SECTION:waka-->

步驟2. 新增Github Action

點擊剛剛新增的Github Profile Repository > Action

接著點擊 new workflow > set up a workflow yourself > 進入編輯workflow 畫面
紅色區塊，輸入你的檔案名稱例如：wakatime-workflow.yml

步驟3. 複製以下程式碼

name: Waka Readme

on:
  workflow_dispatch:
  schedule:
    # Runs at 12am UTC
    - cron: "0 0 * * *"

jobs:
  update-readme:
    name: Update this repo's README
    runs-on: ubuntu-latest
    steps:
      - uses: anmol098/waka-readme-stats@master
        with:
          WAKATIME_API_KEY: ${{ secrets.WAKATIME_API_KEY }}
          LOCALE: "en"
          SHOW_COMMIT: "True"
          SHOW_DAYS_OF_WEEK: "True"
          SHOW_EDITORS: "True"
          SHOW_OS: "True"

並且複製貼上到程式碼編輯的橘色區域。
當中的「WAKATIME_API_KEY」我們在下個步驟進行設定。

步驟4. 設定Wakatime API Key

進入Github Profile Repository Settings > 側邊欄的Secrets > 點擊New repository secret
在Name(紅色區域) 輸入「WAKATIME_API_KEY」
在Value (橘色區域) 輸入 WAKATIME 的API Key，從你的wakatime複製貼上。

設定完成之後，記得點擊「Add secret」儲存。

步驟5. 嘗試觸發Workflow 驗證是否成功

回到Github Action workflow
點擊剛剛新增的workflow 檔案 > 點擊 run workflow

Github workflow 成功完成後，就可以回到你的Github Profile，確認一下呈現的效果。

定時更新部落格文章嵌入教學

接著跟大家分享另外一個Github Profile Workflow，讓你的Github Proflie 可以定時更新，放上你最新的部落格文章連結。如下圖紅色區域

使用的Github專案連結在此>> https://github.com/gautamkrishnar/blog-post-workflow
使用方式，其實跟Wakatime的嵌入非常相像。

步驟1. 在readme.md 標記要呈現Blog 文章連結的區域

# Blog posts
<!-- BLOG-POST-LIST:START \-->
<!-- BLOG-POST-LIST:END \-->

步驟2. 新增一個workflow 檔案

檔案名稱命名隨意，只要不要重複即可。
複製貼上以下程式碼

name: Latest blog post workflow
on:
  schedule: # Run workflow automatically
    - cron: '0 0 * * *' # Runs every day, on the day
  workflow_dispatch: # Run workflow manually (without waiting for the cron to be called), through the Github Actions Workflow page directly
jobs:
  update-readme-with-blog:
    name: Update this repo's README with latest blog posts
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - uses: gautamkrishnar/blog-post-workflow@master
        with:
          feed_list: "https://blog.chiwencheng.com/news/rss" # your blog url

注意！feed_list 區域要更換成你自己的Blog RSS網址
其他更細節的Github workflow 設定可以參考此網站>> https://github.com/gautamkrishnar/blog-post-workflow

步驟3. 嘗試觸發Workflow 驗證是否成功

設定完畢之後，當然要嘗試觸發看看，確認Workflow 可以正常執行。
當中支援可以定時更新的內容相當的多，包含youtube 播放列表、youtube 頻道的更新、reddit、stack overflow…等等，都可以串。
其他更詳細的Workflow 設定可以直接參考我的專案內容>> https://github.com/steven130169/steven130169/tree/main/.github/workflows

好看的icon

獨特的Github Profile 不能沒有icon ，以下分享我自己所使用的icon 網址。

社群網站icon

https://icons8.com/ 這個網站有各式各樣的icon，我的connect with me 區域就是從這個網站來的。

各式程式語言與IDE icon

https://github.com/Ileriayo/markdown-badges
在這裡有大神幫你製作好的各式各樣的程式語言、IDE、framework的精美圖片。
讓你可以放置在你的language and skill 區域。

其他美化Github Profile 的工具

• 各式各樣的label https://github.com/badges/shields#backers
• 填寫完畢後，自動有產出你的Github Profile https://rahuldkjain.github.io/gh-profile-readme-generator/
• 展現你的github 貢獻  https://github.com/anuraghazra/github-readme-stats
• 歡迎嵌入這邊的gif https://gifer.com/en

如果這篇文章帶給你很多收穫，歡迎請我喝杯咖啡>> 立即贊助🤗
支持我可以持續的創作。

歡迎在0 Comments按個愛心，並且按下「訂閱」這樣就可以每週收到我的即時電子報！
有任何問題，也歡迎在留言區留言。

你還可以許願，花個5分鐘幫我填寫下問卷，讓我知道你更喜歡什麼樣類型的文章！！！
問卷網址如下https://forms.gle/iVmPmnvJW22bpxbc8