ぎにょろぐ

Androidアプリ開発に関する事やその他雑記など

ボードゲームの戦績を記録するアプリを作りかけた(Vue.js + Vuetify + Firebase)

はじめに

この記事は、ギークハウス元住吉 Advent Calendar 2018 - Adventar20日目の記事です。

11月から12月の序盤にかけて、謎のやる気がありAndroidアプリ開発以外もしたくなったので、会社の人がハマっていたVue.jsと、モバイルアプリでよく使っているfirebaseを使ってナウいサーバーレスのアプリケーションを作っていました。

その頃ギークハウス元住吉ではドミニオンが流行っていたので、題材はボードゲームの戦績を記録するアプリとしました。

また、タイトルにもある通り、完成はしていません。途中でスマブラが出たなど諸般の事情でためやる気が完全に吸い取られましたためです。 また気が向いたら開発を再開しようと思っています。

アウトプット

アプリケーション

https://boardgame-battle-log.firebaseapp.com/

githubレポジトリ

github.com

採用した技術

  • vue.js
    • vuetify
  • firebase
    • firestore
    • hosting
    • authentication(を使いたかった)

参考にした資料

Udemy vue.js 入門

https://www.udemy.com/learn-vuejs/

vuetifyjs.com

Cloud Firestore を使ってみる  |  Firebase

作りかけた感想

良かった点

  • jQueryや生のjsを書いてきた人間の取って、androidのようにdatabindingを基にフロントを書けるのは、責務の分割も出来て大変快適だった。vueを使っている人が皆言うように、書いていて楽しかった。
  • vuetify使うだけでそれっぽいマテリアルデザインのサイトにする事が出来てすごい。
  • 様々なもくもく会に作業に行った中で、様々なエンジニアの人に出会えて楽しかった。モチベにもなった。

次回改善したい点

  • 作る前に思ってた3000倍くらい状態が多く、片手間でアプリを作る題材としてはダメだったと痛感。

    • 学習用に作るサービスは、自分が思うより数倍シンプルな状態にしなければいけないと感じた。
    • vueの目玉であるコンポーネント化を行う前にやる気と時間が付きてしまった。
  • 要件とワイヤーを明確に定義しておく事の重要さ。モチベupのためにvuetifyでそれっぽい見た目にしようとしたら、そちらに工数の大半を取られてしまった。

  • サービスとして使って貰える状態ではないため、きちんと計画と期間とやる気のコントロールを考えて次は計画を立てたい。

おわりに

ナウいフロントの技術に触れることが出来て楽しかったです。次はwebpackに関して理解してから、よりシンプルなアプリを作るようにしたい。 最近またAndroidのやる気が上がってきたので、しばらくはAndroidの勉強しようかなと思います。