meteor wwnrw intro
TRANSCRIPT
![Page 1: Meteor WWNRW Intro](https://reader031.vdocuments.mx/reader031/viewer/2022030318/5a6d3dfe7f8b9aff418b50c9/html5/thumbnails/1.jpg)
J AVA S C R I P T A L L T H E W AY N O T J U S T F O R R O C K S TA R S
FA C E B O O K - Q U A L I T Y A P P S W I T H O U T FA C E B O O K ’ S M O N E Y
METE R
Stephan Hochhaus @yauh
powered by
![Page 2: Meteor WWNRW Intro](https://reader031.vdocuments.mx/reader031/viewer/2022030318/5a6d3dfe7f8b9aff418b50c9/html5/thumbnails/2.jpg)
T H E R O A D S O FA R
• Applications in the browser
• JavaScript everywhere
• Overwhelming tools
![Page 3: Meteor WWNRW Intro](https://reader031.vdocuments.mx/reader031/viewer/2022030318/5a6d3dfe7f8b9aff418b50c9/html5/thumbnails/3.jpg)
A P P S I N T H E B R O W S E RU S E R S E X P E C T M O R E
![Page 4: Meteor WWNRW Intro](https://reader031.vdocuments.mx/reader031/viewer/2022030318/5a6d3dfe7f8b9aff418b50c9/html5/thumbnails/4.jpg)
J AVA S C R I P T C O N Q U E R E D T H E S E R V E RN O D E . J S
![Page 5: Meteor WWNRW Intro](https://reader031.vdocuments.mx/reader031/viewer/2022030318/5a6d3dfe7f8b9aff418b50c9/html5/thumbnails/5.jpg)
W E B D E V I S R O C K E T S C I E N C E
L A R G E T E A M S B U I L D L A R G E A P P S
![Page 6: Meteor WWNRW Intro](https://reader031.vdocuments.mx/reader031/viewer/2022030318/5a6d3dfe7f8b9aff418b50c9/html5/thumbnails/6.jpg)
A M E T E O R A P P E A R E DN O W
![Page 7: Meteor WWNRW Intro](https://reader031.vdocuments.mx/reader031/viewer/2022030318/5a6d3dfe7f8b9aff418b50c9/html5/thumbnails/7.jpg)
![Page 8: Meteor WWNRW Intro](https://reader031.vdocuments.mx/reader031/viewer/2022030318/5a6d3dfe7f8b9aff418b50c9/html5/thumbnails/8.jpg)
– N I C K M A R T I N
At Meteor, we hope to democratize web app development by empowering anyone, anywhere to create apps.
![Page 9: Meteor WWNRW Intro](https://reader031.vdocuments.mx/reader031/viewer/2022030318/5a6d3dfe7f8b9aff418b50c9/html5/thumbnails/9.jpg)
T H E M E T E O R S TA C K
N O T O N LY F O R R O C K S TA R S
The CLI Tool
The Database
The Server Engine
Bunch of Libs
![Page 10: Meteor WWNRW Intro](https://reader031.vdocuments.mx/reader031/viewer/2022030318/5a6d3dfe7f8b9aff418b50c9/html5/thumbnails/10.jpg)
1. I S O M O R P H I S M 2. S Y N C H R O N I C I T Y 3. R E A C T I V I T Y 4. S M A R T C L I E N T S
W H Y I S I T E A S Y T O L E A R N ?
![Page 11: Meteor WWNRW Intro](https://reader031.vdocuments.mx/reader031/viewer/2022030318/5a6d3dfe7f8b9aff418b50c9/html5/thumbnails/11.jpg)
D O C U M E N T- B A S E D D ATA B A S E SM O N G O D B - T H E K E Y T O I S O M O R P H I S M
A collection
A document
Lots of fields
![Page 12: Meteor WWNRW Intro](https://reader031.vdocuments.mx/reader031/viewer/2022030318/5a6d3dfe7f8b9aff418b50c9/html5/thumbnails/12.jpg)
I S O M O R P H I C A P P L I C AT I O N S
DB Server ClientSELECT name FROM users WHERE id = 12345
GET http://server/users/ name/12345
var name = response.name;
A C C E S S I N G D A TA T H R O U G H O U T T H E S TA C K W I T H U N I V E R S A L J A VA S C R I P T
Users.find( {_id: 12345}, {fields: {name : 1} } )
Users.find( {_id: 12345}, {fields: {name : 1} } )
Users.find( {_id: 12345}, {fields: {name : 1} } )
![Page 13: Meteor WWNRW Intro](https://reader031.vdocuments.mx/reader031/viewer/2022030318/5a6d3dfe7f8b9aff418b50c9/html5/thumbnails/13.jpg)
E V E N T E D A P P L I C AT I O N S N E E D C A L L B A C K S
N O D E . J S A N D T H E E V E N T L O O P
EventqueueEvent
Event
Event
Event
…
Node.js Event Loop
Thread pool
Disk
Network
Process
…
Single threadedprocessing
Callback
split off to achild process
![Page 14: Meteor WWNRW Intro](https://reader031.vdocuments.mx/reader031/viewer/2022030318/5a6d3dfe7f8b9aff418b50c9/html5/thumbnails/14.jpg)
C A L L B A C K H E L LT H E D O W N S I D E O F N O D E J S
DB.connect(options, function(err, connection){ connection.query(something, function(err, document){ ExternalAPI.makeCall(document, function(err, apiResult){ connection.save(apiResult, function(err, saveResult){ request.end(saveResult); }); }); }); });
![Page 15: Meteor WWNRW Intro](https://reader031.vdocuments.mx/reader031/viewer/2022030318/5a6d3dfe7f8b9aff418b50c9/html5/thumbnails/15.jpg)
S Y N C H R O N I C I T Y W I T H M E T E O RT H E P O W E R O F F I B E R S
DB.connect(options, function (err, con) { connection = con; }); connection.query(something, function (err, doc) { document = doc; }); ExternalAPI.makeCall(document, function (err, res) { apiResult = res; }); connection.save(apiResult, function (err, res) { saveResult = res; }); request.end(saveResult);
![Page 16: Meteor WWNRW Intro](https://reader031.vdocuments.mx/reader031/viewer/2022030318/5a6d3dfe7f8b9aff418b50c9/html5/thumbnails/16.jpg)
Fiber #1
0 10 20 30 40milliseconds
By default Meteor creates one fiber
per client
DB.connect
Wait(idle CPU time)
Event Loop
connection.query
ExternalAPI.makeCall
connection.save
request.end
S Y N C H R O N I C I T Y W I T H M E T E O RT H E P O W E R O F F I B E R S
![Page 17: Meteor WWNRW Intro](https://reader031.vdocuments.mx/reader031/viewer/2022030318/5a6d3dfe7f8b9aff418b50c9/html5/thumbnails/17.jpg)
N O M O R E E V E N T- S PA G H E T T I SR E A C T I V I T Y
![Page 18: Meteor WWNRW Intro](https://reader031.vdocuments.mx/reader031/viewer/2022030318/5a6d3dfe7f8b9aff418b50c9/html5/thumbnails/18.jpg)
R E A C T I V I T Y
Traditional programming •var a = 2; var b = 5; var c = a + b; console.log(c); # c is 7
•a = 5; console.log(c); # c is still 7
•c = a + b; console.log(c); # c is finally 10
Reactive programming •var a = 2; var b = 5; var c = a + b; console.log(c); # c is 7
•a = 5; console.log(c); # c is magically 10
![Page 19: Meteor WWNRW Intro](https://reader031.vdocuments.mx/reader031/viewer/2022030318/5a6d3dfe7f8b9aff418b50c9/html5/thumbnails/19.jpg)
S M A R T C L I E N T SR E M O T E A P P S W I T H B I - D I R E C T I O N A L C O M M U N I C A T I O N
![Page 20: Meteor WWNRW Intro](https://reader031.vdocuments.mx/reader031/viewer/2022030318/5a6d3dfe7f8b9aff418b50c9/html5/thumbnails/20.jpg)
M E T E O R C O M M U N I C AT E SR E M O T E A P P S W I T H B I - D I R E C T I O N A L C O M M U N I C A T I O N
App
Database
Server
Livequery
App
MiniDB
Client
Blaze
Tracker
HTTP
Remote Procedure Calls
Data subscriptions
DDP via WebSocket
Clients call server functions remotely via DDPand the server returns data as JSON objects
Static assetsHTML, JS, CSS, JPG, PNG, etc
The initial request and all static resources are transferred via HTTP
LiveQuery watches for changes and pushes data to all subscribed
clients
Tracker triggers reactiveupdates, e.g. in the UI
powered by Blaze
![Page 21: Meteor WWNRW Intro](https://reader031.vdocuments.mx/reader031/viewer/2022030318/5a6d3dfe7f8b9aff418b50c9/html5/thumbnails/21.jpg)
F I L E S T R U C T U R E SW H A T G O E S W H E R E
client - is executed only on the client
server - is never sent to the client
public - contains static assets
everything* else is shared
*I lied. Check the details in the official docs http://docs.meteor.com/#/full/structuringyourapp
![Page 22: Meteor WWNRW Intro](https://reader031.vdocuments.mx/reader031/viewer/2022030318/5a6d3dfe7f8b9aff418b50c9/html5/thumbnails/22.jpg)
C O D E & PA C K A G E S
E X T E N D I N G M E T E O R
Packages
Our code
![Page 23: Meteor WWNRW Intro](https://reader031.vdocuments.mx/reader031/viewer/2022030318/5a6d3dfe7f8b9aff418b50c9/html5/thumbnails/23.jpg)
TA L K I N G T O T H E T W I T T E R A P I
E X T E N D I N G M E T E O R W I T H O A U T H
External API
Using a package
meteor add accounts-twitter
![Page 24: Meteor WWNRW Intro](https://reader031.vdocuments.mx/reader031/viewer/2022030318/5a6d3dfe7f8b9aff418b50c9/html5/thumbnails/24.jpg)
M U LT I P L E P L AT F O R M S
A S I N G L E C O D E B A S E - M A N Y D E P L O Y M E N T S
Mobile
Server/ Client
![Page 25: Meteor WWNRW Intro](https://reader031.vdocuments.mx/reader031/viewer/2022030318/5a6d3dfe7f8b9aff418b50c9/html5/thumbnails/25.jpg)
I N S TA L L M E T E O RB U I L D Y O U R O W N
Linux, Mac: $ curl https://install.meteor.com/ | sh
Windows: https://www.meteor.com/install
![Page 26: Meteor WWNRW Intro](https://reader031.vdocuments.mx/reader031/viewer/2022030318/5a6d3dfe7f8b9aff418b50c9/html5/thumbnails/26.jpg)
S H O P. C O W A N T S Y O U !O N E M O R E T H I N G
https://job
s.lever.co
/shopco
![Page 27: Meteor WWNRW Intro](https://reader031.vdocuments.mx/reader031/viewer/2022030318/5a6d3dfe7f8b9aff418b50c9/html5/thumbnails/27.jpg)
– M E . S E P T E M B E R 2 0 1 5
„Go forth and build amazing things.“