💨

ほぼ無料!?AWSでサーバレスアプリケーション開発

に公開

開発したアプリ

開発したアプリは路線検索をメインとした海外旅行向けアプリです。
個人開発は今回初めて挑戦しました。

画面はシンプルなデザインにすることで操作性を高めることを狙いました。
天気、為替の情報が表示されその後、Yahoo乗換案内と同じように出発地と到着地の駅名を入力し検索すると検索結果のページへ遷移します。
駅名の入力は カタカナ、英語どちらにも対応しており検索条件を保存/呼び出しできる機能で
入力の手間も削減できるようにしました。

<構成図>

外部APIは従量課金でありなるべくコストを抑えたかったので日時データの取得は夜間バッチでDynamoDBに入れ、クライアントからはDynamoDBから呼び出しするようにしました。
※外部APIのコスト > DynamoDBの呼び出しだったため。
またアプリケーション側にもLRU Cacheを取り入れました。
これによりコスト、パフォーマンスの2つの面で最適化を実現しました。
既にお気づきの方もいると思いますが今認証や認可の仕組みは入っていません。
理由としては機密データの送受信やアカウント管理を実装していないからです。
とはいえイタズラされては困るのでAPI KEYによる呼び出し回数制限やCORS設定などは設定しました。

きっかけ

私は国内での移動時には yahoo 乗換案内のアプリを利用しています。
海外旅行へ行くことが好きなのですが、海外にいる時はgoogleで検索したり、都度現地のマップを見たりしています。ちょうど1年前に海外へ行った際に毎回 google 検索をするのが手間に感じる瞬間がありました。(google mapではなくノーマルなgoogle検索)
transitの情報を調べるのも、レストランを調べるのも、調べるものはすべてgoogleだったので毎回検索フォームを入力しなおすのががややストレスだったわけです。
そこで乗換検索やその他(旅行でmustな情報)を1つで管理できるアプリが欲しいと感じ開発を始めました。

開発期間

現在はプレリリースの段階でこれからユーザレビューの内容を含めver 1.0に向けて準備している段階ですがここまでの「企画」→ 「要件定義」→「技術選定 & 調査」→「設計」→「開発」で約6か月かかりました。他のことも色々やりながら並行して進めていたので振り返ると期間はかかったものの実際の工数としては 100h ~ 150h くらいなのかなと思います。

難しかったこと

フェーズで言うと「要件定義」、「技術選定」が難しく感じました。
まず要件定義ですが機能要件と非機能要件の切り分けです。
個人で開発しているので考えているうちに色々とアイデアが増えていき、非機能要件であるはずのものを機能要件に含めたくなるようなことが結構ありました(笑)
ただコンセプトが固まっていたので、結果としてはうまく切り分けできたかなと思っています。

続いて技術選定についてですがここでは大きく2つの部分に苦労しました。
✅ 外部APIの選定
「ある機能を実現する」にあたって使用できるAPIは複数あるので、その中から自分の中でのニーズを最も近いものを探す必要があること。加えて開発フェーズのことも考えて公式ドキュメントやナレッジなどが比較的充実しているものを1つずつ探しました。(ここにかなり時間がかかりました)
※最終的に利用したものは「付録」の部分に記載していますのでそちらご参照ください。

そして使うものを決めた後はほんとに自分の要望通りに使えるのかの検証をしていました。
ここも割と時間を取られましたが公式ドキュメントや先駆者の記事、Copilotを駆使して乗り切りました。

今後の展望

まずは現在行っているユーザレビューの内容をもとに ver 1.0 を仕上げたいと思っています。
そして非機能要件としていた部分やレビュー内容を踏まえて機能を追加していきたいと考えています。
自分で作ったからこそ愛着が湧いているので育てていきたいなと笑
その先はネイティブアプリ化やシェア獲得に向けてマーケティング的なことにも手を出していき
多くの方に使っていただきたいなと思っています。

付録

使用した外部API
・Route API (Google Maps Platform)
・Places API (Google Maps Platform)
・One Call API 3.0 (OpenWeather)
・Open Exchange Rates API

開発に使用したAWSサービス
・AWS Amplify
・Amazon API Gateway
・Amazpm S3
・Amazon DynamoDB
・AWS Lambda
・Amazon EventBridge
・AWS Systems Manager

その他
・Vue.js
・Quasar
・Typescript

Discussion