The JavaScript app platform www.meteor.com
The JavaScript app platform
www.meteor.com
What We’ll Cover
What is Meteor?Why Meteor?Code DemoWho is using it?Who is behind it?What’s next?
What is Meteor?
What is Meteor …
A reactive , data-synchronizing,
Latency-compensating, time-saving platform.
for building fast, interactive web apps
One codebase,all platforms
Open and extensible
100% pureJavaScript
Collaborative iOS and Android app
<1000 lines of JavaScript
A full-stack, open source platform for building web and mobile apps in JavaScript
Fast and fun development
What is Meteor…
What's different ?
Traditional App• Browser makes a request to server,
http://example.com/items.html
•server responds with html code <html>
<p>Item 1</p>
<p>Item 2</p>
</html>
What's different ?Meteor App
•Browser subscribes (to items) from Server
Subscribe to items
•Also browser knows when new items added on
server.•Response is :<p>Item 1</p><p>Item 2</p>
What's different ?
Meteor AppLatency Compensation
When adding new item by browser, •local storage updated first, •then send to server for update.•Server then updates client “Everything
went OK” .Hence Reactive.
What's different ?
Meteor AppBrowser ServerAngular , Ember,
Backbone, React,
XMLHttpRequest,WebSocket,
Sockjs,jQuery,BootStrap
Rails, Django,
PHP,Node, Go,
Express,MongoDB,MySQL,
AppEngine, Postgres,Apache
What's different ?
Meteor App
•Write all JavaScript (if you want to)
•Use the same APIs on client and server.
Build advanced apps quicklywith a small team
Meteor componentsCommand Line ToolView Layer – Blaze (Angular, React)LivequeryFull stack package system – atmospherejs.-comBuild system
Cordova/Phonegap
Why Meteor?
Table stakesTodayYesterday
Browser Mobile
Refresh button Live updates
Individual sessions Multiuser collaboration
Links and forms Native-style GUI
Updates without refreshing the browser
Real-time collaboration
Result: Complex stack
HTML Templates App Logic
Reactive UI update system
Native mobile container
Speculative client-side updates
Client-side data store
Custom data sync protocol
Realtime database monitoring
Build & update system
We want to focus on the app, not the infrastructure
App Microservices
PLATFORM
Blaze
Livequery
Client Data Cache
MongoDB SQL REST
App Components & Logic
React Angular
SERVER
CLIENT
SOURCES
DDP
MobileWeb
Meteor code demo
MongoDB DOMServer Client
Messages.
insert()Messages.insert()
Meteor Data Flows
MinimongoOptimistic UI
What We Saw – Meteor Tool
Install to deploy in minutes w/free hostingHot code pushMulti-platform supportFull-stack packages
What We Saw – Framework Features
Reactive renderingDatabase sync Intuitive, isomorphic APIMinimal boilerplate code
The Meteor Platform
App Microservices
PLATFORM
Blaze
Livequery
Client Data Cache
MongoDB SQL REST
App Components & Logic
React Angular
SERVER
CLIENT
SOURCES
DDP
MobileWeb
Who is using Meteor?
Companies using Meteor
Workpop: Raised $7.9 million Series A led by Trinity Ven-tures
“the most rapid prototyping, iteration and development we’ve ever seen from an early stage company”
Meteor community
Over 200 meetup groupsOver 6000 community-authored pack-agesRanked in top10 on GitHub
Who is behind Meteor?
Meteor Development GroupFunded (won’t disappear)
- $31 Million in 3 rounds - 2015Active development by full-time employeesRevenue product: Galaxy
- high-availability/large scale Meteor hostingMeteor platform is MIT-licensed
- host anywhere; you own the code
What’s next?
Roadmap
Meteor 1.2 – Summer 2015• ES2015 (ES6)• 1st Class Angular, React supportFuture Directions• Full-stack reactive SQL• REST and microservices• Large app patterns, ES2015 modules, and
more
meteor.com/learn
Official Meteor TutorialOfficial Meteor DocsMeteor ForumsDiscover Meteor (book)Stack Overflow
meteor.com/try
docs.meteor.com
forums.meteor.com
book.discovermeteor.com
stackoverflow.com/questions/tagged/meteor
Example Apps
Todos — a full-featured todo list appcollaborative app, access control, respon-
sive
meteor create --example todos
Local Market — a mobile social engagement appTwitter integration, camera integration, mobile-optimized
meteor create --example localmarket
www.meteor.com
Thank You!