rosh-1228のメモ

自身の勉強したことをメモしてます。

フィヨルドブートキャンプのシステム開発プラクティスにて、今までのコミット数ランキング化したアプリ「FjordBootCamp Contributors」をリリースしました

はじめに

フィヨルドブートキャンプの最終課題である自作サービスとして、bootcampアプリにPRを送ってマージされているかをランキング形式で確認できるFjordBootCamp Contributorsをリリースしました。 今までPRを送ってマージされたことのある人達のコミット数を期間別にランキング形式で表示されています。

github.com

目次

自己紹介

rosh-1228と申します。前職はSESの会社にて、ITインフラの運用/保守とSAP BASISをメインに設計/構築/運用/保守など仕事としておりました。

プログラミングをメインに仕事をしたいと思い、FjordBootCamp（フィヨルドブートキャンプ）というプログラミングスクールにて勉強をしております。

サービスについて

FjordBootCamp Contributorsは、元となったサービスがあり、Rails Contributersというものがあります。

こちらは、Railsに対して、PRを送った人をランキング形式で表示しており、期間別に今月 今年 今週 今日 コミットした日から今までの期間で表示されてます。

FjordBootCampでもRails Contributorsのように誰がどれくらいbootcampアプリにPRを送ってマージされているか確認されたいとあり、私がサービスを作らせていただきました。

FjordBootCamp Contributorsも、今月 今年 今週 今日 コミットした日から今までの期間の5つの期間別に、FjordBootCampAppにてマージされたPRに含まれるコミットの数をランキング形式で表示しております。

FjordBootCampAppの開発を行なっている人(システム開発プラクティスに参加されている生徒やメンターの方々)向けのサービスになります。

過去にコミットを行ったことがある人も、All Timeで自分がどのくらいコミットしたのか確認できます。

ちなみにAll Timeで自分は21位でしたw

また、各コントリビューターの今までのコミット一覧を確認することができます。

自分が今までどのようなコミットメッセージをしたのかを確認し、今後もっとわかりやすいメッセージに修正しようと見直すこともできます。

このランキングで、他の人よりも技術力がある・なしを図るものではないということだけ留意いただきたいです。

どこで使用するのか？

それでは、どういった場面を想定しているかというと、以下の使用場面を想定しています。

  • システム開発プラクティスで自分の今月や今週のコミットランクを確認して、やる気をあげる時
  • 就職活動で企業へ自分のコミット(どのようなコードを書いて貢献したのか)を見せる時
  • FjordBootCampで行われるイベントで、参加者全員でランキングを見て、誰がどんなコミットをしたのかなど話して盛り上がる

contribute数の集計時間

1日4回(0時/6時/12時/18時)Githubからコミット数を取得し、ランキングを表示します。

※Github Actionsを使用しているため、タイムラグが生じる可能性もあります。参考

技術スタック

開発中に苦労したこと

触ったことがあるものはRuby on Railsのみで、他の技術スタックは0からのスタートでしたので、かなり時間がかかりました。

プログラミングより環境を整えることに悩み時間をかけたと思います。

Githubから欲しい情報を入手すること

1つ目に、GithubからFjordBootCampAppのコントリビューターとコミットを全て取得する必要があり、これをGraphQLを使って実現しようとしました。

しかし、1つのリポジトリに所属しているコントリビューター全員のコミットを取得するといったことにはあまり関心を持っている方はおられず、調べても参考になりそうなものはなく、書き方だけ学びました。

そのため、Githubの公式リファレンスを参考にexplorerで何回も試しました。 ここに時間を最も使ったと思います。

また、Githubのapiは1度に100件しかコミット情報を取得することができず、FjordBootCampAppは10000件を超えるコミット数でした。

全コミット数/100回も繰り返しでGithubへ問い合わせすることになり、これで本当に良いのかと悩み他の方法を調べることにも時間を費やすほどでした。

https://docs.github.com/ja/graphql/overview/resource-limitations

今回はバックグラウンドで処理を行うので、サービスの操作が重くなるようなことはありませんが、ユーザーが何らかの登録や表示といった操作を行うサービスを作る際は、操作性について必ず考慮する必要があるなと思いました。

React.jsを初めて使った

今回、FjordBootCampのカリキュラムで勉強したVue.jsではなく、React.jsを使うことにしました。 これは、Vue.jsとReact.jsを比較して使うことを決めたとかはなく、React.jsを使ったことがないので、使ってみようという興味から決めたことです。 ただ、React.jsも使ったことがなかったので、どう書けば良いのかなど初めはわからず苦労しました。 特に、webpackerを使ってビルドする際に足りないモジュールがいくつかあったりして、システムテストでReact.jsを使ったコンポーネントが画面に描画されずに悩みました。

ホスティングサービス選択

Herokuが有料になるということもあり、代わりのホスティングサービスを探すことも苦労しました。

blog.heroku.com

今回はお金をかけずにサービスを作りたいと思っていましたので、Herokuが使えないとなると完全に代替できるサービスはありませんでした。

調べるとFly.ioとRailwayのどちらかが有力な候補となりそうということがわかりました。

初めはFly.ioの方が無料で提供してくれるサーバーのスペックが良さそうだと思い、試しにデプロイを行なってみましたがここで挫折して使うことをやめました。

fly.io

なぜなら、Rails.application.credentialsを使用していたのですが、Fly.io側でmaster.keyを登録しているにも関わらずデプロイ時にRails.application.credentialsがnilになってしまいデプロイがいつまでもできませんでした。

解決のための調査にも時間をかけたのですが、解決せず焦りばかりが募りました。

そこで、Railway.appを使ってみると、非常に簡単にデプロイすることができました。

railway.app

Railway.appはブラウザ上でGithubと連携するだけでデプロイをしてくれる上に、登録したmaster.keyの情報もしっかり読み込み余計な時間をかけずに済みました。

Railway.appの無料プランは、毎月5$のリソースを与えてくれるのでそれを消費しきるか、約20日連続稼働させるかすると、システムがダウンするようでした。

ただ、developerプランという1つ上のプランでは、毎月5$のリソースをくれた上でそれ以上のリソースを消費した場合に初めて課金されるというものでした。

また、連続稼働時間の制限はなくなるものでしたので、システムがダウンするよりは良いかと考え、developerプランに加入しました。

無料プランよりも良いリソースを提供されているので、それもプラスでよかった点です。

最後に

webに公開して誰かに使ってもらう事を意識してサービスを作る経験ができてとても良かったと思います。

前職でお客様へシステムを提供していましたが、すでに出来上がっているパッケージを導入したり、使いにくい・値段が高いと言われ本当にお客様が欲しいものを提供できているのかずっと疑問でした。

そのため、自作サービス進捗会で、デモを動かした時にkomagataさん、machidaさんに自分達にとって価値があるものができたと仰っていただいた時、誰かの役に立つものを提供することができた！と嬉しくなりました。

受託開発の会社に就職したいと考えている自分としては、komagataさんmachidaさんの要望に合わせて、開発を行いデモで実際の使用感の感想をいただいたり、修正を行なったりできたことも良い経験でした。

やはり、誰かの需要に応えられるエンジニアになりたいと思えましたし、これからも応えられるようにスキルを上げていきたいと改めて思いました。

このサービスがFjordBootCampAppの開発に携わる人の一助となれば幸いです。