Monthly Archives: August 2013

Day 75, CSS monster is Barry

I can’t believe my eyes. Barry did a complete redesign of the CSS in 12 hours. CSS monster or rather, master!

Now, some intermediate promises:

var p1 = p1Collection.fetch();
var p2 = p2Collection.fetch();
$.when(p1, p2)
  .done(function(){})
  .fail(function(){
    if (p1.state() === 'rejected') {
      //
    }
    if (p2.state() === 'rejected') {
      //
    }
  });
Standard

Day 74, tHiS a FeAtUre

The joke is on us today. We have been joking around the whole day about all the bugs we had in our project. “No, it is not a bug. It is a feature.”

Until, we ran into this classical *** undefined is not a function bug after deploying our app to Nodejitsu. It took Hao and me a while to find out that, much to our surprise, the filesystem on Mac OS is case insensitive by default. AND, according to this Stack Exchange article, “this is not a bug. It is a feature of the file system”.

One of our JavaScript file’s camelCase was off by a letter. It works fine in Mac because it is case insensitive, but it doesn’t work in a Linux environment because it is case sensitive.

Now I am worried about all the other places that the same type of bugs might exist.

Standard

Day 72, how to store express.js session in mongodb

There are many ways to store sessions in Express.js, including:
– Memory
– Traditional database
– In memory database

Our group project is using MongoDb to store session. The code is:

  var express = require('express');
  var mongoose = require('mongoose');
  mongoose.connect('mongodb://myuser:mypass@localhost:27017/mydb');
  var MongoStore = require('connect-mongo')(express);
  app.use(express.session({
    store: mongoStore(new MongoStore({ db: mongoose.connection.db })),
    secret:"changeme"
  }));

If we are going to use Redis, the code would look like(?):

var RedisStore = require('connect-redis')(express);
app.use(express.session({
  store: new RedisStore({host: 'localhost', port: 3000, client: redis}),
  secret: "changeme"
}));

Do we have to turn on cookie to support session? The answer must be yes.
A good article to read: http://stackoverflow.com/questions/5522020/how-do-sessions-work-in-express-with-nodejs/11585839#11585839


// pass a secret to cookieParser() for signed cookies
app.use(express.cookieParser('manny is cool'));

// add req.session cookie support
app.use(express.cookieSession());
Standard

How to test a bower package with travis-ci

First, you have to make a Bower package. See my previous post: how to build a Bower package.

Then, you have to make your Bower package a NPM package. WTF? You must be wondering, why? Because Travis-CI needs additional packages to run your tests, and it runs “npm install” inside your project folder to do that.

To make it a NPM package, just run

npm init

Then, you have to install grunt, mocha etc. In the end, your package.json should have this section

  "devDependencies": {
    "grunt-mocha-test": "~0.6.3",
    "grunt": "~0.4.1",
    "chai": "~1.7.2",
    "grunt-cli": "~0.1.9"
  }

Hint:
Use 

npm install grunt --save-dev

so that it will save your npm install history to the package.json file.

Then, you have to set up .travis.yml for Travis CI. My file looks like this:

language: node_js
node_js:
  - '0.8'
  - '0.10'
before_script:
  - npm install -g bower
  - bower install
script: grunt test

It does a couple of things:
– It runs “npm install” to get grunt, mocha and all that …
– It runs “npm install -g bower” for the next command
– It runs “bower install”, which reads bower.json and install the Bower package we want to test
– It runs “grunt test”, which runs mocha to test the Bower package

Now, it is time to write some serious tests…

Standard

How to build a bower package

Time to extract part of our group work and make it a separate package. Basically, we built a Backbone wrapper for Foundation Reveal Modal, and I wanted to make it a Bower package.

Brief intro about Bower:
Bower is a package management system by Twitter for front-end, similar to NPM for the backend.

Steps to build a Bower package:
1. Make a github repo and put all your code in it (any git repo should work)
2. Run “bower init” in the repo directory and follow the instructions
3. Run “bower register”

bower register backbone.foundation.reveal.modal git://github.com/shaohua/backbone.foundation.reveal.modal

4. Run “bower search foundation”. Horray, it is there!!!

    foundation git://github.com/zurb/foundation
    foundation-icons git://github.com/zurb/foundation-icons.git
    components-foundation git://github.com/components/foundation.git
    sass-foundation git://github.com/mmcgahan/sass-foundation.git
    bower-foundation-css git://github.com/ch1c0t/bower-foundation-css.git
    backbone.foundation.reveal.modal git://github.com/shaohua/backbone.foundation.reveal.modal

P.S. how to make a npm package. http://decodize.com/javascript/build-nodejs-npm-installation-package-scratch/

Standard