プロクラシスト

今日の寄り道 明日の近道

Kindleセール情報のページを自動で作ってみました!


スポンサーリンク

こんにちは!ほけきよです。

この度、Amazon APIというものを知りました。

「あ、これでセール情報は自動で抜き取れるんじゃないか?」

と思って、頑張って作ってみました!!

Kindleセール情報

結論から言うと、kindleセール情報は簡単に取れました。他のセール情報は雑多なため、フィルタリングが難しいなという印象です。でも面白そうだし、いずれやるかも?

作ったのは↓のページです。 クローリングして、セール情報と価格を取るようにしました。

www.procrasist.com

構成は以下の通りです。

  • 常設のセール情報
  • 新着のセール情報(公開中)
  • セール予定の情報

バーで割引率を表現

上にあるバーは、価格の割引率を表しています。 なるべく直感的に、安さが分かるようにしてみました。

UIにはこだわりたかった

下記のようなレイアウトです。常設セールは大きめ、新着セールは小さめで作りました。

上のバーもそうだけど、なるべくシンプルに、なるべくわかりやすく。を目標に作りました。 カーソル当てると大きくなったりもさせてみた!

f:id:imslotter:20171012214400p:plain

css難しい。。。正直レイアウトに最も時間がかかっています。笑

とりあえず後で調整は出来るので、自分の中で納得の行くところまで頑張ってローンチしてみました。

Bootstrapを今回初めてちゃんと使ってみた。4.0系を間違って使い始めたことに気づいたときには遅くて、

「全然反映されない!!」

とかって悩んだりしてましたwまだ3.0の解説記事ばっかりだからね。でもいい勉強になった。

本当は全自動にしたい

内容は自動生成

ここの情報/文章自体は自動生成させています。 情報だけ抜き取って、HTMLファイルにはめ込むっていう形で作ってみました。

結構、細かいところの調整とかまだうまく行かないこともあるかもしれないですが、ちょこちょこと調整していきます!

投稿まで自動化したかった

もともとは、はてなAPIで自動投稿が出来るっていうのを知って、

え、じゃあ全自動記事生成器でもつくろ

と思ってはじめたんです。 けど、なんかHTMLのまま投稿する方法がよくわからず、そこははてなの投稿画面に行って温かみのあるコピペをしています。

Markdownとプレーンテキストはできたんだけどなぁ。。。

それも出来るようなら全自動が実現します!

メンテナンス・更新は随時します

自動といっても、amazonAPIが変わる可能性もありますし、まだまだUIは変えたいなって思っています。 ですので、定期的にブラッシュアップをしていきます。

でもこれで、面倒な作業は自動でして、労力を割くべきところに割けるようになったので、 どんどんと改築していきます!

ページのブラッシュアップ履歴はこの記事に残す予定です。ではではっ!

PROCRASIST