GitHub Star Query というアプリを作ったよ🐱

昨日とあるアプリを作った。

名付けて「GSQ -GitHub Star Query- 」だ。 このアプリは単純なGitHub APIを使って作ったアプリだ。

概要は下記に記すので拝見していただこう。

※リポジトリのReadmeをそのまま引用したものだ。

このアプリについて

GitHubのスター登録したものをクエリ出来るアプリです。 GitHub標準のスターフィルターもあるのですが、少々使いにくさを感じることがあったり、モバイルアプリ版ではそもそもフィルター機能がなかったりするので作りました。

私はしばしば電車や移動の時に様々なGitHubリポジトリを見るのが好きで、よくスター登録機能を活用します。手軽に自分がスター登録したものを閲覧できるように作成しました。

👉 https://git-stars-query.vercel.app/

使い方

主に機能は3つ有ます

1. ユーザーIDで自身のスター登録したリポジトリを取得
2. 言語ごとでのクエリ
3. リポジトリネームでクエリ

画像付きで詳細を綴ります。

まずは一番上の入力フォームに自身のGitHubアカウントIDを入力します。入力後に右のアカウントボタンを押します。	アカウントボタンを押すと入力されたGitHubアカウントIDに紐づいたスター登録したリポジトリ一覧が表示されます。

続いて言語ごとのクエリです。「languages」というセレクタの状態は全てのstarを取得します。画像では「Dart」を指定しているのでDart言語のスター登録済みのリポジトリ一覧画面取得されます。	最後にリポジトリネームでのクエリです。リポジトリネームに含まれる単語を入力すれば取得できます。 画像では「supa」と入力することでsupabaseに関連するリポジトリが多く取得されています。

注意事項

APIの仕様上、一回のリクエストに対して100件のデータ取得までとなります。100件以降は「Next」ボタンを押すことで次の100件を取得できます。 また、1時間あたり5000件以上のリクエストが行われると制限がかかりますのでご注意ください。 制限中はデータを取得できないので、私が登録しているスターを表示させています。制限が開始して1時間経つと再びデータ取得が可能になります。

こだわりポイント

UI/UXを既存のGitHubよりも優れたものにできたと思います。

1. スマホ画面では1画面で最大6件のリポジトリが見られるところ。
2. リポジトリのホームページがあればリンク先へ飛ぶことができるリンクボタンがある(クリップのようなアイコン)

改善点

クエリの種類がまだ少ないため、機能補充を検討中。 夜でも目に優しいダークモードを実装

終わりに

概要でも綴ったが普段GitHubのスターを使う方には重宝する機能があると思うのでぜひ使っていただきたい。

また、GitHubのスター機能を使ったことがない方はぜひこれを機に活用してみてはいかがだろうか。

最近は新しい技術を学ぶことがあまりないのだが、こういった便利なものを作れるのはエンジニアならではなので良しとしよう。