javascript sucks & frontend challenges @clearslide | while42 sf #7

64
while42 meetup

Upload: while42

Post on 24-Jan-2015

671 views

Category:

Technology


2 download

DESCRIPTION

Presentation by Kyle Powers(@mfkp)‎ & Tyler Davis(@TylerMDavis) for while42 SF #7 hosted by ClearSlide

TRANSCRIPT

Page 1: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7

while42 meetup

Page 2: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7

JavaScript Sucks

How we deal with it

Page 3: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7

About Me• Kyle Powers

Page 4: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7

About Me• Kyle Powers• Enterprise Cloud Meteorologist

Page 5: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7

About Me• Kyle Powers• Enterprise Cloud Meteorologist• Also work on javascript 99% of my time

Page 6: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7

About Me• Kyle Powers• Enterprise Cloud Meteorologist• Also work on javascript 99% of my time• I like Sublime Text

Page 7: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7

JavaScript Quiz

Based on Gary Bernhardt’s “Wat” talk

Page 8: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 9: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 10: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7

WAT

Page 11: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 12: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 13: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 14: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7

WAT

Page 15: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 16: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 17: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7

WAT

Page 18: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 19: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 20: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7

WAT

Page 21: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 22: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 23: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 24: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 25: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 26: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 27: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7

WAT

Page 28: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 29: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 30: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7

WAT

Page 31: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7

End Quiz• So how do we deal with this stuff?

Page 32: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7

How do we deal with this stuff• Education

Page 33: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7

How do we deal with this stuff• Education• Testing

Page 34: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7

How do we deal with this stuff• Education• Testing• Chrome developer console

Page 35: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7

Other bad things about JS• Leaving off the “var” keyword makes a

variable global.

Page 36: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7

How we solve it• When referencing a global variable “foo”, we

specify “window.foo” to make it clear that it’s global

Page 37: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7

Other bad things about JS• Callback hell

Page 38: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 39: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 40: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7

How we solve it• Refactor – name functions outside of the

scope• Keep functions shallow – usually no more than

2 levels deep• Use the module pattern

Page 41: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7

"Write small modules that each do one thing, and assemble them into other modules that do a bigger thing. You can't get into callback hell if you don't go there.”

-Isaac Schlueter

Page 42: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7

Other useful tools• type-check.js• http://gkz.github.io/type-check/

Page 43: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 44: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7

If all else fails, blame it on IE6

Page 45: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7

Thanks

p.s. we’re [email protected]

@mfkp

Page 46: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 47: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 48: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 49: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 50: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 51: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 52: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 53: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 54: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 55: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 56: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 57: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 58: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 59: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 60: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 61: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 62: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 63: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7
Page 64: Javascript sucks & frontend challenges @ClearSlide | while42 SF #7