A day in the office of a js developer
-
Upload
kresimir-antolic -
Category
Technology
-
view
439 -
download
1
description
Transcript of A day in the office of a js developer
JS The new black
Kresimir AntolicJavaScript Team Dictator
A day in the officeOf a JavaScript developer
Environmenta place to lay my head
Desktop environment
Alternative Environments
Sofa
Bathtub
Editorthe right tool for the right job
Sublime Text
Alternative Editors● WebStorm● Atom● Brackets● Aptana (Eclipse)● Notepad++● VisualStudio
ShellBecause H4x0rz
Shells● ZSH
○ interactive shell!○ “oh my zsh” plugin pack
● xterm
● win command prompt○ oh well
DebuggingThe bread and butter
Chrome Developer Tools
Debug the web
Alternatives● Firefox Dev Tools + FireBug
● Opera DragonFly
● IE dev tools (I kid you not)
Mobile Debugging
● Chrome (4+, adb)
● iOS 6 - Safari dev tools
● external tools (weinre, jsconsole)..
LibrariesThe Helpers
jQuery/Zepto
Helpfull ● jQuery Ui - widgets● underscore - the JS batman utilty belt● modernizr - feaure detection● select2 - fancy select fields● Moment - date library● all the jQuery plugins
FrameworksThe Builders
Backbone/Angular
The others● KnockoutJs● EmberJs● CanJS● BatmanJs
Mobile
● jQuery mobile
● Sencha Touch
ModularizationBecause we don’t want a pile...
RequireJS
Alternatives● almond
● Curl
● StealJS
CSS preprocessorsBecause we don’t like CSS
Say NO to CSS
SASS + Compass
Alternatives● Less
● Stylus
TemplatingBecause we love dresses
Handlebars
Others● Mustache
○ minimal; passive view● Jade
○ HAML-like; (to)rich● Underscore
○ minimal, but comes with underscore
FluffBecause we like it pretty
● Bootstrap
● Foundation, etc grids
● Topcoat
● Purecss
● Kendo UI
● jQueryUI
● YUI
Package ManagmentNever having to worry about where you put something
Bower
Alternatives● Jam
● Ender
● browserify
ScaffoldBecause we’re lazy
Yo (Yeoman) - Grunt and Yeoman included
Task RunnersBecause we’re really really lazy*
* practical
Grunt
Grunt - JS● code quality (JSLint / JSHint)● optimization
○ concatenation○ minifier○ uglifier ○ client side templating
Grunt - CSS● CSS preprocessors
○ Less
○ Sass (libSass)
○ Stylus
● CSS minifier
Everything!● testing
● deployment
● watchers
● cleaning windows
Honorable Mention
Gulp.js
HumansBecause humans!
A team
Here is a duck. Questions?