11
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

レシピガチャを作ってみた

Last updated at Posted at 2023-04-12

作ろうと思った経緯

前回の Flutterでブロックが丸なブロック崩しゲームを作ってみた と同様、会社のメンバーで個人開発をやっていこうというイベントに乗っかって作ってみました。昔々に楽天の書籍APIを使って本の情報を表示させるWebアプリを作ろうとしていた時があったのですが、作りっぱなしで途中で終わってしまっていたので今回はRender.comにデプロイするところまで何かしら作ってみようと思った次第です。

技術スタック

  • ruby 3.2.1
  • Rails 7.0.4.2
  • tailwindcss
  • daisyUI
  • 楽天レシピAPI

どんなものができたか

レシピガチャです。下記URLにアクセス頂くと表示できます。初回アクセスはサーバが寝てたら起きるまで時間かかるのでご了承ください。

楽天レシピのAPIにアクセスして、ガチャ的な感じでランダムにレシピ画像と材料一覧を取得して表示させるWebアプリです。作り方などの詳細な情報はアプリから楽天レシピにアクセスして見てもらうとして、アプリ側では画像と材料だけ表示させる形にしました。

gacha1.png
gacha2.png

たまにハズレも出ます。APIからデータが取れなかった言い訳のようにも見えますが、これはハズレですw

gacha3.png

感想

  • まずは完成させることを第一に、機能は最低限でシンプルな作りにしました
  • レシピのカテゴリを指定できるようにするとか機能追加も考えたのですが、今回は一旦シンプルにこの状態で完成ということにしました。試したいこととかが出てきたら機能追加するかも
  • デザインはtailwindcssとdaisyUIを使いました。daisyUIはtailwindcssのプラグインで、ボタンなどのそれっぽいデザインのコンポーネントが用意されています。シンプルで柔らかい感じのデザインで使いやすかったです。普段デザインはやらないのでデザインが一番苦労するポイントだったりする
  • 昔に書籍APIを使おうと思った時もそうだったのですが、楽天APIは無料で使えて使えるAPIの種類も色々あるので、サクッと何か作ってみたいけどコンテンツ内容を自分で考えたりDB立ててまでやるのはなー・・・みたいな時にとても使いやすいなーと思いました

このプロダクトは、株式会社mofmofの「水曜日の個人開発」で作りました。

11
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
11
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?