Cheatsheet for front-end development

Cheatsheet.md

jQuery

• each (index, Element) { this = Element }
• toggleClass (className , [switch])

Ajax:

• .done (data, textStatus, xhr)
• .fail (xhr, textStatus, errorThrown)
• .always ( either one of the above)

Selectors:

• starts ^=
• contains prefix (foo-) |=
• ne !=
• ends $=
• contains word ~=
• contains *=

Lo-Dash

• _.each (list, iterator(element, index, list), [context] )
• _.defer (f(args), [args])
• _.defaults (object, *defaults)

Haml-Coffee

• Multiline: |

• Element names: %

• Attributes: {} or ()

• Class and ID: . and #, implicit div elements

• Self-closing tags: /

• Doctype: !!!

• HTML comments: /, conditional comments: /[], Haml comments: -#

• Running CoffeeScript: -, inserting CoffeeScript: =

• CoffeeScript interpolation: #{}

• Whitespace preservation: ~

• Whitespace removal: > and <

• Escaping \

• Escaping HTML: &=, unescaping HTML: !=

• Filters: :plain, :javascript, :css, :cdata, :escaped, :preserve

• Boolean attributes conversion

• Haml object reference syntax: []

• _.each @items, (item) =>

• != _.templates'...'

Coffee

• for
  • for elmt in array
  • for elmt,i in array
  • for [own] key, val of object
• => (_bind)
• do -> IIFE
• obj?
  • x ?= 1
  • func = (x=1) ->
  • obj?.func?

CSS

• white-space: nowrap
• body {background:#ffffff url("img_tree.png") no-repeat right top;}

SUBLIME

• Expand selection:
  • Ctrl+Shift+A - to tag
  • Ctrl+Shift+J - to indentation
  • Ctrl+Shift+M - to brackets

ANGULAR

• $scope
  • emit: upwards
  • broadcast: downwards