DailyJS

DailyJS

The JavaScript blog.


Tagsass
Featured

node sass gulp boilerplate

Google's Web Starter Kit

Posted on .

Web Starter Kit

Web Starter Kit (GitHub: google / web-starter-kit, License: Apache 2.0) from Google is a boilerplate for developing responsive websites. It supports multiple devices, has a gulp.js build script, and has support for synchronising pages across devices during testing.

If you're a Node developer, then you might like the gulp.js-based environment. Typing gulp will build and optimise the current project, and gulp serve will run a server. There's also gulp pagespeed that uses Google's PageSpeed insights.

The sync feature for testing is powered by BrowserSync. BrowserSync is a Socket.IO-based Node application that automatically sends changes to pages as you edit files. It also has a gulp.js module that you can use with your own projects.

If you're wondering why a Node/Ruby project has come out of Google, then take a look at the Web Starter Kit contributors: it seems like it's another project by Addy Osmani and Sindre Sorhus, just like Yeoman.

Although this is a boilerplate project, the style guide makes it look more like something like Bootstrap. If you find Bootstrap too heavy for your projects and would prefer something lighter with workflow tools, then give Web Starter Kit a try.

Featured

css node modules sass vnc mozilla

Node Roundup: Node-sass, TowTruck, peer-vnc

Posted on .

You can send in your Node projects for review through our contact form.

Node-sass

Node-sass (GitHub: andrew / node-sass, License: MIT, npm: node-sass) by Andrew Nesbitt is a Node binding for libsass. It comes with some pre-compiled binaries, so it should be easy to get it running.

It has both synchronous and asynchronous APIs, and there's an example app built with Connect so you can see how the middleware works: andrew / node-sass-example.

var sass = require('node-sass');  
// Async
sass.render(scss_content, callback [, options]);

// Sync
var css = sass.renderSync(scss_content [, options]);  

The project includes Mocha tests and more usage information in the readme.

TowTruck

C. Scott Ananian sent in TowTruck (GitHub: mozilla / towtruck, License: MPL) from Mozilla, which is an open source web service for collaboration:

Using TowTruck two people can interact on the same page, seeing each other's cursors, edits, and browsing a site together. The TowTruck service is included by the web site owner, and a web site can customize and configure aspects of TowTruck's behavior on the site.

It's not currently distributed as a module on npm, so you'll need to follow the instructions in the readme to install it. There's also a bookmarklet for adding TowTruck to any page, and a Firefox add-on as well.

peer-vnc

peer-vnc (GitHub: InstantWebP2P / peer-vnc, License: MIT, npm: peer-vnc) by Tom Zhou is a web VNC client. It uses his other project, iWebPP.io, which is a P2P web service module.

I had trouble installing node-httpp on a Mac, so YMMV, but I like the idea of a P2P noVNC project.