MoviReco開発日記 #1 - なぜ映画推薦サービスを作ったのか

MoviRecoとは？

「映画を観たいけど、何を観ればいいか分からない…」
そんな悩みを解消したくて作った、3つの質問に答えるだけで映画をおすすめしてくれるWebサービスです。
MoviReco

トップ画面

映画表示画面

作ろうと思ったきっかけ

私は自宅で映画を観るのが好きなのですが、NetflixやAmazon Primeなどで作品を探しているうちに、気づけば時間だけが過ぎてしまい、結局なにも観ずに終わってしまうことがよくありました。

「迷う時間を減らして、もっと気軽に映画を観られるようにしたい」
そんな思いから、このサービスの構想が生まれました。

技術スタック

• バックエンド: Java / Spring Boot / PostgreSQL
• フロントエンド: Nuxt3 / Vue3
• インフラ: Docker / Render
• 外部API: TMDb API（The Movie Database）

工夫したポイント

仕様面での工夫したポイント

• 映画の視聴目的は人それぞれなので、「気分」で選べるように質問ベースでジャンルを絞り込む設計にした
• ユーザーが迷わないよう、質問は3つだけに絞ってテンポよく進められるようにした
• 映画の紹介画面は、スワイプUIを採用し、直感的かつスマホでも使いやすいように工夫した

技術面での工夫したポイント

• JWTトークンをHttpOnly Cookieで安全に扱う構成
• TMDbの柔軟な検索機能を活かしつつ、独自のキーワード設計を行うことで、ユーザーの気分や好みに応じた映画をより的確に推薦できるよう工夫しました。
• 一度に取得する映画の数を必要最小限に絞ることで、外部API（TMDb）へのリクエスト負荷を軽減
• 同じ条件での再検索時は、フロント側でローカルキャッシュ（localStorage）を活用することで、APIへの不要なリクエストを防ぎ、ユーザー体験を損なうことなくパフォーマンス最適化を実現しました。

今振り返って思うこと

初めての個人開発だったこともあり、サービスの構想から実装、リリースまでをすべて一人でやり切れたことは、自分にとって非常に貴重な経験になったと感じています。今後もユーザーの使いやすさやパフォーマンスの向上を意識しながら、改善できる点を継続的にブラッシュアップしていきたいと思います。

おわりに

今回は、映画推薦サービス「MoviReco」の開発背景や、仕様・技術面での工夫についてご紹介しました。
まだまだ改善したい点や試してみたい技術がたくさんあるので、今後もこのサービスを通して学んだことを少しずつ記事にしていけたらと思っています。