【個人開発】300円以内でおやつを選ぶアプリを作りました【えんそくのおやつは300えんまで！】

はじめに

はじめまして。
山田貴俊と申します。
先日「えんそくのおやつは300えんまで！」というアプリケーションをリリースしました。
内容は単純、300円以内でおやつを選ぶアプリです。

「えんそくのおやつは300円まで！」というWebサービス開発しました！

300円以内でおやつを選んで、結果をアプリ内もしくはTwitterで共有するアプリです。気軽に遊べるのでよろしくお願いします。https://t.co/19mcGxs2ma

— Takatoshi Yamada (@moyazine) October 24, 2022

本記事はその解説と振り返りになります。

サービス概要

300円以内でおやつを選択し、結果をTwitterや本サービス内ページ「みんなのおやつ」で共有するというシンプルな内容になっています。

本アプリケーションのURLとGitHub

なぜこのサービスを作ったか

友達との飲み会のつまみに駄菓子を持っていったら思ったより盛り上がったので「そのネタを元にアプリ作るの面白そうじゃない？」となって軽い気持ちで作り始めたのがきっかけです。
軽い気持ちで始めた割にはすごく大変だった。

遊び方

• 「あたらしくえらぶ」から好きなお菓子をクリック
• 決まったら「おかいけい」ボタンを押下して決定
• 結果を表示。任意でtwitter共有ができます。
• ログインするとアプリ内機能「みんなのおやつ」で他の人に自分が選んだおやつをみせびらかすことができます！
  

使用技術

画面遷移図(初期案)

気がついたらすごく遠くまで来ていた初期案(しみじみ)。
細かい動作に関しては違うけれども、挙動に関しては初めのプランからは外れていないです。
拡張機能に関してはまだ未実装。
バナナはおやつに入りません。

ER図

特に難しいことはしていないER図。
basketsは中間テーブルとして動作。AuthenticationsはTwitterログイン用のテーブルになります。
今後はレビュー機能などガンガンテーブルを追加したい(左下の空白は開発が間に合わなかった名残)。

インフラ構成図

バックエンドはAWSを使いました。
MVPはHerokuでしたが有料化の話もあり、AWSに乗り換えました。
インフラ周りは本当に苦戦しました。特にセキュリティグループあたり。
もっとスマートなやり方があったはず。

ちなみにフロントエンドはBootstrapです。

環境

• ruby: v3.1.2
• rails: v6.1.6.1
• node.js: v18.7.0
• postgres: v14.3
• redis: v6.2.7

rubyは3系列の安定版。Railsは安定版の状況とドキュメントの豊富さから6系を選択。
他は最新版を利用しました。

利用したGemのうち補足したいもの

メイン機能

• sorcery
  ログイン機能に利用。
  Twitterログインにも利用。

• config
  定数管理に利用。

• nogogiri
  スクレイピングに利用。
  おやつデータは主にスクレイピングを用いて取得しています。

• kaminari
  ページ遷移に利用。
  おやつ選択画面は無限スクロールになってます。

• ransack
  検索機能に利用。

管理画面

• carrierwave

• mini_magick
  管理画面にて手動でおやつ画像を追加するために利用。

• gretel
  管理画面のパンくずリストに利用。

テストとエラー解析

• rubocop

• rubocop-rails
  コードの静的チェックに利用。

• better_errors
  railsのエラー画面整形に利用。

• binding_of_caller'
  ブラウザ上でirbを用いるために利用。

• factory_bot_rails

• capybara

• webdrivers

• mock_redis
  RSpecを用いた自動テストにて利用。

• coverage
  カバレージ計測に利用。。

その他

• sd_notify
  production環境にてsystemdを用いたプロセス管理に利用。

• sitemap_generator
  SEO用にサイトマップを作成するの利用。

苦労した機能

• Redisを用いたセッション管理(ログイン不要で遊べる機能)
  元々CookieStoreでセッションを利用していたが、セキュリティ面とハッシュでデータを扱いたいためにRedisに移行。
  Cookieだと一旦Stringに変換されて扱われることを初めて知った。

• Twitterログイン/OGP
  callback等々。
  当然のことだけれども、Twitterに限らず外部のアプリケーション連携は仕様変更があるので最新の情報を取得するように。
  もちろんタイポにも気をつけよう。

• HerokuからAWSへの移行
  Heroku有料化の煽りを受けてAWSに移行したのだけど、インフラへの理解が圧倒的に足りない事を痛感した。
  AWSも無料枠を超えたら料金が発生するのでそのままHerokuに課金して利用を続けてもよかったかも。
  ただすごく勉強にはなった。

UU/PV

10日でUU数は148人。
PV数は869でした。
この記事を公開することで少し増えたらいいなあ。

Notionのバグレポート

原因と対処がはっきりとわかったバグに関してはNotionにまとめておきました。
この何倍もバグに対応した気がするので今後はもっとこまめに纏めておきたい。

終わりに

今回のアプリは構想からリリースまでおよそ4ヶ月かかりました。
現在働いている倉庫の仕事、実家の米農家の仕事、アプリ開発の3つのタスクを回していたという理由はあるものの、やはり開発期間が長引いた印象を受けますね...。
今後の展望としては機能拡張をメインとしつつ、デプロイの自動化など開発面での強化も行いたいと思ってます。
拡張する機能に関しては下記の機能を追加する予定。

• おやつのレビュー機能
• 選んだおやつを本サイトから買いに行けるような機能(楽天APIを想定)
• おやつのバリエーション追加

以上、何か改善点やご意見等ございましたらコメント・SNSでご連絡をお願い致します。