Findyでエンジニアをしている栁沢(@nipe0324)です。
今回は、Findyの名物企画である「コントリビューション・オブ・ザ・イヤー2024中間発表」の裏側を公開します。裏側を知り、キャンペーンをより楽しんでもらえたら嬉しいです。
キャンペーン期間中にXでシェア後にフォームから応募することで「Anker充電器(Findyオリジナルデザイン入り)」が抽選で当たるかも!?
ぜひお申し込みください。
👇👇👇
コントリビューション・オブ・ザ・イヤー2024中間発表を試してみる
コントリビューション・オブ・ザ・イヤーとは
コントリビューション・オブ・ザ・イヤーとは、Findyの名物企画の1つです。
1年間のGitHubのコントリビューション数やFindyユーザー内でのランキングを見ながら開発成果を振り返る期間限定のイベントです。
コントリビューション数を見ることで、自分が日々どのくらいGitHubで開発しているかを知ることができます。
コントリビューション数やランキングを見るにはFindy上で自分のGitHubアカウントを連携している必要があります。もしまだGitHubを連携してない方はこちらから連携してみてください。
過去5回ほど開催しており、多くの方に楽しんで頂けました。
実際にXのシェアでは次のような声があり、開発の振り返りとして楽しんで頂けたようです。
ことしもがんばった
— せーい(CodingFeline) (@_yshrsmz) 2023年12月20日
【yshrsmzさんの2023年の振り返り】
2023年にGitHubで4,341コントリビュートし、月間の最大は462(4月)、一日あたりの平均は13/日でした。
あなたも今年のGitHubでの活動をチェックしよう!
https://t.co/4saXCthnEV
#コントリビューション・オブ・ザ・イヤー2023
草はやしきれなかったのが悔しい
— もぐめっと❄️ITイノベーター (@mogmet) 2023年12月21日
【mogmetさんの2023年の振り返り】
2023年にGitHubで4,715コントリビュートし、月間の最大は663(2月)、一日あたりの平均は13/日でした。
あなたも今年のGitHubでの活動をチェックしよう!
https://t.co/MzvBGuMw8k
#コントリビューション・オブ・ザ・イヤー2023
今回は、「コントリビューション・オブ・ザ・イヤー2024中間発表」ということで、2024年の1月から6月のコントリビューション数とランキングを振り返ることができます。
コントリビューション・オブ・ザ・イヤーの裏側
コントリビューション・オブ・ザ・イヤーの主要な機能について2つ紹介します。
- 裏側①:コントリビューション・オブ・ザ・イヤーのランキング表示
- 裏側②:コントリビューション・オブ・ザ・イヤーのOGP表示
裏側①:コントリビューション・オブ・ザ・イヤーのランキング表示
コントリビューション・オブ・ザ・イヤーでは、Findyユーザー内で「期間内のコントリビューション数のランキング」を表示しています。(ランキングの数字は上位の方のみ表示)
実装にあたり、SQLでランキング表示を実現すると、クエリが複雑になりパフォーマンスも出しにくいという問題がありました。
そのため、RedisのZREVRANKを採用しました。
ZREVRANKはソート済みセットのスコアが高いものから低いものに並べてデータを取得可能で、次のような形でシンプルにランキング表示を実装できます。
# ランキングの取得処理イメージ def contribution_ranking # zrevrankを使ってランキングを取得 ranking = redis.zrevrank(store_key, user.id) return nil if ranking.nil? # zrevrank は0始まりで順位を返すので、1を足して1位からの順位にする ranking + 1 end
このように、Redisの機能をうまく利用することで、シンプルな実装で、ランキングの値を高速に取得しています。
裏側②:コントリビューション・オブ・ザ・イヤーのOGP表示
また、コントリビューション・オブ・ザ・イヤーでは、XでシェアしてもらったときにOGP画像を表示しています。
Xのポスト上でOGP画像を動的に生成する流れは次のようになっています。
- XからFrontend(Next.js)がリクエストを受けて、Next.jsのサーバーサイドレンダリング(SSR)の機能を使ってOGP画像のURLを返す
- OGP画像の生成は、内製のOGP画像生成サービスを利用して、APIの動的データをつかってユーザーに応じたOGP画像を生成している
ちなみに、内製のOGP画像生成サービスは、Findy内でOGP画像を生成するマイクロサービスを用意しており、他機能のスキル偏差値やおみくじなどのOGP画像を生成するためにも使われている特徴的なサービスです。
また、今後の技術的な取り組みとしてNext.jsのApp Routerを活用することで、OGP画像の生成をNext.js上で実現できないかも思案しています🤔
コントリビューション・オブ・ザ・イヤーを楽しんでください
現在、「コントリビューション・オブ・ザ・イヤー2024中間発表」が期間限定で開催されています。
ぜひ、2024年上半期のコントリビューション数を振り返って、2024年後半のモチベーションにつなげてもらえると嬉しいです。
キャンペーン期間中にXでシェア後にフォームから応募することで「Anker充電器(Findyオリジナルデザイン入り)」が抽選で当たるかもしれません!
👇👇👇