Front-End Dev Wiki

A document in which I collect front-end dev stuffz, to which I want to have easy access to.

JavaScript

Styleguides

• Idiomatic.js
  This styleguide has been recommended by Addy Osmani in his styleguide article.
• Crockford's JavaScript Code Conventions
  The crockfordian code conventions.

Important Libraries

jQuery

• The Source
• The API
• The Plugin Patterns

Important jQuery Plugins

nanoscroller

nanoScroller.js is a jQuery plugin that offers a simplistic way of implementing Lion-styled scrollbars for your website.

Ketchup

Ketchup is a small (3.4KB minified & gzipped) jQuery Plugin that helps you to validate your forms.

timing

jquery-timing provides easy-to-use methods to define iterations, timeouts, intervals, and event-based loops just in line with all your jQuery stuff.

Micro.js

Tiny libs for specific use cases if you want to mainly use vanilla JS.

Rainbow.js

Rainbow is a code syntax highlighting library written in Javascript.

Require.js

RequireJS is a JavaScript file and module loader. It is optimized for in-browser use, but it can be used in other JavaScript environments, like Rhino and Node. Using a modular script loader like RequireJS will improve the speed and quality of your code.

Moment.js

A lightweight (4.3k) javascript date library for parsing, manipulating, and formatting dates.

SuperScrollerama

The jQuery plugin for supercool scroll animation

ScrollPath

It's a plugin for defining custom scroll paths.

Galleria.io

Galleria is a JavaScript image gallery framework. The aim is to simplify the process of creating professional image galleries for the web and mobile devices.

Uri.js

URI.js is a javascript library for working with URLs. It offers a "jQuery-style" API (Fluent Interface, Method Chaining) to read and write all regular components and a number of convenience methods like .directory() and .authority().

Swipe js

Swipe is a lightweight mobile slider with 1:1 touch movement, resistant bounds, scroll prevention, and completely library agnostic.

spin.js

JavaScript spinner.

Mousetrap

A keyboard shortcut lib in JavaScript.

Hammer.js

A javascript library for multi-touch gestures

Backbone.js

Provides an MVC-ish structure for your JavaScript apps.

• The Fundamentals
• Unit Testing

Adding structure to a Backbone.js project

• Backbone.marionette
• Backbone Aura
• Chaplin
• Backbone Boilerplate from Bocoup

Ember.js

Ember is a JavaScript framework for creating ambitious web applications that eliminates boilerplate and provides a standard application architecture.

• Embler

Almond.js

Design Patterns

• Shichuan's collection
• Learning Design Patterns

Best Practices

• Use requestAnimationFrame instead of setTimeout to animate
  The polyfill for this can also be found in this Gist.

HTML

• HTML5 Boilerplate
  The ultimate set of best practices for your HTML5 project.
• SMACSS
  Scalable and Modular Architecture for CSS
• OOCSS
  Object Oriented CSS

CSS

• SASS (reference)
  My pre-processor of choice.

• COMPASS (reference)
  Most important SASS companion.

Prototyping

• Twitter Bootstrap

Simple and flexible HTML, CSS, and Javascript for popular user interface components and interactions.

• Foundation by Zurb

An easy to use, powerful, and flexible framework for building prototypes and production code on any kind of device.

Build Tools

• Grunt.js
  Becoming the ultimate build tool for front-end devs.

Other Tools

• jQuery plugins
• Mothereff.in
• Toolbox

HTML5 Presentation Tools

• Reveal.js
• HTML5 Slides