資産管理アプリ開発記録 – 2.技術スタックの選定

はじめに

前回、めちゃくちゃアバウトな「1. 要件定義とデザイン」をやったので、今回は技術スタックの選定を行う。

経験年数はばらばらだけど以下は触ったことがある。

使う技術としては、以下2つの基準で選ぶ

この個人開発は知見の蓄積・スキルアップが目的でもあるので、名前は聞くけどあまり触ったことがないものを選んでみる。

ただ、なんでもかんでも新技術を詰め込むと時間もかかるし、挫折もしそうなのでその辺りは柔軟にやっていく。

フロントエンドは以下の技術を使う

VueかReactか迷ったけど、今回は少しだけVueの経験があったのでVueを使ってみる。

あと、JavaScriptを使うならTypeScriptを使うのが一般的みたいだし、個人的に買った以下の本もTypeScriptで書かれていたので採用する。（ただ、動くものを最優先なのでanyなどは許容する）

UI Framework(CSS)には、Vuetifyを使おうと思ったが2でできていたことが3だとできなくなっていたりと、現時点ではまだ微妙に感じたので新規一転知名度もありそうなElement Plusを使ってみる。

バックエンドは以下の技術を使う

今回はフロントもバックエンドもJavaScript統一でやってみる。

構成としては、FaaSっぽくしたかったのでExpress.jsで用意したエンドポイントをフロントからのHTTPリクエストで叩き（RESTful API）、イベントが実行されるといったイベント駆動型のアーキテクチャでやってみる。

今回はお金かけずにやるつもりなのでExpress.jsだが、お金をかけるならAWSだとLambdaになるイメージ。

バックエンド側のTypeScript対応については、時間の関係上初期開発では見送る。

DBについては、RDBの経験しかなかったので新たな挑戦としてNoSQLでメジャーなMongoDBを使ってみる。

ただ、今回の開発においては、データの柔軟性やスケーラビリティはあまり意識しないのでRDBっぽく使ってしまう気もするが、それでも使ったことがあるっていう実績は経験になると思うのでやってみる。

前回の記事内で、機能としてログイン関連についても書いたが、個人利用なので今回は優先度を下げて対応してくので一旦保留とする。

今回はお金をかけたくないので、フロントもバックエンドもすべてローカルサーバ上での稼働とする。

無料とか安いもので使えるようなサービスがあればいずれそれに乗り換えようと思う。

Dockerとかも悩んだが、FaaSイメージなので今回は見送り。

バージョン管理としては、Githubを使う。

以上で技術スタックの選定はおわり。

上に書いた内容は初期開発として何を使うのかであって、開発を進めていくうえで変更する可能性はありそう。

書き漏れているものもあると思うけど、その辺りは必要になったときにトレンド調べながら取り入れていく。（GraphQLとかSSLとかも気になる。。。）

やっとやっとやっとこれで実装にはいれるーーー（長かった。。。）！！

本来なら設計をしっかりすべきところだが、今回はモック画面を作りながら必要なAPIエンドポイントやデータモデルなどを明確にしていく。