MEAN.JS Framework – Creating a Simple Blog App – Part 2, Generating an App and CRUD model

In part 1 we installed the basic dependencies needed to build a MEAN.JS app. In part 2 we’ll generate the basic app structure.


=> create a new directory for your project

$ mkdir meanjsblog && cd meanjsblog


=>generate the boilerplate code. 

$ yo meanjs


=>start the server

$ grunt

Verify that everything is working by navigating to localhost:3000; you should get a generic “Welcome to MEAN.JS” page.

After verifying there were no errors let’s generate a generic crud model named “Post”.


$ yo meanjs:crud-module Post

In part 3 we’ll explore the file structure and compare it to Rails’ file structure.

Parsing Reddit API – JavaScript & NPM package ‘Request’

Since I recently got extremely interested in Node stuff I wanted to play around with consuming JSON APIs using some NPM packages. I found two that did the job:

Here’s my example using ‘request’. I parsed the API for the Kendama subreddit and rendered each post’s title and body.


//consumeAPI.js

var request = require(‘request’);

request(‘http://www.reddit.com/r/kendama/.json?limit=5’, displayData);

function displayData(err, resp, body) {
if (err) {
console.log(err);
}
var jsonString = JSON.parse(body);
var arrayOfPosts = jsonString.data.children;

for (var i = 0; i < arrayOfPosts.length; i++) { console.log('--' + arrayOfPosts[i].data.title); console.log(' ' + arrayOfPosts[i].data.selftext + '\n'); } } [/javascript] And the result [text] $ node consumeAPI.js --Thoughts on transparents? Thinking about getting a transparent ozora from roots and was curious if the thin paint would be more prone to chipping or getting messed up. --TK16? Are the yellow Tk16s from amazon good? Heres the link:http://www.amazon.com/TK16-Master-Single-Color-Yellow/dp/B00EQJONNG/ref=sr_1_3?s=toys-and-games&ie=UTF8&qid=1424387722&sr=1-3&keywords=tk16+kendama#customerReviews --Sweets website down? I was looking to buy a HG but it looks like the websites down. Anyone know when ítll be back up? --Has anyone ordered from HiKendama? How is the paint, does it chip much? Sticky? Slick? How about the antique line? They look pretty rad, I kinda want one, but I am new to Kendama, so I am scared to spend the 30 dollars. --These look sick, anyone else gonna cop? [/text] Further Reading ---

MEAN.JS Framework – Creating a Simple Blog App – Part 1, The Setup

Tutorial time!

This tutorial assumes you already have some prior experience (not tons) with Mongo, Express, Angular and Node, and that you’re interested in knowing how to quickly bootstrap a CRUD app using the MEAN.JS framework.

Also it may help to know that I come from a Ruby on Rails background, so my approach to building this app was “I know how to do this in Rails, how do I do it in MEAN.JS?”

Let’s begin!!!

First you’ll need to install the prerequisites

=>install bower(frontend assets)
$ sudo npm install -g bower

=>grunt is used as the task runner
$ sudo npm install -g grunt-cli

=>install yeoman to generate scaffolding
$ sudo npm install -g yo

=>install the MEAN.JS generator
$ sudo npm install -g generator-meanjs

=>make the directory
$ mkdir blog && cd blog

In Part 2 we’ll generate a CRUD model.

Further reading
—–

Some Node in my life

I’m a big time Rails fanboy, but I decided I needed some Node.js in my life. I wrote a little file uploader and the upload speed and the small number of lines written blew my mind.

//require libraries
var fs = require('fs');
var http = require('http');

http.createServer(function(request, response) {
  //create file we write data to
  var newFile = fs.createWriteStream("newfile.pdf");

  //get file size and initialize vars
  var fileBytes = request.headers['content-length'];
  var uploadedBytes = 0;
  var uploadStartTime = new Date();

  //while request is still readable respond back
  //with the upload percentage
  request.on('readable', function() {
    var chunk = null;
    while (null !== (chunk = request.read())) {
      uploadedBytes += chunk.length;
      var progress = (uploadedBytes / fileBytes) * 100;
      response.write("progress: " + parseInt(progress, 10) + "%\n");

    }
  });

  //transmitting file upload to dump file
  request.pipe(newFile);

  //send final message once file upload complete
  request.on('end', function() {
    var uploadStopTime = new Date();
    var timeElapsed = (uploadStopTime - uploadStartTime) / 1000;
    response.write('----------\n');
    response.write(timeElapsed + ' seconds elapsed' + '\n');
    response.end('File Uploaded!\n' + '----------');
  });
}).listen(3000);

Uploading a 12 MB file.

curl --upload-file ~/Downloads/twelve-mb-file.pdf http://localhost:3000
progress: 0%
progress: 1%
progress: 1%
progress: 2%
progress: 2%
progress: 3%
progress: 3%
progress: 4%
progress: 4%
...
...
progress: 96%
progress: 97%
progress: 97%
progress: 98%
progress: 98%
progress: 99%
progress: 99%
progress: 100%
----------
0.053 seconds elapsed
File Uploaded!
----------

It reminds me of when I went to college and started using a T1 internet connection instead of the 14.4k modem we were using at home. My roommate downloaded a 5 MB file online and we figured we would go to the dining hall and eat while the file downloaded. To our absolute shock and amazement the file downloaded in about 20 seconds. Our minds were completely blown.