Getting Started with
Meteor
Capital District Java Developers Network
May 23, 2013

Michael P. Redlich
@mpredli
about.me/mp...
Who’s Mike?
• BS in CS from Rutgers University
• “Petrochemical Research Organization”
• Ai-Logix, Inc.
• Amateur Computer...
Objectives
• What is Meteor?
• Why Meteor?
• The Seven Principles
• Getting Started with Meteor
• Live Demos (yea!)
• Mete...
What is Meteor? (1)
• “...an open-source platform for building topquality web apps in a fraction of the time,
whether you’...
What is Meteor? (2)
• Built on top of Node.js
• Shares code between the client-side and
server-side of your application

5...
What is Node.js?
• “...a platform built on Chrome’s JavaScript

runtime for easily building fast, scalable
network applica...
Why Meteor?
• “Meteor is radically faster, radically easier
platform for Internet-scale thick client
applications.”

Avita...
Supported Operating
Systems
• Mac
OS X 10.6

• Linux
x86 and x86_64 systems

• Windows
third party
8
Wednesday, June 12, 1...
The Seven Principles
•
•
•
•
•
•

•

Data on the Wire
One Langauge
Database Everywhere
Latency Compensation
Full-Stack Rea...
(#1) Data on the Wire
• Don’t send HTML over the network
• Let client decide how to render data
• Browser renders the temp...
(#2) One Language
• Everything is JavaScript
• Built-in JavaScript packages include:
CoffeeScript
jQuery
Bootstrap
Backbon...
(#3) Database
Everywhere
• MongoDB works on both the client and the
server

• The client-side database API looks just like...
(#4) Latency
Compensation
• Designed to create a zero-latency
connection to the database

• Database on client-side is upd...
(#5) Full-Stack
Reactivity
• Embraces the concept of reactive
programming

• Everything is real-time
• Templates automatic...
(#6) Embrace the
Ecosystem
• Meteor is open-source
• Integrates existing open-source tools and
frameworks

15
Wednesday, J...
(#7) Simplicity =
Productivity
• For something to seem simple, it must
actually be simple

• API are plain and simple

16
...
Getting Started
• Download Meteor
• Create your first Meteor app
• Explore the built-in examples
17
Wednesday, June 12, 13
Download Meteor
• Unix/Linux
$

curl https://install.meteor.com | sh

• Windows
win.meteor.com

18
Wednesday, June 12, 13
Create Your First
Meteor App
$ meteor create myapp
$ cd myapp
myapp $ meteor

19
Wednesday, June 12, 13
Live Demo!

20
Wednesday, June 12, 13
Explore the Built-in
Examples
• Four (4) built-in examples
• Leaderboard (simplest)
$

meteor create --example leaderboard...
Live Demo!

22
Wednesday, June 12, 13
Structuring Your
Meteor Application
• Special folders
/server
/client
/public
/lib
/collections

23
Wednesday, June 12, 13
Smart Packages (1)
• JavaScript programs
• Extend your Meteor environment
• Injects code into client-side or server-side
o...
Smart Packages (2)
• Core smart packages:
spark
reload
livedata
mongo-livedata
minimongo

25
Wednesday, June 12, 13
Smart Packages (3)
• List all available packages
$

meteor list

• Adding a package
$

meteor add <package-name>

• Removi...
Deploying Your Meteor
Application
• Full application server
• Deploy on Meteor’s infrastructure
$

meteor deploy myapp.met...
Meteorite
• A wrapper utility for Meteor
Developed by Tom Coleman

• Supports third-party applications
• Does everything M...
Meteor Resources (1)

29
Wednesday, June 12, 13
Meteor Resources (2)
• meteor.com
• github.com/meteor/meteor
• themeteorbook.com
• eventedmind.com
• atmosphere.meteor.com...
Steve
1:40:29

Tom
Frank
1:35:37 1:35:20

31
Wednesday, June 12, 13

Mike
2:01:33
Thanks!
mike@redlich.net
@mpredli
javasig.org

32
Wednesday, June 12, 13
Upcoming SlideShare
Loading in …5
×

Getting Started with Meteor

1,323 views

Published on

An introduction to the Meteor framework for developing web apps.

Published in: Technology
0 Comments
4 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,323
On SlideShare
0
From Embeds
0
Number of Embeds
7
Actions
Shares
0
Downloads
21
Comments
0
Likes
4
Embeds 0
No embeds

No notes for slide

Getting Started with Meteor

  1. 1. Getting Started with Meteor Capital District Java Developers Network May 23, 2013 Michael P. Redlich @mpredli about.me/mpredli/ 1 Wednesday, June 12, 13
  2. 2. Who’s Mike? • BS in CS from Rutgers University • “Petrochemical Research Organization” • Ai-Logix, Inc. • Amateur Computer Group of New Jersey • Publications • Presentations 2 Wednesday, June 12, 13
  3. 3. Objectives • What is Meteor? • Why Meteor? • The Seven Principles • Getting Started with Meteor • Live Demos (yea!) • Meteor Resources 3 Wednesday, June 12, 13
  4. 4. What is Meteor? (1) • “...an open-source platform for building topquality web apps in a fraction of the time, whether you’re an expert developer or just getting started.” Meteor Web Site, http://www.meteor.com/ • A full-stack framework using JavaScript • Compiles, combines, and distributes your HTML, CSS, and JavaScript 4 Wednesday, June 12, 13
  5. 5. What is Meteor? (2) • Built on top of Node.js • Shares code between the client-side and server-side of your application 5 Wednesday, June 12, 13
  6. 6. What is Node.js? • “...a platform built on Chrome’s JavaScript runtime for easily building fast, scalable network applications. Node.js uses an eventdriven, non-blocking I/O model that makes it lightweight and efficient, perfect for dataintensive real-time applications that run across distributed devices.” Node.js Web Site, http://www.nodejs.org/ 6 Wednesday, June 12, 13
  7. 7. Why Meteor? • “Meteor is radically faster, radically easier platform for Internet-scale thick client applications.” Avital Oliver, “Meteor Smart Packages”, ETE Conference, 4/2/2013 • Easy to learn • Pure JavaScript • Rapid application development 7 Wednesday, June 12, 13
  8. 8. Supported Operating Systems • Mac OS X 10.6 • Linux x86 and x86_64 systems • Windows third party 8 Wednesday, June 12, 13
  9. 9. The Seven Principles • • • • • • • Data on the Wire One Langauge Database Everywhere Latency Compensation Full-Stack Reactivity Embrace the Ecosystem 9 Wednesday, June 12, 13 Simplicity = Productivity
  10. 10. (#1) Data on the Wire • Don’t send HTML over the network • Let client decide how to render data • Browser renders the templates as data changes 10 Wednesday, June 12, 13
  11. 11. (#2) One Language • Everything is JavaScript • Built-in JavaScript packages include: CoffeeScript jQuery Bootstrap Backbone 11 Wednesday, June 12, 13
  12. 12. (#3) Database Everywhere • MongoDB works on both the client and the server • The client-side database API looks just like MongoDB server-side API • Database operations are cached in memory on the client-side to yield... 12 Wednesday, June 12, 13
  13. 13. (#4) Latency Compensation • Designed to create a zero-latency connection to the database • Database on client-side is updated first • Database on server-side is updated later 13 Wednesday, June 12, 13
  14. 14. (#5) Full-Stack Reactivity • Embraces the concept of reactive programming • Everything is real-time • Templates automatically re-render themselves as data changes 14 Wednesday, June 12, 13
  15. 15. (#6) Embrace the Ecosystem • Meteor is open-source • Integrates existing open-source tools and frameworks 15 Wednesday, June 12, 13
  16. 16. (#7) Simplicity = Productivity • For something to seem simple, it must actually be simple • API are plain and simple 16 Wednesday, June 12, 13
  17. 17. Getting Started • Download Meteor • Create your first Meteor app • Explore the built-in examples 17 Wednesday, June 12, 13
  18. 18. Download Meteor • Unix/Linux $ curl https://install.meteor.com | sh • Windows win.meteor.com 18 Wednesday, June 12, 13
  19. 19. Create Your First Meteor App $ meteor create myapp $ cd myapp myapp $ meteor 19 Wednesday, June 12, 13
  20. 20. Live Demo! 20 Wednesday, June 12, 13
  21. 21. Explore the Built-in Examples • Four (4) built-in examples • Leaderboard (simplest) $ meteor create --example leaderboard 21 Wednesday, June 12, 13
  22. 22. Live Demo! 22 Wednesday, June 12, 13
  23. 23. Structuring Your Meteor Application • Special folders /server /client /public /lib /collections 23 Wednesday, June 12, 13
  24. 24. Smart Packages (1) • JavaScript programs • Extend your Meteor environment • Injects code into client-side or server-side of your application 24 Wednesday, June 12, 13
  25. 25. Smart Packages (2) • Core smart packages: spark reload livedata mongo-livedata minimongo 25 Wednesday, June 12, 13
  26. 26. Smart Packages (3) • List all available packages $ meteor list • Adding a package $ meteor add <package-name> • Removing a package $ meteor remove <package-name> 26 Wednesday, June 12, 13
  27. 27. Deploying Your Meteor Application • Full application server • Deploy on Meteor’s infrastructure $ meteor deploy myapp.meteor.com 27 Wednesday, June 12, 13
  28. 28. Meteorite • A wrapper utility for Meteor Developed by Tom Coleman • Supports third-party applications • Does everything Meteor does plus... 28 Wednesday, June 12, 13
  29. 29. Meteor Resources (1) 29 Wednesday, June 12, 13
  30. 30. Meteor Resources (2) • meteor.com • github.com/meteor/meteor • themeteorbook.com • eventedmind.com • atmosphere.meteor.com 30 Wednesday, June 12, 13
  31. 31. Steve 1:40:29 Tom Frank 1:35:37 1:35:20 31 Wednesday, June 12, 13 Mike 2:01:33
  32. 32. Thanks! mike@redlich.net @mpredli javasig.org 32 Wednesday, June 12, 13

×