Parse MIT IAP slides 20156.470.scripts.mit.edu/2015/pages/lectures/WEBday9-parse.pdf · Database...
Transcript of Parse MIT IAP slides 20156.470.scripts.mit.edu/2015/pages/lectures/WEBday9-parse.pdf · Database...
ParseJamie Karraker ’12 MEng ’13
Database
Database REST API
ZZZ
+
Database REST API
ZZZ
Server
++
+ users+ security
Database REST API
ZZZ
Server
++
+ users+ security
Networking
Database REST API
ZZZ
Server
++
+ users+ security
CachingNetworking
+
Database REST API
ZZZ
Server
++
+ users+ security
CachingNetworking
+ +
The fun stuff!
Database REST API
ZZZ
Server
++
+ users+ security
CachingNetworking
+ +
The fun stuff!
no
no
no
no
no
yes!
Android OS X WP8 Win 8 .NET Unity RESTiOS
JavaScript SDK
DOCSparse.com/docs
USERSThe in your app
Sign up a userParse.User.signUp("TimBeaver", "ihtfp");
Sign up a userParse.User.signUp("TimBeaver", "ihtfp");
Log in a userParse.User.logIn("TimBeaver", "ihtfp");
Sign up a userParse.User.signUp("TimBeaver", "ihtfp", { success: function(user) { // Do stuff after successful signup. }, error: function(user, error) { // The login failed. Check error to see why. }}); Log in a user
Parse.User.logIn("TimBeaver", "ihtfp", { success: function(user) { // Do stuff after successful login. }, error: function(user, error) { // The login failed. Check error to see why. }});
Facebook LoginParse.FacebookUtils.logIn(null, { success: function(user) { if (!user.existed()) { // User signed up and logged in through Facebook! } else { // User logged in through Facebook! } }, error: function(user, error) { // User cancelled the Facebook login or did not fully authorize. }});
Facebook Login
Link Existing User
Parse.FacebookUtils.logIn(null, { success: function(user) { if (!user.existed()) { // User signed up and logged in through Facebook! } else { // User logged in through Facebook! } }, error: function(user, error) { // User cancelled the Facebook login or did not fully authorize. }});
if (!Parse.FacebookUtils.isLinked(user)) { Parse.FacebookUtils.link(user, null, { success: function(user) { // Woohoo, user logged in with Facebook! }, error: function(user, error) { // User cancelled the Facebook login or did not fully authorize. } });}
DATASaving stuff in the
var GameScore = Parse.Object.extend("GameScore");var gameScore = new GameScore();
gameScore.set("score", 1337);gameScore.set("player", Parse.User.current());gameScore.set("cheatMode", false);
var GameScore = Parse.Object.extend("GameScore");var gameScore = new GameScore();
gameScore.set("score", 1337);gameScore.set("player", Parse.User.current());gameScore.set("cheatMode", false);
var GameScore = Parse.Object.extend("GameScore");var gameScore = new GameScore();
gameScore.save();
gameScore.set("score", 1337);gameScore.set("player", Parse.User.current());gameScore.set("cheatMode", false);
var GameScore = Parse.Object.extend("GameScore");var gameScore = new GameScore();
gameScore.save();
FILESSaving your Pictures in the
HTML
<input type="file" id="profilePhotoFileUpload">
Save a Filevar file = $("#profilePhotoFileUpload")[0].files[0];var name = "photo.jpg";var parseFile = new Parse.File(name, file);parseFile.save(null, { success: function(parseFile) { profileObject.set("photoFile", parseFile); profileObject.save(); }});
HTML
<input type="file" id="profilePhotoFileUpload">
Save a Filevar file = $("#profilePhotoFileUpload")[0].files[0];var name = "photo.jpg";var parseFile = new Parse.File(name, file);parseFile.save(null, { success: function(parseFile) { profileObject.set("photoFile", parseFile); profileObject.save(); }});
HTML
<input type="file" id="profilePhotoFileUpload">
Retrieve a File var profilePhoto = profileObject.get("photoFile");$("#profileImg")[0].src = profilePhoto.url();
DATA BROWSERBecause sometimes you just want to see your data
QUERIESGetting stuff from the
var query = new Parse.Query("GameScore");
query.equalTo("player", Parse.User.current());
var query = new Parse.Query("GameScore");
query.equalTo("player", Parse.User.current());
var query = new Parse.Query("GameScore");
query.find();
var query = new Parse.Query(“GameScore");
query.equalTo("player", Parse.User.current());
query.find({ success: function(gameScores) { // Do something with the returned Parse.Object array }, error: function(error) { alert("Error: " + error.code + " " + error.message); }});
RELATIONSIt’s better together
var user = Parse.User.current();
var user = Parse.User.current();var gameScore = new GameScore();
var user = Parse.User.current();var gameScore = new GameScore();gameScore.set("player", user);
var user = Parse.User.current();
var user = Parse.User.current();var relation = user.relation("friends");
var user = Parse.User.current();var relation = user.relation("friends");relation.add(newFriend);
var user = Parse.User.current();var relation = user.relation("friends");relation.add(newFriend);relation.add(anotherFriend);
var user = Parse.User.current();var relation = user.relation("friends");relation.add(newFriend);relation.add(anotherFriend);user.save();
CLOUD CODEIt’s code in the
Before SaveParse.Cloud.beforeSave("Review", function(request, response) { var comment = request.object.get("comment"); if (comment.length > 140) { // Truncate and add a ... request.object.set("comment", comment.substring(0, 137) + "..."); } response.success(); });
Before SaveParse.Cloud.beforeSave("Review", function(request, response) { var comment = request.object.get("comment"); if (comment.length > 140) { // Truncate and add a ... request.object.set("comment", comment.substring(0, 137) + "..."); } response.success(); }); After Save
Parse.Cloud.afterSave("Review", function(request) { query = new Parse.Query("Movie"); query.get(request.object.get("movie").id, { success: function(movie) { movie.increment("reviews"); movie.save(); } });});
Cloud Modules
Cloud Modules
Cloud Modules
Stripevar Stripe = require('stripe');Stripe.initialize('mySecretKey');
Stripe.Charges.create({ amount: 100 * 10, // $10 expressed in cents currency: "usd", card: "tok_3TnIVhEv9P24T0" // stripe token id});
PARSE HOSTINGOverviewStatic HostingDynamic HostingAny Meme Lite Example
The Spectrum
The Spectrum
The Spectrum
PARSE HOSTING
Static Hosting
Static Hosting
• Choose a domain: myapp.parseapp.com (or custom)
Static Hosting
• Choose a domain: myapp.parseapp.com (or custom)
• Initialize your parse directory
Static Hosting
• Choose a domain: myapp.parseapp.com (or custom)
• Initialize your parse directory
• Create public/helloword.html
Static Hosting
• Choose a domain: myapp.parseapp.com (or custom)
• Initialize your parse directory
• Create public/helloword.html
• Type parse deploy
Static Hosting
• Choose a domain: myapp.parseapp.com (or custom)
• Initialize your parse directory
• Create public/helloword.html
• Type parse deploy
• Your web page is live
Live Demo: Todos
Dynamic Hosting
Dynamic Hosting
express.js
express.js
express.js
• Web framework built for node.js
express.js
• Web framework built for node.js
• Node.js is server-side JavaScript
express.js
• Web framework built for node.js
• Node.js is server-side JavaScript
• Now with Cloud Code + Parse JS SDK
express.js
• Web framework built for node.js
• Node.js is server-side JavaScript
• Now with Cloud Code + Parse JS SDK
• Simple but expressive
Directory Structure
-cloud/ main.js Cloud Code app.js Express code -views/ View templates hello.ejs-public/ example.html Static HTML files -stylesheets/ CSS stylesheets style.css
Workflow
Workflow
• Install Command Line Tool athttps://www.parse.com/docs/hosting_guide
Workflow
• Install Command Line Tool athttps://www.parse.com/docs/hosting_guide
$ curl -s https://www.parse.com/downloads/cloud_code/installer.sh | sudo /bin/bash
Workflow
• Install Command Line Tool athttps://www.parse.com/docs/hosting_guide
• One time set up. Create a local code directory
$ curl -s https://www.parse.com/downloads/cloud_code/installer.sh | sudo /bin/bash
Workflow
• Install Command Line Tool athttps://www.parse.com/docs/hosting_guide
• One time set up. Create a local code directory$ parse new MyWebsite
$ curl -s https://www.parse.com/downloads/cloud_code/installer.sh | sudo /bin/bash
Workflow
• Install Command Line Tool athttps://www.parse.com/docs/hosting_guide
• One time set up. Create a local code directory
• Make code changes$ parse new MyWebsite
$ curl -s https://www.parse.com/downloads/cloud_code/installer.sh | sudo /bin/bash
Workflow
• Install Command Line Tool athttps://www.parse.com/docs/hosting_guide
• One time set up. Create a local code directory
• Make code changes$ parse new MyWebsite
$ vi MyWebsite/cloud/app.js
$ curl -s https://www.parse.com/downloads/cloud_code/installer.sh | sudo /bin/bash
Workflow
• Install Command Line Tool athttps://www.parse.com/docs/hosting_guide
• One time set up. Create a local code directory
• Make code changes
• Deploy to the cloud
$ parse new MyWebsite
$ vi MyWebsite/cloud/app.js
$ curl -s https://www.parse.com/downloads/cloud_code/installer.sh | sudo /bin/bash
Workflow
• Install Command Line Tool athttps://www.parse.com/docs/hosting_guide
• One time set up. Create a local code directory
• Make code changes
• Deploy to the cloud
$ parse new MyWebsite
$ vi MyWebsite/cloud/app.js
$ parse deploy
$ curl -s https://www.parse.com/downloads/cloud_code/installer.sh | sudo /bin/bash
Live Demo: AnyMeme
What Else?
• Full blown web apps
• Admin interfaces • Analytics
• Mobile SDKs
• Push Notifications
• Free! (until you get really big)
Further Reading
• JS SDK guide: parse.com/docs/js_guide
• Hosting guide: parse.com/docs/hosting_guide
• Express: expressjs.com
• Anymeme: www.anymeme.org
• Todo App: todolist.parseapp.com
• Tutorials: parse.com/tutorials
• Source code: github.com/ParsePlatform