03 June 2013
9 ways that Meteor JS raises expectations
Meteor is a relatively new JavaScript web framework that has taken big efforts to re-imagine how developers build applications. It has a lot of fantastic features that you normally hear about—e.g., sharing code between the client & server, reactive templates, data synchronization—but it has also drastically changed my expectations in regards to more common tasks while building web applications. Here are 9 scenarios that are normally a hassle with any framework, but are much easier with Meteor.
1. Setting up your environment
Once you’ve installed meteor, to create an application:
meteor create myapp cd myapp
That’s it—everything for the environment is inside a .meteor
directory. You can start up your local web server immediately. There’s even a .gitignore
file inside the .meteor
directory.
2. Running a dev server
meteor
Just run the command meteor
anywhere within your project, and it'll start the server right up.
3. Setting up a dev database
It just works—seriously—after creating your app, you have a local MongoDB ready to go. As long as your app is running (via meteor
), you can also connect directly to the db from the command-line, using:
meteor mongo
4. Installing dependencies
meteor add underscore meteor add spiderable
The first makes underscore available on the client and server, and the second makes all pages crawlable by search engines.
You'll see installed packages listed in the .meteor/packages
file. NPM is already fantastic, but this is even easier (no creating a package.json file), and it’s leaps and bounds above the extra effort you have to go through to get virtualenv + vitualenvwrapper working well with python.
For more dependency jazz, you can check out meteorite, which offers more packages, like the popular router package and many more.
5. Static file compilation
meteor add less meteor add coffeescript
Once you add those dependencies, any .less
or .coffee
files in your project are automatically compiled for you with no extra effort. This is way easier than I’ve seen it done in any language. There’s built-in stylus support too.
6. Combining and minifying static files
All static files are combined and minified for you in production—and not minified or combined in dev, for easier debugging. Furthermore, you don’t even specify CSS, JS, or even HTML files to be included on any page. They are all just combined together, which sounds a little odd, but it makes things even quicker and easier to develop.
7. Reloading pages after making changes
Whenever you save changes in your project, any web pages that are viewing your app will automatically refresh. It might be hard to break the habit of immediately hitting refresh in your browser after making changes, but all those little actions must add up.
8. Instant user account support
Setting up user accounts is super easy, you can add support for a variety of common user account systems and there’s even a default login widget that you can reuse:
meteor add accounts-ui meteor add accounts-password meteor add accounts-twitter meteor add accounts-facebook
Then in a template:
{{loginButtons}}
The interface itself even lets you seamlessly setup the app tokens for twitter, facebook, or other oauth services.
9. Deploying to a public server
meteor deploy foo.meteor.com
You can deploy to any unused subdomains of meteor.com and they’ll host it for free! You can deploy to other services or roll your own deploys, but this is a dead simple way to quickly make your project accessible to anyone.
Also, for good measure, here’s an animated gif of the meteor logo: