/ portfolio

Friendly Pix Web

Friendly Pix is a place where you can share photos, follow friends and comment on photos.

Friendly-Pix4

Getting Started

  • Create your project on the Firebase Console.
  • From your Firebase project console, click on red circle button with the caption "Add Firebase to your web app".
    Alt text
  • Copy the initialization snippet into the index.html file by clicking the red HTML.
    Alt text
  • The snippet should be placed in the <head> section of index.html.
  • Enable Google auth in the Auth > SIGN IN METHOD tab.
    Alt text
  • Run firebase serve using the Firebase CLI tool to launch a local server.

Create Firebase Project

  1. Create a Firebase project using the Firebase Console.
  2. Enable Google as a Sign in provider in Firebase Console > Authentication > Sign in Method tab.
  3. Enable Facebook as a Sign in provider in Firebase Console > Authentication > Sign in Method tab. You'll need to provide your Facebook app's credentials. If you haven't yet you'll need to have created a Facebook app on Facebook for Developers
  4. Now navigate to the Overview on the top left and click Add Firebase to your web app to get the initialization snippet to copy. The snippet will look like this:
<script src="https://www.gstatic.com/firebasejs/<VERSION>/firebase.js"></script>
<script>
  // Initialize Firebase
  var config = {
    apiKey: "<YOUR_API_KEY>",
    authDomain: "<YOUR_PROJECT_ID>.firebaseapp.com",
    databaseURL: "https://<YOUR_PROJECT_ID>.firebaseapp.com",
    storageBucket: "<YOUR_PROJECT_ID>.appspot.com",
    messagingSenderId: "<YOUR_MESSAGING_SENDER_ID>"
  };
  firebase.initializeApp(config);
</script>

Update the app with your firebase project

  1. In root of the site, locate the index.html file and replace the text below with the snippet you copied above:
<!-- TODO(DEVELOPER): Paste the initialization snippet from: Firebase Console > Add Firebase to your web app. -->

Start a local development server

You need to have installed the Firebase CLI by running npm install.

You can start a local development server by running:

npm run serve

This will start firebase serve and make sure your Javascript files are transpiled automatically to ES5.

Then open