Technology Introduction

Meteor 101 presentation by Mike Barkas

This is a very basic overview of the Meteor platform

What is Meteor?

Meteor is not just one thing.

It is a collection of technologies working together.

Open source, pure Javascript, platform

encompassing server-side to client-side

For building Web applications

Meteor Development Group

San Francisco, CA

Who Makes Meteor?

Meteor was created in 2012 by Geoff Schmidt, Nick Martin, and Matt DeBergalis.

Backed by Andreessen Horowitz, Matrix Partners, Y Combinator, and individual investors

Meteor was originally named Skybreak

the name was changed in 2011

Meteor, an ultra-simple, database-everywhere, data-on-the-wire, pure-Javascript web framework.      - github/meteor

Meteor is a complete open source platform for building web and mobile apps in pure JavaScript.      - meteor.com

Principles of Meteor

Data on the Wire. Meteor doesn't send HTML over the network. The server sends data and lets the client render it.

One Language. Meteor lets you write both the client and the server parts of your application in JavaScript.

Database Everywhere. You can use the same methods to access your database from the client or the server.

Latency Compensation. On the client, Meteor prefetches data and simulates models to make it look like server method calls return instantly.

Full Stack Reactivity. In Meteor, realtime is the default. All layers, from database to template, update themselves automatically when necessary.

Now lets look at how Meteor implements these principles by looking closer at the stack technology

Meteor Full Stack Technologies

MongoDB

Data Source

Livequery

Creates a stream of create, update, and delete messages 

DDP

Continuous data transfers

Application

Client cache mini database 

MiniMongo

Web app with optional mobile platform wrappers

Blaze

Reactive UI library and templates

implementing Meteor Tracker

Network

Client

Server

Old Stack Technologies

SQL

Data Source

PHP ASP

Application

Templates

HTML CSS

Network

Client

Server

Server Logic

Presentation Layer

Website

Request and Response

SQL

PHP ASP

Website

Templates

HTML CSS

Network

Client

Server

MongoDB

Livequery

Meteor

MiniMongo

Blaze

DDP

DDP

Distributed Data Protocol

Network

Client

Server

MongoDB

Livequery

MiniMongo

DDP

A simple protocol for fetching data from a server, and receiving live updates.

JSON messages over a Websocket

Publish and Subscribe

Network

Client

Server

Publish Data

Subscribe to Data

Data is published, sent out from server-side code.

Subscribe to only the data or content needed for that template.

Meteor Pros and Cons

Pros:

One language, client and server

MongoDB

Client-side data storage

Continuous syncing client and server

Latency compensation

UI Reactivity

Cons:

Content management

 

Creating and Developing Meteor Apps

Simple install process:

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

Home directory on *nix systems

Developer Tools:

Includes stack to run Meteor

Meteor command line tools

Insecure and autopublish packages

Debug and inspect with browser console

Your First Meteor App

Initial project set up behaves like single page app

.meteor/

appName.js

appName.html

appName.css

cd appName

meteor
meteor create appName

Extend your project with Packages (plug-ins or modules)

Atmosphere Package Collection

https://atmospherejs.com/

meteor add twbs:bootstrap

Extending Meteor

Isolating Client and Server Code

For security and performance

Conditional checks in code

if (Meteor.isClient) {
    
    // Code to run on client

}



if (Meteor.isServer) {
    
    // Code to run on server
    // Do not include sensitive data

}

Isolating Client and Server Code

For security and performance

Isolate and segment code using a directory structure

server

client

public

Client directories are not loaded on the server

Sensitive code not served to the client

For favicon.ico, robots.txt, and similar files.

There are other directories and file loading precedence

Begin with Meteor

Install local instance to learn

Experiment

Look at tutorials

Read the documentation

Meteor Developer Accounts

Your Meteor developer account is one username to identify you across the Meteor community.

You can use it to publish packages, deploy apps, and log into other sites.

sign up at:

meteor.com

Meteor Simple Hosting

Using your Meteor developer account, you can use their simple hosting service.

This is not production level hosting service

Basic prototyping and displaying your app.

Simple subdomain hosting

yourapp.meteor.com

Resources

Meteor site

Meteor install

Meteor API docs

http://themeteorchef.com

The Meteor Chef

https://www.discovermeteor.com

Discover Meteor

Meteor JS Club

https://meteorjs.club

http://www.meteor.com

http://www.meteor.com/install

http://docs.meteor.com

https://crater.io/

Crater Meteor News

Install Meteor

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

More info:

https://www.meteor.com/install

Meteor 101

By mikebarkas

Made with Slides.com

Meteor 101

The fundamental concepts of the Meteor framework.

  • 162

More from mikebarkas