The Secrets of the Full Stack Ninja Workshop - Part A - The Client Side

grunt-contrib-watch

# how to kill a locked livereload port
➜  myBlog git:(master) ✗ grunt
Running "watch" task
Waiting...
Fatal error: Port 35729 is already in use by another process.
➜  myBlog git:(master) ✗ lsof -i tcp:35729
COMMAND     PID  USER   FD   TYPE             DEVICE SIZE/OFF NODE NAME
Google      308 odeds  209u  IPv4 0xa02f8facf3fa33fd      0t0  TCP localhost:50291->localhost:35729 (ESTABLISHED)
node      27569 odeds   12u  IPv4 0xa02f8facdaf1f3fd      0t0  TCP *:35729 (LISTEN)
node      27569 odeds   15u  IPv4 0xa02f8facdaf24be5      0t0  TCP localhost:35729->localhost:50289 (CLOSE_WAIT)
node      27569 odeds   16u  IPv4 0xa02f8facdb1ec3fd      0t0  TCP localhost:35729->localhost:50291 (ESTABLISHED)
➜  myBlog git:(master) ✗ kill -9 27569
[1]  + 27569 killed     grunt
➜  myBlog git:(master) ✗ lsof -i tcp:35729
➜  myBlog git:(master) ✗

npm 4 grunt

# Homebrew node install
brew install node

which node
/usr/local/bin/node
# which is a symlink to /usr/local/Cellar/node/0.10.26/bin/node

brew upgrade node


# install a module globally to be used as a cli module
# make sure shell path is updated to include the global /usr/local/lib/node_modules
npm install -g jshint
# example .jshintrc file
https://github.com/jshint/jshint/blob/master/examples/.jshintrc
http://www.jshint.com/docs/

# install a dev dependency that will automatically load all modules
npm install --save-dev load-grunt-tasks

npm install grunt-contrib-compass --save-dev
npm install grunt-contrib-watch --save-dev
npm install grunt-contrib-requirejs --save-dev
npm install grunt-contrib-copy --save-dev
npm install grunt-contrib-cssmin --save-dev
npm install grunt-cache-bust --save-dev


npm install --production
npm update --save

# remove removed packages
node prune

# update package.json to latest version
$ npm install -g npm-check-updates
$ npm-check-updates -u
$ npm install 

#when "npm update -g bower" fails with EACCES
sudo chown -R $USER /usr/local
 

server.js

/**
 * An express server to serve a SPA app
 * we use express to simplify handling of static files 
 * whilst directing all paths to main index.html 
 * for handling browser refresh
 * a more complicate solution using standard modules can be found here:
 * https://coderwall.com/p/b2kmkg
 * an interesting discussion:
 * http://stackoverflow.com/questions/7268033/basic-static-file-server-in-nodejs
 */
var express = require('express'),
        app = express();

app.use(express.static(__dirname + '/public'));

app.get('*', function (req, res) {
	res.sendfile(__dirname + '/public/index.html');
});

var server = app.listen(process.env.PORT || 8088, function() {
    console.log('Listening on port %d', server.address().port);
});

tagging with git

# adding a git tag
git tag -a 0.0.1 -m "create a SPA server"
git push --tags

# showing a git tag
git show 0.0.1

# checking out a tag
git checkout 0.0.1

# deleting a git tag
git tag -d 0.0.1

# to override a tag delete it first and then push it fircebly with -f
git push origin :refs/tags/0.0.1

# linking tags in markdown for README
Tags
-------------------------------------------------------------------------------
* [tag 0.0.1] - in this tag we've reached the point where we have a server set to our SPA app

[tag 0.0.1]:https://github.com/hamecoded/myBlog/tree/0.0.1

# incase shell does not load this key
ssh-add ~/.ssh/github_rsa