Tools

Tools used for HTML, Style sheets and JavaScript in web development.

Yeoman

Yeoman bundles Grunt and Bower with the scaffolding tool Yo used to setup a new web application as follows:

yo webapp

Grunt

Grunt is a build tool for compiling static HTML, CSS, JS and the likes from source files such as SCSS. It can be used to automatically recompile, show and/or reload files in the browser by running:

grunt watch

See also

Grunt
http://gruntjs.com/

Assemble

Assemble is a static site generator for use with Grunt. Starting an assemble project is easy with Yeoman:

npm install -g generator-assemble
mkdir project && cd project
yo assemble

See also

Using assemble with Yeoman (adding Yeoman to an existing project)
http://www.fettblog.eu/blog/2013/09/02/using-assemble-io-with-yeoman-ios-webapp-gruntfile/
assemble
http://assemble.io/
Yeoman assemble generator
https://github.com/assemble/generator-assemble

Bower

Bower is used like a package manager for client-side JS, CSS and other packages. It automatically installs, updates and manages libraries such as Twitter’s Bootstrap. For example, installing Backbone is easy:

bower install backbone

This will also include Backbone dependencies such as Underscore.

See also

Bower
http://bower.io/

Twitter’s Bootstrap

Bootstrap is a comprehensive front-end framework consisting of:

  • A basic HTML templates and good examples.
  • CSS with a grid systemm, sensible defaults for tags and styling for UI elements.
  • Reusable components built to provide iconography, dropdowns, navigation, alerts, popovers, and much more.
  • jQuery plugins for common interaction patterns.

The original version of bootstrap is built using Less CSS but a port using Compass is available as Sass Bootstrap.

Cross-browser testing

It is essential to test the design and functioning of a site across a range of different browsers and devices. To make this simpler, several services exist to create screenshots of webapps in different browser environments and/or to have live access to apps on different browsers and devices.

See also

BrowserStack
http://www.browserstack.com/
SauceLabs
https://saucelabs.com/
Read the Docs v: latest
Versions
latest
Downloads
PDF
HTML
Epub
On Read the Docs
Project Home
Builds

Free document hosting provided by Read the Docs.