E20ebc67ce4d9529

LifeTime

OVERVIEW

人生が終わるまでの時間を表示するカウントダウンアプリです。

YEAR 2019

人生のカウントダウンとは

人生のカウントダウンとは今から死を迎えるまでの時間をカウントダウンで表示するサービスです。


使い方は非常に簡単で、「設定」から生年月日と性別を選択するだけです。


使用した技術

Nuxt.js

Nuxt.jsはVue.jsのフレームワークで最大の特徴はサーバーサイドレンダリングできることです。サーバーサイドレンダリングすることによって初期表示が速く、SEOに強いサイトを作成することが可能です。


また、@nuxtjs/PWAを利用することで簡単にPWA対応することができます。


Nuxt.js(SSR)を使用する際にデメリットもあります。その中のひとつのデメリットとしては、Node.jsが動くサーバーにデプロイしなければならないということです。


「人生のカウントダウン」では、現在Google App Engineで動いています。Google App Engineはデプロイするのは比較的簡単ですが、運用するにはある程度インフラの知識は必要かなと感じました。

インスタンス設定はできる限り安く抑えようとF1設定にしていますが、メモリ不足や料金が心配なのでしばらく様子をみようと思っています。


Vuetify

VuetifyとはGoogleが提唱しているマテリアルデザインのUIコンポーネントです。


2019年7月に、Vuetifyがついに2.0にバージョンアップされ多くのコンポーネントが追加されました!


「人生のカウントダウン」の「設定」で、

生年月日を選択するところがあるのですが、そこで、VuetifyのBirthdaypickerを使用しているのですがとても便利です。


Firebase

FirebaseとはmBassと呼ばれるものでサーバーサイドの部分を簡単に構築することができます。

Firebaseはさまざまな機能がありますが以下の機能を使用しております。


・Firebase Storage

名言のデータを保存しています。


・Firebase Functions

名言を一日ごとにランダムに表示するために使っています。


cron-job.org を使い毎日12時頃に、Fucntionsで生成されたURLにアクセスするようになっています。そこで名言一覧からひとつランダムに選び、FirebaseStorageの名言を更新するようになっています。

WEBSITE