はじめに

初めまして、普段は自分のブログで記事を書いていますが、今回はQiitaの方に初投稿させて頂きました。
初めて一人でWebサービスを作ってみたので、ご紹介（宣伝）させていただきたいと思います。

作ったもの

Webアプリ作りました！ https://t.co/Jvb7UjaYYo pic.twitter.com/WVsa1elSTd
— R.T (@Dr_RT) 2018年12月4日

お好みのジャンルを3つ答えると、オススメの作品を提案するサービスです。

参考にしたもの

顔認識AI + LINEの新機能でAVソムリエを作ってみた

AIで似ているAV女優を紹介しているスケベAI「スケベ博士」を作りました。

きっかけ

きっかけは上記の記事を見て、実装方法まで詳しく書いていたので自分にも出来るかもと思ったことと、もう一つニコニコ生放送の普段見ている放送で、AVの話で盛り上がりこういうサービスあったらいいねというコメントを受け、実際に作って放送で報告したいというモチベーションで開発をはじめました。

機能

好みのジャンルを3つ選択すると、ジャンルにマッチした作品を3つ紹介します。
なるべく3つのジャンルがマッチしたものを紹介していますが、3つのジャンルにマッチしなかった場合はどれか一つのジャンルにマッチングした作品を紹介します。

紹介した作品はパッケージと作品名、ジャンルそしてサンプル動画があればその場で見ることができます。

工夫した点

必ず3つのジャンルに完全一致した作品を紹介できるよう、選択肢の内容を調整しています。
スマホでも見やすいようにレスポンシブデザインに対応しています。
DMMのAPIを使って必要なデータをPythonで取得しています。

イマイチだった点

選択肢の内容を完全ランダムで出力していたら、結果が似たようなものしか出なかった。
マッチングのアルゴリズムにレーベンシュタイン距離というものを使っていましたが、選んだジャンルの文字数に依存する場面が多く、短い文字数だと似通った結果になることが多かった。
スマホからサンプル動画を見ようとすると、DMMのアプリのページに飛ばされてしまい直接見ることができない。

実装の概要

N予備校のプログラミングコースで学んだことを実践したいと思い、「プログラミング入門 Webアプリ」で学んだことをベースに実装しています。

Node.js(サーバーサイド)
Express(Webフレームワーク)
mocha(テスティングフレームワーク)
webpack(クライアントフレームワーク)
jQuery(ライブラリ、DOMフレームワーク)
Ajax(非同期通信)
などなど...

大枠はこれらの技術で作ることができましたが、細かいところは調べながら作りました。
Pythonにも興味あったので、スクレイピングでAPIを叩いてデータを集めています。

反省

N予備校の「プログラミング入門 Webアプリ」コースを一通り学んだのですが、内容の理解が浅く、セッション管理が理解しきれていなくて、複数のPCからアクセスすると選択したジャンルをユーザ同士で共有し合うという状態になったりしていました。
フレームワークなどの技術も理解が浅いので、何がどこに役立っているのかもイマイチ分かっていないです。

しかし、理解が浅いことを理解したので、今後はこれらの技術について調査し、内容をまとめて理解を深めていきたいと思います。

今後

定期的なアップデートを目標に、どんどん機能改善・追加していきたいので、何かご意見・ご感想・ご要望等があれば気軽に問い合わせてくれると幸いです。
最終的にはアキネーターみたいにAIで、質問や選択肢の内容を変えていき、利用者の深層心理で求めている作品を提示していく方向に持っていければと考えております。