くるのプログラミング記録

プログラミングの感想とか解説とか。

競プロ駆動で開発している話。

adventar.org

この記事はCompetitive Programming (1) Advent Calendar 2020の23日目として書かれた記事です。

2023/05追記。

この記事で取り扱ってるwebsiteは下記のページにリプレイスしました。
https://ningenme.net/compro-category


はじめに

こんにちは。くるです。
atcoder.jp
競プロ駆動で開発している話をします。

概要

まずは成果物。

https://compro-category.ningenme.net/#/compro-category.ningenme.net

約1年ぐらい運用している自分用の精進記録webアプリについて話します。以下ポエムです。


なにをしているの?

自分が競技プログラミングで解いた問題をひたすら記録しています。
ラベルつけてある程度のジャンル分け、タグ付け。それと体感の点数をメモしています。
こんな感じ。



submission漁れば良くない?

全然それで事足りると思っています。まあ一応これ作ってるおかげでコンテスト中とかにジャンルから逆引きしたりはよくします。

それでレート上がってる?

あがってないんだな、それが……。
AtCoder青黄を波打った一年......。

開発する時間で精進したほうがよくない?

核心を突かれると、つらい。

ちゃんとジャンル分け出来てるの?

https://twitter.com/ningenMeの知識に依存しています。なので問題の本質の切り分けが下手だと雑なジャンル分けになりがち。まあそこらへんは見え方変わってくると時々修正したり。

意味ある?

楽しいので、ok。




こ こ か ら 本 題 。



システム構成図


ややこしいね。まずリポジトリが3つある。

- フロントエンド。s3上でvueで動いている。フロントって何ーって人はまあ、リンク先のブラウザで見てるものがフロントだと思ってもらえれば。s3って何?って人はawsクラウドストレージだと思ってもらえれば。vueって何?って人は......jsです!(雑)

- 文字通りapi。restです。apiって何ーって人はまあ、データ管理してるところだと思ってもらえれば。

- submission貯めてるだけのリポジトリ。本当にただの.cppがたくさんあるだけ。

フロントエンド

s3にvueのソースをビルドしたものを置いています。これだけで動くので簡単なアプリケーションなら一番楽に感じる。reactでも同じこと出来るよ。
今動いてるvueのソースはマジで書きなぐりなのでかなり汚い......(リファクタする意欲も失った)(動くのでok)

cloud front使ってhttpsでアクセスしてもらっています。このへんawsかなり楽で良い。ぽちぽちするだけ。証明書周りほぼノータッチ。
ドメインは昔から持っているので割愛(ドメイン取得はちょっと面倒だった記憶......)(気のせいかも)

バックエンド

ec2にjavaのアプリケーションをデプロイしています。spring bootで書いている。現状DDDやるなら一番好きなフレームワーク
フロントからapi-gateway越しにリクエストが来るのでいい感じにエンドポイントを用意している。api-gatewayもかなり使い勝手良いね。

エンドポイントはこれ。
https://ningenme.github.io/api-document/ningenme.github.io
spring fox使うとソースから自動でswagger作れるのでかなり楽。自分でyamlはもう書けない......。

あとdbは無難にmysql

CI/CD

フロントエンド / バックエンドはともに自動デプロイ。全部github actions。
chef, ansible, jenkins, code-deployとかいろいろ試したけど面倒さがだいたい上回るのでgithub actionsでシェル書くだけがなんだかんだ効率いいかなってなっている。怠惰趣味開発。
ちゃんとやるときは実機ならansibleがかなり好きなんだけどね。


submssionに関しては、いつもソースを記録用でgithubに残している。
こんな感じ(伝われ)

そのときにコードにアノテーションをつけて、pushしたときに自動でapiにデータ登録してくれるようにしている。
アノテーションはざっくりこんな感じ。

/**
 * @url https://hoge.com
 * @est 400
 */ 
int main() {
    return 0;
}

問題urlと体感点数を書いてpushすると、自動でdbに入る仕組み。パースはオレオレパースなので変なコード書いたらすぐ死ぬ......(運用で、カバー!)
問題登録時に、AtCoder, AOJ, Codeforces, yukicoderあたりなら問題名とかも勝手に拾うようにしている。そろそろTOKIも対応させたいね。

運用

だいたいこんな感じ。タグ付けがちょっと面倒だけど、問題振り返る機会になるので悪くはない。

用途

コンテスト中とか作問するときに、たまに逆引きで使う。
解いて意味あったなって思える問題だけ貯蓄してるので、虚無ばっかり埋めてることを実感する(悲しい)

さいごに

皮肉っぽくは書いたけどかなり自己満足度は高いです。問題を解いていく上でのモチベーションにつながると、楽しい。

ソースは全部公開しています。気になった方はぜひ。
github.com