JSFiddle - React, Tailwind, and code Playground

by Sezer Ekinci

HTML

<script src="https://www.gstatic.com/firebasejs/4.2.0/firebase.js"></script>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.5/angular.js"></script>
<script src="https://cdn.rawgit.com/Flatte/Flatte-Web/1.0.1-beta.86/dist/flatte.min.js"></script>
<div ng-app="myApp">
  <div ng-controller="myCtrl">
    <h3>Flatte basic test</h3>
    <div>DB Results:</div>
    <pre>{{results | json : 4}}</pre>
  </div>
</div>

CSS

pre {background-color:#fff;border-radius:4px;}

JavaScript

var config = {
  apiKey: "AIzaSyBAaHRAoW1aamCM6VtKGNyhfc1xQKZy-yw",
  databaseURL: "https://flatte-14ec0.firebaseio.com"
};

firebase.initializeApp(config);

angular.module('myApp', ['mx.flatte'])

angular.module('myApp').run(['flatte', function(flatte) {
  flatte.settings({
    debug: true,
    baseRef: "/tests",
    con: firebase,
    manifest: {
      "customer": {
        "childs": {
          "customerID": {
            "_q": {
              "ID": true
            },
            "childs": {
              "firstName": {
                "_q": {
                  "saveValue": {
                    "filter": "uppercase"
                  },
                  "deleteValue": ".auth",
                  "copy": [{
                    "saveValue": "$",
                    "deleteValue": "null",
                    "path": "/contact/#customerID/firstName"
                  }]
                }
              }
            }
          }
        }
      }
    },
    predefined: {
      ".true": true,
      ".false": false,
      ".null": null,
      ".timestamp": firebase.database.ServerValue.TIMESTAMP
    }
  });
}])

angular.module('myApp').controller('myCtrl', ['$scope','flatte', function($scope,flatte) {
  var progress = {};
  flatte.do([{
    ref: "customer/-KrvGZuVwqwerty",
    data: {
      "firstName": "Elon2",
      "lastName": "Musk2",
      "twitter": "@elonmusk"
    }
  }], progress).then(function(res) {
    console.log(res);
  });
  
  flatte.db.ref("tests").on("value",function(snap){
  	$scope.results = snap.val();
  })
}]);