Right, Javascript. Used it a bit before, so not too bad. Should know it better, so things might get a bit interesting towards the end. Added fun of Node, which is mostly new.
1. Hello James
Easiest way to do things is to use the console in the browser. Empty 'index.html' with a script tag leading to 'script.js'. Does mean that it's just a function, rather than taking an argument directly: hello("James");.
To fix that, we can use Node. Apparently I've already installed that, which is good. This lets you run files from the command line, as in node hello.rb James which works as with Ruby, and outputs "Hello James" as desired. Excellent.
2. FizzBuzz
Test framework for this part will be Jasmine, which is a bit Rspeccy, but with more brackets and more browser. Specs are run by reloading a 'SpecRunner.html` file in the browser, which is a little slower than the command line... Also, JS failure messages are a little more obscure (though perhaps less so at the FizzBuzz level). Also, occasionally it will just tell you that you have no specs and no failures because you misplaced a bracket...
I probably shouldn't find it this amusing to watch JSLint (built into Brackets) freak out at the sight of Jasmine.
Nice thing to note about JavaScript here is the ability to return functions. Which means that you can declare one function for all the division checks:
function divisibleBy(divisor) {
return function (number) {
return number % divisor === 0;
};
}
You can then call this as:
divisibleBy(3)(number);
So that's all well and good, but there's a better way to run tests. Karma! (cheers, Peter). Installed with npm install karma --save-dev to save it locally, and include it as a dependency. Command line interface added globally with npm install -g karma-cli. Configuration handled easily with karma init my.conf.js. This generates a personalised config file you, which needs to be included when you run the tests.
karma start my.conf.js
This gives you a process running in the terminal which tells you if all your tests have passed whenever it detects a change in any of the files you specified during configuration.
And that's pretty cool.
Better, you can get notifications with the karma-osx-reporter plugin, which give you pass/fail notification every time you save a file. (I tried to do this with Grunt, but didn't get far enough). So, every time you make a change, you get feedback. If there's a problem, you can check the command line to see the errors. Nice setup.
3. Landing Page
OK, Node. This is new. Well, it's installed at least, which is a start.
Next is Express, which is like Node Sinatra, kinda. Installed globally with NPM. Also worth installing the express generator to get a new project started: npm install -g express-generator. This gives you the express command, which I ran as:
express -H -c less
On its own, express generates the default app skeleton. -H goes for the Hogan templating language, which the guide I'm vaguely following recommends (at least until they change their mind). The default is Jade, which is whitespacey and so probably not going to be to my liking anyway. -c less lets you use Less instead of CSS which is always good fun. Anyway, here's the output:
create : .
create : ./package.json
create : ./app.js
create : ./public/javascripts
create : ./public
create : ./public/images
create : ./public/stylesheets
create : ./public/stylesheets/style.less
create : ./routes
create : ./routes/index.js
create : ./routes/users.js
create : ./views
create : ./views/index.hjs
create : ./views/error.hjs
create : ./bin
create : ./bin/www
Lots of fun new toys to play with. The rest get added with npm install (I've just noticed OSX is correcting 'npm' to 'nom', so apologies if that's been happening all post... possibly a candidate for aliasing...). App's up and running with npm start (or DEBUG=3-landing-page ./bin/www if you want to follow the Express instructions... which I don't in this case...).
Quick aside to replace hogan with hogan-middleware. Replaced hjs with "hogan-middleware": "*" and re-ran npm install (should have changed this before, but oh well). Also the quick addition of the following lines (replacing the hjs equivalent):
app.set('view engine', 'mustache');
app.engine('mustache', require('hogan-middleware').__express);
Also important to rename '.hjs' files to '.mustache' files or you might waste a while trying to work out why everything was broken after you installed Nodemon... Ahem...
Next, Nodemon. Installed globally to allow use from the command line. Running nodemon works about the same as npm start but it watches for changes to files and reloads accordingly (à la Shotgun).
So, there should be more stages to this, but I got a job, and suddenly have less time to spend on things that are not Ruby. Which, hey, isn't the worst thing in the world... This'll be updated if I get the chance to get back to it.