GitHubCLIでこのブログのタスク管理ページを作りました

Blog Image

完成品はこちら

コード自体はレポジトリにあります

構成

GitHubCLIでissueをJSONで吐き出して、shadcn/uiのData Tableで表示しています

作り方(準備)

  • GitHub CLIをインストールして、JSONに吐き出します
  • このコマンドをGitHubActionsで定期実行設定&コミットするように設定します
gh issue list --state all --json number,title,state,url,body > public/currentIssues.json

作り方(実装)

ほぼサンプルそのままDataTableを使いました、ただデフォルトだとソートした時に列ごとの比が保たれなかったためtable-fixed付与しました

<div className="rounded-md border">
    <Table className="table-fixed">
        <TableHeader>