インフラ費を極限まで抑えてWebアプリを構築した話

Webアプリを作りたいけどどうしてもインフラ費がかかる。
だけど費用を意識しすぎると、本番運用に耐えられないくらい脆弱になってしまう。
ということで、極力インフラ費を抑えつつ、なんとか本番運用にも耐えれるよう工夫して、Webアプリの開発をしました。
費用について実質かかっているのは、お名前.comで発行したドメインの維持費（1年間で1700円くらい）のみ。

作ったものとコストの抑え方、インフラ構成について紹介させてください。
# 執筆者について
- 都内のWeb系企業のバックエンドエンジニア。今回はバックエンドを担当
- 都内の自社開発企業のエンジニア（開発リーダー）。今回はフロントエンドを担当

の2名。大学からの友人。

# 発端

友人との以下の会話が発端。

休日暇すぎるよね〜
→ じゃあ何か一緒に制作しようよ！
→ ついでに仕事にも活かせるといいよね〜
→ ついでに小銭も稼げると嬉しいな
→ じゃあWebアプリ作ろうよ！

# 作ったもの
"ratee（レイティー）"というWebアプリを作りました。（使ってみてくれたら嬉しいです）
https://ratee.nam-club.com/


<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/437241/9e797a40-37d1-43cf-6165-c92222ef3ded.png" width="80%">

rateeは、アカウント作成不要で誰でも気軽にアンケートを使って世の中の意見を探す・見る・集めることができるアプリです。

もちろん、モバイル版もあります。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/437241/1fbd93d7-80a0-2000-0442-4f46018397d6.png" width="50%">

サイトの説明はここまでにして、早速どのような工夫をしたのか紹介させてください。

# 開発方針
**極力料金を抑える** これに尽きます。
都内住みひよっこエンジニアにはAWSを贅沢に使う資金はありません。
抑えた上で、ユーザが増えた時にスケールできるよう考慮もしました。

# 使用技術・構成

### バックエンド
| 項目             | 内容                                |
| ---------------- | ----------------------------------- |
| クラウドサービス | AWS                                 |
| リソース管理     | CloudFormation + SAM                |
| API              | API Gateway + Lambda                |
| DB               | DynamoDB                            |
| CI/CD            | GitHubActions                       |
| 言語             | Python                              |
| DNS              | お名前.com + AWS CertificateManager |

### フロントエンド
| 項目             | 内容                                |
| ---------------- | ----------------------------------- |
| クラウドサービス | Netlify                                 |
| フレームワーク     | Nuxt3                |
| DNS              | お名前.com +  Netlify |


### システム構成
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/437241/ee7d24b9-2eb6-d2f7-a6cc-818c4e25711f.png" width="80%">  

かなりシンプルな、API Gateway, Lambda, DynamoDBを使ったサーバレスの構成。  

### デプロイのフロー
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/437241/f7044c33-6690-ad27-2e40-506ab8df6c6f.png" 
 width="80%">

GitHubへのPushをトリガーにGitHubActionsを動かし、swagger(S3にyamlを配置)とCloudFormationスタックの更新をする構成。
コードの記述を減らすために、API Gatewayはswaggerを読み込んでエンドポイントの定義を作成します。（[参考]()）

