QuickStart- Step By Step Guide

First, install Node.js. Then, install the latest Cordova and Ionic command-line tools in your terminal.

npm install -g cordova ionic

Step Two (Download & Install Dependencies)

  • Unzip the downloaded Ionicbucket project and open a terminal window.

  • `cd` into the project root directory and install dependent packages by running `npm install`

npm install

Step Three (Setup Firebase)

  • Change the configuration of firebase with your firebase info in file `src/config/firebase.ts` (const firebaseConfig)

  • If you haven't created yet a project on firebase, then get started here by filling the required fields and then choose the platform you want (android/ios/web)

  • Details of create firebase account

    • Goto firebase console - https://console.firebase.google.com/

    • Click on `Add new project`

    • It’s going to ask you create a new project

    • Click on ‘Create Project’ Button, It’s create a new project Click on this new project box it’s open details of this project with lots of options. Then choose ‘Add Firebase to your web app’ and click on it. Its provide you firebase configurations information, copy this configurations infos.

    • Open Ionicbucket project and go into project `src/config/firebase.ts` file and replace firebaseConfig with your configuration information.

{
  "rules": {
    ".read": true,
    ".write": "auth != null",
    "posts": {
      "$uid": {
        ".indexOn": ["createdDate"]
      }
    },
    "newsfeed": {
    	"$uid": {
        ".indexOn": ["uid"]
      }
    },
    "friend-request": {
      "send": {
        "$uid": {
          ".indexOn": [".value"]
        }
      },
      "received": {
        "$uid": {
          ".indexOn": [".value"]
        }
      }
    },
    "connections": {
      "followers": {
        "$uid": {
          ".indexOn": ["userId"]
        }
      }
    }
  }
}

Step Four (Setup Admob)

From - https://ionicbucket.gitbook.io/socialapp/admob-configuration, follow the details instruction to setup Admob.

Step Five (Firebase Authentication)

For users to sign up with an email and password through your application, you first need to enable it in the Firebase.

  • Initialized your app into your Firebase Console

  • Go into inside the Authentication `SIGN-IN Method` tab

  • Enable the Email/Password and Facebook authentication method

  • For Facebook enable you must need to enter facebook APP ID and App Secret and OAuth redirect URI.

    • Get Facebook Credentials from here

Step Six (Running)

Desktop Browser Testing

cd ionicbucket-socialapp
ionic serve

Simulator testing

ionic build ios
ionic emulate ios

Testing as a native app

ionic run android
ionic emulate ios

Last updated