본문 바로가기

Git/Github

Github - 꾸미기(WakaTime)

반응형

이전 포스트

https://codecollector.tistory.com/667

 

Github - 꾸미기(어떤 시간대에 주로 commit을 하는지 볼 수 있는 ui)

제 프로필에 다음 사진과 같은 ui를 추가하는 방법을 포스팅하겠습니다. 1. Project fork하기 원작자의 project에서 시간대를 한국/서울시 기준으로 맞추기 위해 약간 수정되었다고 합니다. 아래 reposit

codecollector.tistory.com

 

🍳머리말

github 자신의 프로필에 pinned할 수 있는 괜찮은 awesome-pinned-gists 것들 중에 wakatime이라는 것을 발견했습니다. 일주일 동안 제가 사용한 언어별 시간을 계산해 비율을 보여주는 ui입니다. 이렇게 pinned해서 보여주는 ui는 workflow를 통해 이루어져 비슷한 방식으로 진행하면 됩니다. 


📕 Project Fork

📔 링크

https://github.com/matchai/waka-box

 

GitHub - matchai/waka-box: 📊 Update a pinned gist to contain your weekly WakaTime stats

📊 Update a pinned gist to contain your weekly WakaTime stats - GitHub - matchai/waka-box: 📊 Update a pinned gist to contain your weekly WakaTime stats

github.com

이 repository를 fork해 자신의 repository로 가져옵니다.

자세한 방법은 이전 포스팅에 설명해 놓았습니다.


📕 설정

전반적으로는 fork뜬 project의 README.md를 따라하면 됩니다.

📔 public gist만들기

public gist를 생성해 만들어진 gist_id(url가장 뒷부분)를 따로 저장해줍니다. 이 gist는 ui를 보여줄 액자처럼 쓰여질 예정입니다. 자세한 방법은 이전 포스팅에 설명해 놓았습니다.

 

📔 wakatime 설정

  📑 wakatime 계정 생성

  https://wakatime.com/signup

 

WakaTime - Dashboards for developers

Open source IDE plugins for programmers.

wakatime.com

이곳에서 회원가입을 해줍니다. github로 로그인하시면 됩니다.

 

  📑 wakatime 계정 profile 설정

로그인 이후 https://wakatime.com/settings/profile 이곳에서 몇 가지 정보를 수정해야 합니다. (Display coding activity publicly), (Display languages, editors, operating systems publicly) 이 두가지를 check해주세요.

 

Hireable badge는 체크 안하셔도 무방합니다.

 

 📑 wakatime 계정 api-key 저장

https://wakatime.com/settings/api-key

 

WakaTime - Dashboards for developers

Open source IDE plugins for programmers.

wakatime.com

이 곳으로 가셔서 api key를 복사해 따로 저장해줍니다.

 

 📑 wakatime plugin 설치

wakatime api가 정보를 끌어올 곳을 정해 그곳에 plugin을 설치해야 합니다. 이후 설치된 IDE에 사용자가 작성한 코드들의 시간과 언어를 분석해 wakatime 서버에 저장하게 됩니다. 제 경우에는 vs code에 wakatime plugin을 설치하도록 하겠습니다. 마켓에서 waka만 쳐도 이렇게 extenstion이 나옵니다. 이를 설치해줍니다.

 

설치가 완료되었다면 F1 또는 crtl + shift + p를 눌러 wakatime의 api key를 입력하고 enter를 쳐줘야합니다. 상기 이미

지를 토대로 아래로 내리면 방식에 대한 상세설명이 나와있습니다. 이를 참고하면 좋습니다.

 

 

📔 token 생성

GH_TOKEN 생성 : https://github.com/settings/tokens/new

이 곳으로 들어가 Note(token 명)를 GH_TOKEN으로 입력해주시고 Expiration을 No expiration으로 설정, gist항목을 check하시고 새로운 토큰을 발급받습니다. 기존에 발급받으신 분들은 가지고 계신 token값을 그대로 이용해도 됩니다.

 

* Generate token버튼을 누르고 발급받으신 토큰 번호는 한 번만 보여주기 때문에 따로 저장을 하든지 아니면 일회성으로 사용하셔야 합니다. 새로고침시 보이지 않습니다. 이를 따로 저장해줍니다.

 

이제 저희는 3개의 정보를 저장했습니다. GIST_ID, WAKATIME_API_KEY, GH_TOKEN 입니다.

 

📔 secrets 설정

fork했던 repository로 들어가 settings로 들어가면 하기에 secrets라는 항목이 있습니다. 이를 클릭하시면 우측 상단에 New repository secret라는 버튼이 있습니다. 여기로 들어가 Name : GH_TOKEN, Value : 발급받은 토큰값을 입력하고 Add secret버튼을 눌러줍니다. 이 방법 대로WAKATIME_API_KEY, GIST_ID를 name으로 해서 맞는 value값을 넣어주고 Add secret버튼을 눌러줍니다.

 

 

secrets를 추가한 뒤 보이는 화면은 다음과 같습니다.

 

 

📔 .yml 설정

이제 다 왔습니다. fork 뜬 project main으로 돌아와서 .github/workflow/schedule.yml을 수정해야합니다. edit(연필 아이콘)을 클릭해서 다음과 같이 수정해줍니다. 수정 뒤 commit해줍니다.

name: Update gist with WakaTime stats
on:
  push:
    branches:
      - master
  schedule:
    - cron: "0 0 * * *"
jobs:
  update-gist:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@master
      - name: Update gist
        uses: matchai/waka-box@master
        env:
          GH_TOKEN: ${{ secrets.GH_TOKEN }}
          GIST_ID: ${{ secrets.GIST_ID }}
          WAKATIME_API_KEY: ${{ secrets.WAKATIME_API_KEY }}
          TIMEZONE: Asia/Seoul

 

 


📕 확인

이제 만들었던 public gist를 pinned하면 다음과 같이 확인할 수 있습니다.

 

* fork했던 repo의 action이 대략 1 ~ 3달 주기로 멈추기 때문에 계속 enable workflow해주셔야합니다.