# じゃあどうやってコストを抑えたの？
### AWS無料アカウントを毎年作り直す
AWSにはサービスによっては1年間の無料枠というものがあります。
利用開始から1年が経つと使えなくなる無料枠です。
休日開発でなかなか時間も作れないので、当初から1年以上開発に時間がかかることは想定していました。
1年後もずっとその枠を使い続けるには、1年経ったタイミングで、一度アカウントを退会し、新たに作り直す必要があります。
しかし、退会した直後にそのアカウントが再度1から作り直せるわけではありません。[９０日間、閉鎖されたアカウントとして保持されています。](https://docs.aws.amazon.com/ja_jp/accounts/latest/reference/manage-acct-closing.html#:~:text=%E3%82%A2%E3%82%AB%E3%82%A6%E3%83%B3%E3%83%88%E3%81%AF%2090%20%E6%97%A5%E5%BE%8C%E3%81%AB,AWS%20%E3%81%8C%E5%89%8A%E9%99%A4%E3%81%95%E3%82%8C%E3%81%BE%E3%81%99%E3%80%82)
そこで、GMailの**エイリアス機能**を使います。
（通常のメールアドレスに加えて、`hoge+エイリアス@gmail.com`のような形で`+エイリアス`を付与することで別のメールアドレスとして使える機能です。「メールアドレス エイリアス」などで検索してみてください）

1. 無料期限が切れそうになると、そのアカウントは退会する
2. メールエイリアスを使ってアカウントを作り直し（例えば`hoge+dev2@gmail.com`）

といった手順で既存アカウントの削除・新規アカウントの作成を行います。
もちろん、本番運用がスタートした後は、そのアカウントで上記手順を実施するとデータが消えてしまうため、行いません。あくまで駆け出し期間中のみ行う手順です。

開発期間中は1年経つ前にこまめに作り直しをおこなっており、いかにその手順を簡単に行えるかは重要でした。
そのため、必要は手順を全て`README.md`に起こしました。
**最終的に、アカウントの開設からWebアプリデプロイまでが、20分かからずできるようになりました。**（実務で使うこはほとんどないであろうスキル。。）

### 無料枠が用意されているサービスを使用
API Gateway, Lambda, DynamoDB, GitHubActions,  [Netlify](https://www.netlify.com/)は、どれも無料枠があり、個人開発環境での利用においては十分な枠があります。
唯一無料枠では無いのが、独自ドメインを作る際に必要なDNS。
[AWS Route53](https://aws.amazon.com/jp/route53/)と[お名前.com](https://www.onamae.com/)の2択で、料金はどっこいどっこいでしたが、駆け出し期間中はアカウントを頻繁に作り直すことを考えて、AWSとは独立しているため作り直しが不要で、管理が簡単そうな`お名前.com`を選択。

# お金の話だけしてもアレなので・・
エンジニアっぽく、システム的にイケてる（と思う）対応をした部分も紹介します。

| イケてるポイント | 内容 |
| ----- | ----- |
|  CI/CD     | dev, stg, prodブランチを用意し、それぞれのブランチへのPushをトリガーに、別々の環境へのデプロイを行うGitHubActionsが走る。     |
| IaC(Infrastructure as Code)     | ほぼ全てCloudFormationで管理。WebアプリをデプロイするためにAWSコンソール等で必要な作業はほぼゼロに。     |
| スケーリングの対応     | サーバレスサービスを採用。（LambdaやDynamoDB）<br> ユーザの増加にも柔軟に対応    |
| 生成AIの活用法     | 基本的に、頭の中で設計ができたら、簡単に文字に起こして、ChatGPTに投げ、最初の叩きを作ってもらいます。もちろんデバッグなどにもフル活用。Cursor, GitHub Copilot, Perplexity等々、極力生成AIを活用し時間短縮を図りました。     |

# おわりに

もちろん、1年以上本番運用をしている場合や、アクセスが増えた時には無料枠では収まりません。
本稿のほぼコストをかけない手法は、それに当てはまらないときにだけ使えます。
もしそのような状況になれば、当然それはアプリを使ってもらえているということなので、スケールのしやすさというサーバレスのメリットを使い、サービス維持のためにコストをかけるつもりでいます。

また、コストに対する意識は、本業でも活かせるのかなと思いました。
ただ、コストを節約する比重をかなり高めにしシステムの品質を犠牲にした部分もあったので、コストと品質のバランスも大事だと改めて思ったところです。

# 今後
Webサービスだけ公開してもユーザは集まりにくそうなので、スマホアプリも作ろうかなと思っています。
iOSは審査が厳しく費用もかかるので、まずはAndroidアプリをリリースする予定。
 *P.S. Androidアプリは、20人のテスターを集めないとリリースはできないとのこと・・（他の方の記事: [怒ってます。Androidの新リリース基準酷すぎる](https://qiita.com/yuto-ktok/items/f13d56d6aaceba892ecb)）*