Vue.js + Firebase でミニWebサービスを作る（１）

開発記録の第１回として、Vue.js ＋ Firebase でシングルアプリケーション（SPA）を作りたいと思います。下の本を参考にさせていただきます。

Vue.js は今回が初体験です。Angular で流れは多少理解しているつもりなのですが、SPA開発の引き出しをどんどん増やしていきたいと考えて、Vue.js に興味を持ちました。

たまたま Amazon で見つけたこの参考書は、ミニサイズとはいえWebサービスを開発できるみたいです。最終的に Markdown のエディターを提供するWebサービスが公開できます。

Firebase の使用経験は、一度だけですが Angular ＋ Firebase で Udemy の講座を参考に作ったことがあります。サーバーの知識が皆無なのでこういったサービスはありがたいですね。

今回は第３章まで進めました。

とはいっても作業自体は開発環境のセットアップ、Githubに連携、デプロイという感じで内容としては軽めでした。

Vue.js のテンプレートを利用するため、ツールのインストール。

テンプレートのダウンロード。

mymarkdown に移動して、インストール＆実行。

f:id:liyuu:20180907013158j:plain

無事に表示できました。

ここで Github の連携を行ったのですが、地味に手間取りました。

Git の初期設定。

push するところでパスワードの入力を求められたものの、設定した覚えがなく、いろいろ試して結局 ssh公開鍵を再設定することに。

再設定後、もう一度 push すると今度は以下のエラーにより、Github にpush できない。。。

push declined due to email privacy restrictions

Gitの設定を Primary email address に変更することで解決。以下のサイトを参考にしました。

再度、push するとようやく成功。あとは Firebase にプロジェクトを新規作成して、作成ほやほやのプログラムをデプロイします。

Firebase の初期設定は問題なく進み、デプロイ完了。

今回はここまで。こんな感じで備忘録的に、のんびり続けたいと思います。

フリーランスのりゆう。