The Force Awakens: A Star Cluster of Meteor & Angular

A long time ago in a galaxy far, far away…the trends of web development inspired more and more developers to write real-time applications.

With the appearance of nodejs front-end, the developers got the possibility to create server & client ends on traditional javascript.

The notion “isomorphism” grew in popularity in 2015. In simple words, isomorphism is a possibility to use one and the same code either on server side or on the client one. Meteorjs has played the major role in the establishment of this approach.

Meteorjs is a framework which helps to create module client-server real-time applications.
Meteor allows to create isomorphic applications which means that your code will work on different platforms (client, server, ios, android).

This framework possesses outstanding tools to work with data thus allowing us to use one and the same interface on client as well as on server side. Meteor uses DDP protocol which supports the dual sided data transfer and works via WebSockets & SockJS.

Some people compare (or try to do it) Meteor & Angular, but it’s ultimately wrong. Frameworks pursue different aims and can (and must) work together.

AngularJS has lots of abstractions which help to make the development of client single-page application faster, easier & what is more important – more fun. All we need is to make AngularJS friends with meteorJs (what was already done by angular-meteor.com).

After angular-meteor installation, your simple application can look like:

app.js

Enter “meteor” in command line at your project folder. Meteor will collect your code & launch server.

Then lauhcn meteor mongo at your project folder & insert the string:

One can see that the data has been updated on the fly, though we didn’t use any additional approaches.

We can extend the existing code by adding a feature of new entity addition. Then add the further code into app.js file:

and into index.html this one:

Now we can add a new robot from client end. One should pay attention that a new record will be added not only into client end $scope, but also into server database.
All this happens due to DDP protocol: (https://github.com/meteor/meteor/blob/devel/packages/ddp/DDP.md).
Please, note that we request Robots.insert method, which can also be used on server.

It’s just a simple example showing the perks of combined use of angular & meteor. You should definitely try all the loveliness of both frameworks. Directives, filters, services – are strong points of angular and data binding, userfriendly deploy, isomorphism, build & minification systems are of meteor.

It’s worth noting, that using such binding, the developers have no need for setting up the environment.
It’s Meteor that provides all this from its box. One shouldn’t worry about your favorite build system installation (grunt, gulp, webpack). Meteor has its own tools of packaging & project minification, embedded into autoreload, convenient package management system and many other things.

The indispensible part of any technology is its dark side or drawbacks. Unfortunately, MeteorJs doesn’t support sql databases. The solution is to use additional meteor-packages, but it looks like Chewbacca after a shower of rain – quite a pitiful sight. So, to сreate a really good application, one should examine both frameworks thoroughly which can take long.

The very approach of development on meteor might seem unaccustomed for the fans of API-first approach and this might also take some time to get used to it. Without doubt, both frameworks (meteor & angular) come with auto-magic: it can frighten the developers, used to control all internal processes to the last detail. So, there’s no decisive answer.

In any case, both of them are open & their source codes are available for reading at Github.

In conclusion, it’s worth to point out that meteor & angular binding allows to create isomorphic real-time applications faster & easier than it was ever earlier.

May the Meteor be with you. The Angular is strong with this one.

P.S. So, what do you prefer for full-stack development?