4
0

More than 1 year has passed since last update.

ポートフォリオとして転売を防止するアプリTenba×IyaというWebアプリを作った

Last updated at Posted at 2022-02-15

はじめに

ポートフォリオとして作成したWebアプリケーションの紹介記事です。

作成した人

- 独学でRuby on Railsの学習を行いWebアプリの開発を行っています。
- 仕事は建築関係の仕事に就いています。

作成したアプリの概要
- 「転売目的の商品の大量購入を防止する」ことを目的に作ったWebアプリケーションです。
- サービス名は「Tenba×Iya」としました。
- 転売屋と転売 嫌からTenba Iya、さらに嫌を×で表してみました。
キャプチャaa.JPG

最近、転売による商品の不足、高騰などが問題になっているなと思い、アプリを作成しました。
転売をするためには商品を大量に購入する必要があると考え、一つの商品を大量に購入できないような仕組みとしてアプリを作成しています。

ただ、アプリの作成はしましたが、購入する際に手間が増える、また、商品を売る側が積極的にアプリの使用を推奨しないといけないなどの問題があるため、アプリが広まることはないだろうなと予想しています。

アプリのURLはこちらです。
https://tenba-iya.herokuapp.com/

githubのソースコードはこちらです。
https://github.com/shosuke1989/tenbaiya

アプリの使用方法

別ページにまとめました。以下のリンク先に説明があります。
https://tenba-iya.hatenablog.com/entry/about

アプリの機能一覧

アプリの機能は以下のとおりです。

商品登録

商品名を入力することで、データベースに商品を登録できます。

商品検索

登録した商品を検索できます。データベースから一致した名前を画面に表示します。

SMS送信

商品を購入する際に、電話番号でSMS認証を行えます。
電話番号が間違っていたりするとエラー画面を返します。
SMS送信機能では、TwilioのAPIを使用しています。

チケット検索

一度発行したチケットについては、IDを検索するとチケットを再表示できます。
IDが存在しない場合はエラー画面を返します。

商品購入数のカウント

チケット表示画面や、商品画面に購入履歴などのカウント数を表示します。
データベースから合致する情報を検索して表示しています。

アプリの機能に関する考え

アプリに導入した機能や、入れることを見送った機能など、その他諸々について説明します。

ユーザー登録

ユーザーの登録については、アプリの機能的に、無くてもアプリが成立するため、導入しませんでした。
また、ユーザー登録がないほうが、アプリ使用のハードルが低くなるとも考えています。
ただし、今後アプリ使用料金を設定する時などに、ユーザー登録機能を追加し商品登録時に課金制とすることもありかと考えています。

例外処理

SMSを送信する際に、電話番号を間違っていたりすると、エラー画面を表示できるよう、例外処理機能を導入しました。

Twilioのトークンセキュリティ

APIキー等をgithubにアップロードしてしまうと、セキュリティ上問題があるので、dotenvのGemを使用して、環境変数内に情報を登録する方法を使用しました。

SMS利用料

twilioではSMSを1通送信するごとに10円程度の費用がかかってしまいます。
アプリの利用が少ない間は、費用が増大せず問題になりませんが、万が一アプリが世に広まってしまった場合は、SMS使用量が問題になるかもしれません。

githubの使用

個人での開発のため、githubでバージョン管理などは行いませんでした。

レスポンシブルデザイン

主に、スマートフォンでのアプリ使用を想定しているため、レスポンシブデザインは採用しませんでした。

サーバーにはHerokuを使用

無料で利用できたため、Herokuを使用しています。
Herokuでは、データベースでsqlite3が使用できないため、ローカル環境ではsqlite3を使用し、本番環境ではPostgreSQLを使用しています。

使用技術

使用技術についてフロントエンド、バックエンド、インフラで分けると以下のとおりとなります。

フロントエンド

HTML
CSS,Sass
Bootstrap

バックエンド

Ruby
sqlite3
PostgreSQL
Ruby on Rails

インフラ

VScode
Heroku
github
Twilio

アプリ作成時に躓いた内容等

躓いた内容というよりは、progateのカリキュラムの内容に入っていない技術などについては、自分で調べて実装しないといけないため、苦労した内容だと思います。

例外処理

SMSの送信時の電話番号入力の際に、電話番号の桁が足りなかったり、数字以外が入力されていた場合などは、バリデーションにより、弾くことができます。
ただし、数字で入力されてさらに桁数もあっているが、電話番号が間違っていた場合は、バリデーションを通過してしまいます。
その場合、twilioのAPI側でエラーが出てしまい、エラー画面が表示されてしまいます。
そのために、電話番号が間違っている場合には、例外処理を適用して、「電話番号が間違っています」のフラッシュが出るように実装を行いました。
例外処理という概念を知らない状況で、エラー画面を発生させないようにするためには、どうしたらいいかを検索することで、解決するための手段を探し出して実装することができました。

twilioのAPIキーのセキュリティについて

githubにAPIキーの情報をアップロードしてしまうとセキュリティ上、問題があります。
対策としてdotenvのGemを使用して、環境変数内に情報を登録する方法を使用しました。
このことも、なんとなくgiyhubにパスワードなどを上げると良くないだろうと、予想して、検索したところ情報を見つけることができました。

sqlite3とPostgreSQLの文法の違い

本アプリでは、ローカル環境ではDBとしてsqlite3を使い、herokuでの本番環境では、PostgreSQLを使用しています。
DBで単独でテーブルを利用するときは問題ありませんでした。
ただし、テーブルをjoinして複数のテーブルを結合するときに、sqlite3だとエラーが出ずに、PostgreSQLの場合にはエラーが出てしまいました。
エラーの原因は最終的に、それぞれの言語の文法の違いであり、sqlite3だと認められる書き方が、PostgreSQL認められない書き方だったため、エラーが出ていました。
ただ、以上のエラーに対する解決策を調べるのにかなり苦労しました。
取り組んだ対策は以下のとおりです。
①プログラムを細分化してエラー箇所を調べる。
②質問サイトで質問を投稿する。
③HerokuでPostgreSQLを使っていたため、試行錯誤する際に、毎回デプロイしないといけなく、非常に面倒だったため、PostgreSQLをローカル環境に構築する。
エラーが解決した後見直すと、大したことのないエラーなのですが、解決に非常に時間がかかりました。

以上です。
最後まで読んでいただきありがとうございます。

4
0
1

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
4
0