How to Firebase: Vue 2 Sign in

Eddie Rantsimele
2 min readFeb 20, 2018

--

When learning Firebase one needs to go through it’s strange security mechanisms, so this tutorial is not for beginners.

Prerequisites:
** Firebase account
** Email & Password Authentication already set up :)
** Been through Hello World tutorial

Okay formalities out the way now, lets get on with it.

1. Clone the repo from github
2. cd into folder and enter yarn
3. Substitute your Firebase details web details into config object in /store/fbscript.js
4. Enter npm run dev from project root
5. Navigate to localhost:3000 in your browser
6. Click on login here button on home screen
7. Bask in your glory

The results should look something like whats below.

Technologies used:
** Vue
** Vuex
** Vue Router
** Pure CSS (I love this library!!!)
** Vue Progress Bar
** Express
** Store2
** Vue Toasted
** Vue Awesome (For icons)

There is no need to know Vue or Vuex to launch this project (although it would be nice), as everything is completed already (Christmas came early for us :))

Okay as you can tell I love Firebase so prepare for alot more instructions on this subject, I code for a living (Java Engineer), so practical tips are a must from me.

https://github.com/reezmankazzy/tutorials/tree/master/signin-fb

Please share the above code freely, learn and improve it as necessary.

Regards
Kazzy

--

--

Eddie Rantsimele
Eddie Rantsimele

Written by Eddie Rantsimele

Java, JavaScript, Rust, Python, NodeJS, Kubernetes, Openshift, AWS and Azure

No responses yet