7 Reasons to Develop Your Next Web App with Meteor

When I first learned about the Meteor JavaScript framework, I saw someone write, “Meteor is to Node.js as Rails is to Ruby,” and I think that’s a good comparison. A few years ago, Rails was the hot new thing on the web, sprinkling some useful “magic” through the development process to make programming on the web more approachable and pleasant. Out of the countless new frameworks that have spawned as of late though, none have made me feel the way Rails did as much as Meteor — a framework that you should seriously consider using for your coming projects. Here’s a few reasons why.

1. Your applications are real-time by default.

Lately, companies like Twitter and Facebook have been moving toward a real-time web. It’s inevitable that, sooner than you probably expect, users will expect web applications to work near-instantaneously. I imagine there’s already users who wince whenever a separate page load is required for simple tasks like changing settings and logging out.

The problem is, creating real-time web applications is tricky. Or at least, it was. Meteor has real-time built into its core though. When the database is updated, the data in your templates is updated. When a user clicks a button or submits a form, the action occurs immediately. In the vast majority of cases, this doesn’t even require any extra effort. You build a web application as you normally would and, out of the box, it just happens to be real-time.

A while back, the folks at Meteor released a screencast to demonstrate these real-time features, and it’s very much worth a watch, but there’s a range of production applications that do an even better job of showing off the Meteor difference:

These are just a small sample, too.

2. You can develop with just one language.

One of the frustrating parts of being a web developer is the need to wear a variety of hats. You need to think about the front-end, the back-end, and the database, and then there’s another million details that squeeze out the last inch of your mental capacity. Meteor simplifies this process by shrinking the scope of what you need to consider, allowing you to build and manage the front-end, the back-end, and the database with nothing but JavaScript.

This, for instance, is how we create a “collection” — the equivalent of an SQL table – in Meteor:

BlogPosts = new Meteor.collection('posts');

So, we can create a collection with a familiar syntax, but also manipulate a collection with a familiar syntax. Here’s how we insert data:

BlogPosts.insert({
  title: 'Hello World',
  content: 'This is the content.',
  published: true
});

There’s another benefit to writing an entire application with one language. One line of code can run on both the client and the sever and do different things in either environment. Here’s why this matters:

When the statement to create a collection runs on the server it, predictably enough, creates a collection. But when that same statement runs on the client (which it will do by default), it creates a purely local collection within the user’s browser. The user then interfacts with the local collection directly, which is why the data on their screen can change instantaneously, while the local and server-side collections are seamlessly synced in the background.

This doesn’t require any special treatment. You write one line of code and are provided with a boat-load of functionality in addition to being able to use a familiar syntax throughout the development cycle.

3. You can save a lot of time with smart packages.

Let’s say you want to create a user accounts system within a Meteor project. How might you approach it? If your first thought was, “Well, I’d create a collection for the user’s data,” then you’re already thinking too hard.

In Meteor, this is how we create an accounts system:

meteor add accounts-password

We run this command in a terminal, and Meteor adds one of its built-in “smart packages” to the project. This particular package creates an accounts system that expects an email (or username) and password. But what if we wanted to let users sign up with their Twitter account? Then we could write:

meteor add accounts-twitter

Or, with their Google account:

meteor add accounts-google

Or, Facebook:

meteor add accounts-facebook

We could even run all of these commands so our users could choose how they want to sign up.

Meteor also provides an accounts-ui package that creates the front-end of this accounts system, and that only requires one other command:

meteor add accounts-ui

With our account system in place, we can do everything we would reasonably need to do when working on a web application, like checking if the current user is logged in via one of our templates:

