React/Redux構成で習作として何かWebアプリケーションを作ろうと思い、GW終わりから3日ぐらいでWebアプリケーションを作った。アイデアが浮かばなかったので、普段よく使ってるサービスで何か作れないかなと思い、はてなブックマークの閲覧用クライアントを作ることにした。エントリーに紐づくコメントを保持するAPI設計ReactからAPI経由でデータを取得する必要があるため、APIを設計する。基本的にREST準拠で、レスポンスはjsonで返却する。/api/v1/entries/:feed_idエントリー情報をfeed_id指定で取得クローリング設計はてブのRSS*2から最新のホットエントリ一覧を取ってくる。総合カテゴリなら以下のURIから取得できる。http://feeds.feedburner.com/hatena/b/hotentry/RSSのフィードはこちらから定期的に取りに行く必要があるので、スケジューラーでクローリングタスクを回すことにした。Herokuアドオンのスケジューラー(無料)を使い、1時間おきに以下のクローリングタスクを走らせている。https://github.com/tic40/emperor/blob/master/lib/tasks/task_crawl.rakeエントリー詳細情報の取得RSSからホッテントリ一覧は取得できるが、エントリーに対するコメントなどの詳細情報は取得できない。デプロイGitHubのmasterブランチ更新時に自動デプロイが走るようにCircleCIのデプロイレシピを記述した。--apiAPIのレスポンスはHerokuのRedisアドオン(無料)を使い、キャッシュすることで高速したフロントエンドの構成はReduxを使うため、以下のような構造にした。FWにはBulmaを採用した。UIデザインはHackerNews(https://news.ycombinator.com/)ライクにした。ヘッダーをつけてリクエストする必要があるHeroku無料プランだとDBレコードが10000までという制限がある。エントリーに対するコメントもDBにインサートしているため、あっという間に10000行を越えてしまった。データを溜める意味はなかったので、DBにデータをためないようにRSS更新の際にレコード削除して直近のRSSに含まれているエントリー情報だけDBに保持することにした。1時間に一度しかクローリングしてないので、リアルタイム性は全然ない。Herokuは楽やっぱり個人で開発するならReactよりVueの方がいいかな。ブログを報告するスターをつけました引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。