Meteor Introduction - Ashish
-
Upload
ashish-kumar -
Category
Software
-
view
239 -
download
1
Transcript of Meteor Introduction - Ashish
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!