{{#if currentUser}}
  <p>You're logged in.</p>
{{else}}
  <p>You're not logged in.</p>
{{/if}}

Or navigating through and manipulating the Meteor.users collection, which is the collection that Meteor creates to store the data of our users.

Smart packages are not just for accounts though. There’s a range of them already available, with more presumably on the way, and they all allow you to do something cool, including:

  • Writing your applications in CoffeeScript.
  • Automatically compiling LESS files into CSS.
  • Integrating extras like D3.js and Bootstrap.

But if smart packages don’t have what you need, then the increasingly large library of third-party packages will probably have you covered.

4. The community is extremely supportive.

Nothing attracts me more to a new framework or technology than an active and vibrant community. I figure that, if the community’s active, then:

  • There’ll be a lot of detailed documentation.
  • I’ll waste less time getting up to speed with the basics.
  • The technology won’t hit the deadpool in the near future.

Luckily, Meteor’s community is already one of its greatest assets. There’s a ton of helpful resources that have spawned from people’s love of the framework, including:

  • Crater, a Reddit-like site for keeping track of what’s happening in the world of Meteor.
  • Evented Mind, a video training site for intermediate developers wanting deeper insight into how Meteor works.
  • Kadira, a performance tracking application that is both easy to use and has a reasonable free plan for getting started.

The official YouTube channel for Meteor has a range of talks from Meteor meetups and there’s plenty of blogs to follow for tips and tutorials:

But if you’re still not satisfied with what’s available, Stephan Hochhaus maintains a huge list of Meteor resources that has a little something for everyone.

5. It’s optimized for developer happiness.

Just about every framework markets itself as a better and more enjoyable way to work. What I appreciate though is Meteor’s attention to detail in holding true to its promise of optimizing for developer happiness.

Take this code, for instance:

<head>
  <title>Your Cool Meteor App</title>
</head>
<body>
  {{> myCoolTemplate}}
</body>

<template name="myCoolTemplate">
  <p>Hello world.</p>
</template>

This is a basic interface for a Meteor application with a template included between the body tags. (For templating, Meteor uses Spacebars — a Handlebars-inspired syntax.)

But notice that:

  • We haven’t included the html tags.
  • We haven’t included any CSS files.
  • We haven’t included any JavaScript files.

…and that’s because we don’t need to do these things since Meteor takes care of them for us. Is this the most significant feature in the world? Nope. But it’s indicative of Meteor’s interest in making every developer’s life that little bit easier at every turn.

Other pleasant details include:

  • A built-in LiveReload feature so you won’t have to manually refresh your browser.
  • The freedom to structure your projects however you want. There are standards you can follow but no strict rules or conventions.
  • The sheer modularity of Meteor that allows you to mix-and-match different components in case one part of Meteor isn’t to your liking.

So while Meteor has its fair share of “magic” and conventions designed to make your life easier, you can still make choices based on your personal preferences. It’s the best of both worlds.

6. It’s friendly to beginner developers.

What surprised me about Meteor was how quickly I was able to start building things that were actually kind of cool. I’d heard people refer to the framework as “easy” but, usually, other people’s definition of that word differs from my own. In this case though, they were right:

Meteor is one of the easiest frameworks for beginners to learn.

It’s still programming, and you’ll want to be familiar with the syntax of JavaScript — variables, loops, conditionals, JSON, etc. — but you don’t need to be a JavaScript ninja to make a start. You don’t even need prior experience with making web applications (it’s a great choice for front-end developers looking to bolster their skillset). You might not grasp all of the concepts right away but that won’t stop you from enjoying the practical side of things.

As for why Meteor is such a great fit for beginning developers, it’s mostly for the same reasons that I recommend Meteor in general:

  1. You only need to know a single language.
  2. There’s a ton of community-made resources.
  3. It’s optimised for developer happiness.

So even if you stumble across a slight hump when learning Meteor, just push a little further and I think you’ll find that those humps are few and far between.

7. It’s ahead of the tech curve.

Like I said earlier, the web is becoming a real-time environment, but the shift won’t happen purely based on the actions of the big companies with the big budgets. The shift will happen as tools become available that allow small teams and individual developers to make real-time applications quickly and easily. Meteor is amongst the first wave of this tools and its “all in one” approach is surely going to make it a big player in the coming years.

The folks at Meteor have stated their long-term mission, and to put it plainly, their mission is huge:

…to build a new platform for cloud applications that will become as ubiquitous as previous platforms such as Unix, HTTP, and the relational database.

Can they pull this off? No one can say with absolute certainty, of course, but they have the funding, the community, and the ever-important balance of being great for developers and great for end-users. So at the very least, they’re on the right track (and it’s a track where I’m glad to be tagging along for the ride).

Conclusion

As of writing these words, Meteor is still young at version 0.8.2, but the releases are coming big and quick, and a range of impressive Meteor-built apps are live and being used on the web. Your particular situation will determine whether or not a particular framework is the right fit for you and your creations, but every developer owes it to themselves to at least play with Meteor for a day or two. I haven’t had this much fun with programming on the web in a long while and there’s a good chance you’ll feel the same way.

Free book: Jump Start HTML5 Basics

Grab a free copy of one our latest ebooks! Packed with hints and tips on HTML5's most powerful new features.

  • Kate Perry

    Google is paying 80$ per>>CLICK NEXT TAB FOR MORE INFO AND
    HELP

  • Md.Ibrahim

    Meteor is really something! Could you please elaborate on point No.2? How does Meteor assume my back-end and database?

    • Gregory

      Your server-side DB is essentially replicated on the client-side (with security considerations in mind), allowing you to write code that appears to directly access the DB from the client side. The framework will then manage the data sync between the client and server for you.
      So instead of getting or posting data from the server with Ajax requests, you just say ‘get me this or that from the db, or update the db with this new piece of data’ and you don’t have to worry about how it ends up on the server.
      You can manage permissions and validations with simple rules that allow you to define what data is available to the client (for example only make available data belonging to the logged in user) as well as validate all data sent over to the server before it is inserted in the db.

      • Md.Ibrahim

        Thanks for your comment. Can please add more details to how “server-side DB is replicated on the client-side” or maybe link me to some resources?

  • hugovermaak

    How about Meteor vs Express? I am new to Node.js and would like to pick one of these as the web framework. Meteor surely looks good.

    • Gregory

      I would recommend Meteor. Express is a server-side framework for Node, like Django or RoR are for Python and Ruby. Meteor is a full stack framework. It is like AngularJS combined with RoR in one very simple and easy to use package. Enjoy

  • Roman

    I watched the demo, saw that it was possible to manipulate the database from the client, and I wondered about security implications of this…

    • Gregory

      You can create rules about what data is published from the server to the client, as well as what update to the data from the client will be accepted by the server.

  • vladimir prieto

    what about community? i think Node’s bases frameworks has a bigger community, and that said to me that those are more used.