vue.js+firebaseでアドレス帳アプリを作成してみた。(初級者向け)

はじめに

22卒で就活しています。vue.jsの復習としてfirebaseと組み合わせて簡単なwebアプリ作りました。

つくったもの

簡単なアドレス帳管理アプリです。
アドレス帳管理アプリ（youtube動画リンク）
firebaseHostingによってデプロイしたもの

主な機能

• googleアカウント認証によるログイン、ログアウト
• 連絡先の追加、変更、削除

環境

• npm 6.14.5
• node v12.18.2
• @vue/cli 4.2.3

手順

①viewの作成（vuefifyの導入）
②vuexによる状態管理（メニューバー開閉状態、ログイン状態）
③firebase authenticationによるgoogleログイン実装（意外と簡単😍）
④cloud firestoreへのデータベース設定
⑤firebase hostingでデプロイ

感想

vuexの恩恵を実感しました。バックエンドはほとんど書かずに実装できました。firebase神です。今回は、google認証のみでしたが、その他の認証や負荷を考慮した開発をして行きたいです。