Lesson 7: Angularjs/Nodejs/MongoDB Tutorial: Hooking up Node REST server to mongoDB using mongoose

In Lesson 6, we created unit test specs for both our client and server. So far, we have a fully working and tested CRUD for devices. But, the server is still using a static javascript array to hold the list of devices. Its now time to refactor our server side code and hook it up to mongodb using mongoose framework. Since we have good tests, we should feel comfortable in refactoring the code base.

Installing and starting mongodb

1. brew update
2. brew install mongodb
3. mongod&

STOPPED DEVELOPMENT OF THIS IN ANGULAR. Currently, I am developing in Meteorjs framework and its a completely refreshing way to build fully functional websites. Check out the new post regarding meteor.

Meteorjs is way better than Angularjs

After going through the AngularJS tutorials and working through the Device Management app, I decided to redo the example app in Meteor framework. What a refreshing change.... I dabbled in Meteorjs when it was v.0.3 and found that it was not mature enough. A year later, it has significantly improved and the current version meteor 0.7.0.1 is pretty robust. There are also some excellent books & tutorials that help decrease the learning curve significantly on Meteor.

Angularjs on the other hand is still as cumbersome as ever. Once you get past the cool templating schemes of angular, writing even a small application takes an inordinate amount of time. Documentation is severely lacking and the dependency injection constructs get so messy that it hurts my eyes to look at them.

Compare the following to add a device:
-----

	//route
	$routeProvider.when('/add', {templateUrl: 'partials/addDevice.html', controller: 'addDeviceController'});
	//controller
	.controller('addDeviceController', ['$scope', '$location', 'Devices',
	function($scope, $location, Devices) {
	$scope.add=true;
	$scope.add = function(device){
	if(!device) return;
	// if device to add does not have and Id, create a random num id
	if(device.id == undefined){
	var randomnumber=Math.floor(Math.random()*1001);
	device['id'] = randomnumber;
	}
	var newDevice = new Devices(device);
	newDevice.$save(function success(){
	// redirect to main screen
	$location.path('#/');
	}, function error(response){
	console.log("Add Device Failed: " + response.status);
	});
	}
	}])
	WITH:
	//Route
	this.route('deviceNew', {
	path: '/newDevice'
	});
	<template name="deviceNew">
	<form class="main">
	<div class="control-group">
	<label class="control-label" for="name">Name</label>
	<div class="controls">
	<input name="name" type="text" value="" placeholder="Give a descriptive name"/>
	</div>
	</div>
	</template>
	Template.deviceNew.events({
	// add a new device
	'submit form': function(e){
	e.preventDefault();
	var device = {
	name: $(e.target).find('[name=name]').val(),
	os: $(e.target).find('[name=os]').val(),
	owner: $(e.target).find('[name=owner]').val()
	}
	Logger.info("In deviceNew event: ",device,"deviceNew");
	Meteor.call('insertDevice', device, function(error, id){
	if(error)
	throwError(error.reason);
	Router.go('devicesList');
	});
	}
	});

view raw gistfile1.txt hosted with ❤ by GitHub

-----

Meteor is extremely well integrated full-stack web development solution from front to back. Client side templating, packaging, accounts-ui, caching, reactive response. Server side database integration, reactive & collections.

Meteor collections takes care of both the client and server side code, has a pretty clean model for templating and the meteor packages are a god send. Meteor accounts-ui package provides an out of the box secure authentication model with integration with various provides like google, facebook, github etc. All with 3 lines of code.

Everyone's mileage will vary, but for me Meteor is a very refreshing fullstack web development environment. Its easy to learn, fun to develop in and is being actively worked on by some of the smartest people in the industry. Looks like the roadmap is solid and is being executed on.

If you want to view the device management app in Meteor checkout https://github.com/sunkay/device-safe

If you want to view the same app written in Angular checkout: https://github.com/sunkay/cotd