webアプリを独力で作る体験をするのだ[AWSを使ったSPA, API設計を考えた]
設計が完了した
つい先日、AWSのサービスをひたすら適当に列挙していきました。 さらに適当な考察の末、それっぽい設計ができたかなと思います。 これから以下の画像についてざっくりと説明していきます。 (最初画像貼り忘れてた...)
フロントエンド
SPA
Single Page Applicationの略です。 最近やたらとサクサク動くwebサービスが多いなと思っていました。 調べてみるとフロントでレンダリングして、非同期的にデータを取得してるとかいう、 誰が考えたんだよ、天才かよ、っていうものがあったのでそれを作りたいなとなりました。
フレームワーク
SPA作るに際してフレームワークは何にするの問題があって、 みたいな話は以前した気がしますが、Vue.js を用いて実装していっています。
S3, CloudFront
SPAはただの静的ファイルのため、S3 において置くだけで良いようです。 ただ、S3において置くだけだと、アクセスはできないですし、 アクセス許可するとそれはそれでセキュリティ的にどうなのってなるので、 S3の前に CloudFront を噛ませます。 これで安心安全Https接続ですね。あまりhttpsが何かはまだわかっていないんですが...。 以下のページを参考にさせていただきました。 皆さんありがとうございます。
AngularJSで作ったSPAをAWS上の「S3＋CloudFront」でお手軽ホスティングして、クラウドサービスってやっぱ素晴らしいなと思った話 | I am mitsuruog
SPAを S3+CloudFront で表示する方法 - Carpe Diem
[CloudFront + S3]特定バケットに特定ディストリビューションのみからアクセスできるよう設定する ｜ Developers.IO
バックエンド
Web API
SPAにはバックエンドが必要です。 いや、何にでもですね、すみません。 基本的にSPAのバックエンドはWeb APIを作れば良さそうです。 将来的にはこの構成で、ネイティブアプリにも対応できるなとか考えてはいます。
フレームワーク
ここもまた前に話した気がするのですが、 Node で hapi を使って実装していきます！
Elastic Beanstalk
Googleさんに聞いている限り、 バックエンドはAPI GatewayとAWS Lambdaで実装するパターンが多い気がします。 しかしながら、結構強めのバックエンド作ってやろうと意気込んでいたので、 (あとはシンプルにいつも触っていたので) Elastic Beanstalk を使うことにしました！
データベース
PostgreSQL
今こいつで死ぬほど詰まっています。 なんでDynamoだけじゃないの？って聞かれたら データサイエンティストになるならSQLは書けなければならない。 って誰かに言われたからです。 SQLなんてちょろいやろって思ってたんですけど、 SQL書き始める前のセットアップが辛すぎて泣きそうです。
Dynamo DB
メインは楽そうなのでこの子です。 しかも無料枠の幅が広い。 太っ腹や！！！！ NoSQLというのもそうですが、 こっちはAWSコンソールで操作ができるので、セットアップがある程度楽そうですね！ 最初のテーブル作るのとかGUIをAWS内で提供してくれてるの良いです
まとめ
こんな感じで設計がまとまりました。 ほぼ全ての設定で詰まっているのでなかなか進みませんが、 頑張っていきたいと思います。
