Why meteor


Simplicity equals productivity

  • Faster Prototypes
    • MVP (Minimum Viable Product)
    • More time for user feedback and testing


  • People are more productive when they know that they are actually making headway in a project

don't reinvent the wheel

  • User Authentication & Security
      • Login Buttons / interfaces

  • Offline Synchronization

  • File compilation and minification
    • No need for grunt / gulp configuration

  • Client-side vs Server-side collection management
    • Why bother with offline browser data?

code is simple

Add Packages
 mrt add accounts-password
 mrt add accounts-facebook
 mrt add accounts-twitter mrt add accounts-google mrt add accounts-ui
Get Registration and Login functionality
 # Add this into ANY template that you want the login buttons to appear {{> loginButtons}}
Estimated Time: ~5 minutes

Angular is not

Need to be in 3 different areas (with loopback.io backend)
Login Controller
 angular.module('clientApp')
    .controller('LoginCtrl', function($scope, $routeParams, User, $location, AppAuth) {
        $scope.registration = {};
        $scope.credentials = {};

        $scope.login = function() {
            $scope.loginResult = User.login({include: 'user', rememberMe: true}, $scope.credentials,
                function() {
                    var next = $location.nextAfterLogin || '/';
                    $location.nextAfterLogin = null;
                    AppAuth.currentUser = $scope.loginResult.user;
                    $location.path(next);
                    $scope.currentUser = AppAuth.currentUser;
                },
                function(res) {
                    $scope.loginError = res.data.error;
                }
            );
        };
        $scope.register = function() {
            $scope.user = User.save($scope.registration,
                function() {
                    // successful!
                    $location.path('/login');
                },
                function(res) {
                    $scope.registerError = res.data.error;
                }
            );
        };
    });

Angular is not cont.

App Authentication Service
 angular.module('clientApp')
    .factory('AppAuth', function() {
        return {
            currentUser: null,

            // Note: we can't make the User a dependency of AppAuth
            // because that would create a circular dependency
            //   AppAuth <- $http <- $resource <- LoopBackResource <- User <- AppAuth
            ensureHasCurrentUser: function(User) {
                if (!this.currentUser) {
                    this.currentUser = User.getCurrent(function(user){
                        return user;
                    }, function(err){
                        return null;
                    });
                }
            }
        };
    });

Angular is not cont.

Nav Controller
 angular.module('clientApp')
    .controller('NavCtrl', function ($scope, User, $location, AppAuth) {
        AppAuth.ensureHasCurrentUser(User);
        $scope.currentUser = AppAuth.currentUser;
        $scope.$watch(function() {
            return AppAuth.currentUser;
        }, function(newValue) {
            $scope.currentUser = newValue;
        });
        $scope.options = [
            {text: 'Logout', action: function() {
                User.logout(function() {
                    $scope.currentUser =
                        AppAuth.currentUser = null;
                    $location.path('/');
                });
            }}
        ];
    });

Save time!

Angular with Loopback's built-in auth: ~3 hours
Angular with a REST API: ~6-10 hours
Angular code was NOT including G+, FB, & Twitter

Meteor with packages: ~5 minutes


That's a minimum 2 hours of time that can be utilized!

One centralized stack

  • Code is similar between client & server

  • Same language: JavaScript

  • Why use different APIs?
    • PHP vs JS and Node vs Client-side JS
    • Learn one API and get things done on both ends

  • Developers can more easily work on both ends
    • Front-end developer?
      • Doesn't exist with Meteor
      • Front-end === Full-Stack

the community

  • Meteor has a very large community
    • Constant contributions towards both packages and core

  • There are over 1500 packages on Atmosphere right now!
    • Easy to find drop-in items for functionality you need
    • Example: contact form

  • StackOverflow and the IRC channel are VERY active
    • IRC channel has people come in all the time for help
    • Almost instantly answered with code examples

Packages

  • Keep true to the  DRY (Don't Repeat Yourself) principle
  • Utilize code without copy / paste
 mrt add package-name-here
  • Packages can be easily updated for newer versions
    • copy/paste code is not as easily updated
    • the community can help update the package

  • Easy to contribute to packages and IMPROVE on functionality that already exists
    • Improvements help the community as a whole as not just ourselves



Tell me something I don't know


Pub / sub messaging paradigm

  • Decide what is PUBLISHED (server) and what is SUBSCRIBED (client)

  • Only subscribe what you WANT the client to see
    • Efficient client-side data cache

  • Implementation in Meteor is only a few lines of  code

  • No need for custom cache controller

angular support

  • Package for angular support, yes. it exists

  • Not needed, but if wanted, it is possible

DDP


  • Stands for Data Distribution Protocol

  • Uses Websockets or SockJS 
    • Real-time data synchronization

It is the future

  • Meteor is working on standardization & documentation
  • Open protocol
    • APIs can be changed to use DDP
      • Real-time APIs
    • Can diminish the need for REST APIs

  • Imagine grabbing data from various sources... all real-time
    • Less calls, using socket connections
      • Still efficient by sending only what data changed

scalability

  • USED to be a slight issue version < 0.7
    • Only really applied to application with over 5000 concurrent users 
    • And a user base of over 15000
    • Poll-and-change method
      • On query & every 10 seconds

  • NOW you can scale applications easily
    • Mongo oplog tailing
    • No more polling
    • Watch this video on an explanation
      • Watch until about 1 hour in



current meteor applications


Streem.io

  • Built using Meteor < v.70
    • Still able to scale project

  • Bought by Box.com

  • Very complex project

Lookback

  • Real-time User feedback system

  • Used by big companies like Spotify

  • Built iOS app with Meteor
    • If they can do it, we can too

Respondly

  • Twitter and Email team management system

  • Gets updates in real-time and sends you notifications
    • Twitter especially

  • Used by companies like:
    • Stripe
    • Slack
    • pocket

Chapp

  • Real-time chat application

  • IRC / Slack-like
    • But, built with Meteor

  • Handles a couple hundred users without a problem

Want to see more?


Go to http://madewith2.meteor.com

quotes



I’d say that Meteor is actually quite stable — although it doesn’t have the 1.0 moniker yet, it’s pretty close and certainly isn’t an immature project.
- Tom from Percolate Studios



We have more than a dozen apps in production right now, and are not experiencing any stability issues.
-Developers at Differential.io


The key difference between Meteor js and other frameworks like Angularjs or Backbone is that, Meteor js uses a DDP (Data Distribution Protocol) for its client server communication, unlike Angularjs or Backbonejs which rely on REST endpoints for serving data from server & keeping it in sync with the client. What does this mean? This means that as Javascript developers we need not worry about how the data travels between server and client, if they are in sync etc. but rather concentrate on more important things like the actual business logic.

-thejackalofjavascript.com

adopt it Now

  • Become the Meteor Experts

  • It is the future of web development
    • Stay ahead of the competition
    • DDP is going to spread

  • Learning it now will save time and money later
    • Use it to build applications faster!




Questions?

Made with Slides.com