Moving from Local Storage to Cloud Based Storage For Your Mobile Apps
Justin James
@digitaldrummerj
![](https://s3.amazonaws.com/media-p.slid.es/uploads/digitaldrummerj/images/1080040/headshot.jpg)
What are we really talking about?
Take the confusion out of how to get data
to our mobile application
Reduce the mundane work of creating a REST API
![](https://s3.amazonaws.com/media-p.slid.es/uploads/digitaldrummerj/images/1080071/large-question-mark-in-a-blue-circle-0-8959.png)
Technologies Covered
-
Browser Local Storage
-
Firebase
-
Back&
-
Strongloop
![](https://s3.amazonaws.com/media-p.slid.es/uploads/digitaldrummerj/images/1065499/cogs1.gif)
Agenda for Each Technology
-
Overview
-
Why Use it?
-
Limitations (if any)
-
How to use it
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2523815/api.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2523850/localstorage-feature.png)
Overview
-
Browser based storage
-
Key/Value Pairs
-
Per Domain and Protocol
-
Storage Limit of at least 2 MB
-
Never Transferred to Server
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2523987/overview.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2523850/localstorage-feature.png)
Support
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2523972/browsericons.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2523867/LocalStorage-Support-4-24-2016.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2523850/localstorage-feature.png)
Why Use?
-
Zero Hosting Cost
-
Available on All Devices
-
Data Size is Low
-
Don't Need Cross Device Sync
![](https://s3.amazonaws.com/media-p.slid.es/uploads/digitaldrummerj/images/1080073/Arabic_question_Mark.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2523850/localstorage-feature.png)
Limitations
-
Storage Limit < 10 MB
-
Storage Limit Not Consistent
-
No Cross Device Sync
-
Data is string based
-
Minimal Features
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2523975/warning_icon.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2523850/localstorage-feature.png)
How to Use?
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524005/Code-Optimization-3.png)
//string
window.localStorage.setItem("name", "Justin");
window.localStorage.getItem("name");
//Complex Object
window.localStorage.setItem("profile", JSON.stringify(data));
JSON.parse(window.localStorage.getItem("profile"));
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2523850/localstorage-feature.png)
Backend-as-a-Service
FOCUS ON WHAT REALLY MATTERS
Beautifully Crafted Front Ends
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2494865/main_icon1.png)
Full Server for
your application
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2495134/Red_NoInstallIcon.png)
No Installations
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524294/firebase_logo.png)
Overview
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524294/firebase_logo.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524318/database.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524323/userMan.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524325/hosting.png)
Realtime
Data
Authentication
Hosting
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2523987/overview.png)
Real-Time Database
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524318/database.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524294/firebase_logo.png)
-
NOSQL Database
-
Every Client Syncronized
-
Auto Scaling Internally
-
SSL by Default
-
Works Offline
User Management
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2285439/usermanagement.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2285474/btn_google__light_normal_ios_3x.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2285475/FB-f-Logo__blue_512.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2291461/github-logo.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2460580/twitter-logo.png)
Hosting
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524325/hosting.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524294/firebase_logo.png)
-
Static Asset Hosting
-
SSL by Default
-
Deploy in Seconds
-
Custom Domain
Why Use?
-
Real-time Communication
-
SDK for Android, iOS, and Javascript
-
Application Hosting
-
Offline Support?
-
Don't have to define schema upfront
-
SSL By Default
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524294/firebase_logo.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/digitaldrummerj/images/1080073/Arabic_question_Mark.png)
Limitations
-
NoSQL (confusing if not used before)
-
Overwhelming Amount of Docs
-
Offline Support?
-
Implementing Security is Confusing
-
Lots of coding for Logins
-
Lots of callbacks
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524294/firebase_logo.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2523975/warning_icon.png)
Get Data
// Using AngularFire
var projectRef = new Firebase(FirebaseAppUrl);
// get list
var globalProjects= $firebaseArray(projectRef);
// get ID
var rec = globalProjects.$getRecord("foo");
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524316/firebase-logo.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524005/Code-Optimization-3.png)
Modify Data
//post
globalProjects.$add(recordOrItem)
//post and put
globalProjects.$save(recordOrItem)
// delete
globalProjects.$remove(recordOrItem)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524316/firebase-logo.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524005/Code-Optimization-3.png)
Add Child Data
var ref = globalProjects.$ref();
var project = ref.child(projectId);
tasks.push({});
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524316/firebase-logo.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524005/Code-Optimization-3.png)
Update Child Data
var ref = globalProjects.$ref();
var taskObj = ref.child(projectId).child('tasks').child(taskKey);
taskObj.set({});
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524316/firebase-logo.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524005/Code-Optimization-3.png)
Delete Child Data
var ref = globalProjects.$ref();
var taskObj = ref.child(projectId).child('tasks').child(taskKey);
taskObj.remove();
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524316/firebase-logo.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524005/Code-Optimization-3.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2291430/Backand-logo.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2301738/BAckand-mascot.png)
Instant Backend in the Cloud
Overview
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2301738/BAckand-mascot.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2502470/server_icon.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2502490/freedb_icon.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2502495/serverside_logic_icon.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2502500/usermanagement_icon.png)
Cloud Server
Free DB
Server Side
Logic
User
Mgmt
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2523987/overview.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2285380/todo_model_json.png)
Data Model with REST Api
Build Model in JSON
Back& will automatically:
-
Create a Database
-
Generate a REST Api
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2301738/BAckand-mascot.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2285388/todo_model_diagram.png)
Data Model Built Visually
Model Built Use Web Based Editor
Back& automatically updates JSON model
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2301738/BAckand-mascot.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2285414/todo_project_restapi_overview.png)
Generated Rest Api
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2301738/BAckand-mascot.png)
Server Side Logic
-
On Demand Or Triggers
-
Can Run:
-
Javascript
-
Send Emails
-
Execute SQL
-
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2502648/serverside_logic_example.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2301738/BAckand-mascot.png)
Custom Queries
NoSQL or SQL Scripts
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2502679/CustomQuery_Example.png)
Unique url
REST Api
Test Results
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2301738/BAckand-mascot.png)
User Management
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2285439/usermanagement.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2285474/btn_google__light_normal_ios_3x.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2285475/FB-f-Logo__blue_512.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2291461/github-logo.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2460580/twitter-logo.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2301738/BAckand-mascot.png)
3rd Party Services
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2489308/backand3rdpartyservices.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2301738/BAckand-mascot.png)
Database Integrations
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2489323/amazonrds.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2489320/mysql.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2489321/postgres.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2489324/azure.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2489322/heroku_postgres.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2489326/sqlserver.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2489327/oracle.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2301738/BAckand-mascot.png)
Why Use?
-
Paging/Sorting/Filter Out of the Box
-
Easy to implement service side logic
-
Use Own Db but Back& REST API
-
Application Hosting
-
Back& Manages the Infrastructure
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2301738/BAckand-mascot.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/digitaldrummerj/images/1080073/Arabic_question_Mark.png)
Backand Quick-Start Apps
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2489304/ionic.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/digitaldrummerj/images/966669/angular-icon.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2489302/angular2.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2489305/2.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2489303/React.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2301738/BAckand-mascot.png)
Limitations
-
Back& is the new kid on the block
-
Only General DB as a Service Concerns
-
It is a blackbox
-
No Control Over Built-In Db Settings
-
Someone else is hosting your data
-
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2301738/BAckand-mascot.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2523975/warning_icon.png)
REST API - Get
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524096/Code-Optimization-3-white.png)
return $http ({
method: 'GET',
url: Backand.getApiUrl() + '/1/objects/' + objectName,
params: {
pageSize: 20,
pageNumber: 1,
filter: null,
sort: ''
}
});
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2301738/BAckand-mascot.png)
SDK - User Management
Backand.signin(email, password);
Backand.signup(
firstName, lastName,
email, password, confirmPassword);
Backand.signout();
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2301738/BAckand-mascot.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524096/Code-Optimization-3-white.png)
SDK - Social Logins
Backand.socialSignIn(provider);
Backand.socialSignUp(provider);
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2301738/BAckand-mascot.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524096/Code-Optimization-3-white.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524213/lookback_logo.png)
Overview
-
Bring Your Own Database (Not dbAAS)
-
Open Source Framework Designed for APIs
-
Quickly Create Models
-
Automate Creation of REST API
-
Very Detailed/Configurable Security Policies
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524206/Strongloop_Logo_Small.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2523987/overview.png)
Supported Databases
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524230/Data-Database-icon.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524206/Strongloop_Logo_Small.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2489327/oracle.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2489321/postgres.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2489320/mysql.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524238/MongoDB.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524239/text-file-icon.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2489326/sqlserver.png)
Why Use?
-
Full Control of Deployment
-
Mix and Match Data Sources
-
Fine Grained Security Configuration
-
Open Source
-
Easy to Change Data Sources
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524206/Strongloop_Logo_Small.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/digitaldrummerj/images/1080073/Arabic_question_Mark.png)
Limitations
-
Security Out-Of-Box is Confusing
-
Loopback CLI Buggy on Windows
-
Most Management of Infrastructure
-
Not All CLI Features in GUI
-
Have to have a Strongloop account
-
Foreign Keys Not Created in DB
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524206/Strongloop_Logo_Small.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2523975/warning_icon.png)
Using Overview
$ npm install -g strongloop
$ slc loopback
$ node .
//Web GUI (No Relationship Support)
$ slc arc
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524206/Strongloop_Logo_Small.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524005/Code-Optimization-3.png)
Using Generate API
$ slc lookback:datasource
$ slc lookback:model
$ slc loopback:property
$ slc lookback:acl
$ slc loopback:relation
https://docs.strongloop.com/display/public/LB/Command-line+reference
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524206/Strongloop_Logo_Small.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/102613/images/2524005/Code-Optimization-3.png)
Links
thank you
Slides:
http://bitly.com/easy-api
http://twitter.com/digitaldrummerj
http://digitaldrummerj.me
Data Driven Restful Api Creation Made Easy Breezy
By Justin James
Data Driven Restful Api Creation Made Easy Breezy
Takes a look at the pros and cons of local storage, back&, firebase, and strongloop
- 3,260