A presentation at Think Vitamin JavaScript Conference by Drew McLellan
DREW MCLELLAN
FRONT END DEVELOPER (SOMETIMES)
JQUERY
GOOD JAVASCRIPT DESIGN STARTS WITHOUT JAVASCRIPT
THE WEB WORKS IN LAYERS
1 HTML IMPLEMENTATION
2 STYLE WITH CSS
3 ENHANCE WITH JAVASCRIPT
4 CHECK YOU’VE NOT BROKEN ANYTHING
PROGRESSIVE ENHANCEMENT !== GRACEFUL DEGRADATION
BE THE BEST DEVELOPER YOU CAN BE
“WE REQUIRE JAVASCRIPT”
DESIGNING A FEATURE TO WORK WITHOUT JAVASCRIPT IS NOT EXTRA EFFORT
IT’S BASE EFFORT.
ADDING JAVASCRIPT IS THE EXTRA BIT
PRIORITISE BASIC FUNCTIONALITY
HIJACK!
SIMPLE, RIGHT?
A SIDE NOTE ON CSS...
PREVENT CSS FOR HIJACKED ELEMENTS MESSING WITH THE DEFAULT STATE
THUMBNAIL IMAGES
“ADD A FRIEND” LINK
BASIC AJAX FORM
DRAG’N’DROP REORDERING
MODAL DIALOGUES
CAROUSELS
MORE CAROUSELS
REMEMBER:
1 HTML IMPLEMENTATION
2 STYLE WITH CSS
3 ENHANCE WITH JAVASCRIPT
4 CHECK YOU’VE NOT BROKEN ANYTHING
