Presentation showed at utahJS

1. Corporate javascript
The good, the bad & the not so ugly

2. Who’s this dude?
Oscar Villarreal @climboid, oscarvillarreal.com
UI Engineer
Viva Mexico! home NYC
Rock climbing

3. So what’s the point?
What role does javascript play in large non tech
corporations, why it is in that state and how can we
improve it.
How are the latests and greatest js libraries/frameworks
applied in corporations.
What to expect when building a web app for a large
corporation, or how to get your foot in.

4. The bad

5. Approvals

6. IE is a must
Quantify it
Chrome frame

7. Javascript not enabled
Not
Not
needed
safe
Que pedo!?

8. No one knows anyone or
anything
To
To Big
Segmented
To Secret

9. Spaghetti code
Lack of interest
Juniors Laziness
Bad managers

10. The good
(at least in our case)

11. You set the standards

12. Solve real problems

13. Evangelizing ripples

14. Always make win - win
if you cant make sure the customer
wins

15. Moving the IE7 world

16. The not so ugly

17. Tight deadlines

18. Very few people know
what you do

19. Mangers

20. What its all about

21. Build for the future support
for the present

22. Other concerns

23. Hard to move out of the
stack

24. App should look/act the
same on all browsers
or TV Analogy - Nicholas Zakas

25. Expectations
Managers don’t know about development
yet they have to give the deadline

26. Getting the right
requirements
No Lack of
feedback understanding
from end of Problem
users
Programming anarchy

27. Explain it as if you want your
labrador to understand it
This will get you to negotiate with the customer

28. Code quality

29. Quality product vs time
Fulfill expectation
Think about performance,
Deliver on time cross browser, cross
Create code can evolve platform, reusability,
naturally with out rewrites documentation
Use latest and greatest Smile during the process
techniques/tools
Solution =>

30. Use the right tools
Window of oportunity
Anything that makes you go fast

31. Backbone jS
Non opinionated, leaves the path open
Super light
Super flexible
Has been around for a few years
Jeremy Ashkenas

32. EmberJS
Heavily opinionated
Complete solution
Heavier
Getting traction in the community
Yehuda Katz (sproutcore, rails)

33. Angular JS
Google
Seems like a mid point between backbone and ember
Similar to knockout js ( references to elements in
template )
Ability to create your own html mark up

34. Twitter Bootstrap
Up and running fast
Responsiveness
CSS Grid framework + common plugins + form
elements + everyone seems to use it.
Don’t just use it out of the box, be creative

35. Google Dev Tools
Born out of webkit (safari)
Evolved to become better
“Better” than Firebug (personal)
Real time editing of CSS/JS/HTML
Show how to quickly save CSS changes

36. Data visualization and JS

37. jQPlot
A bit static
Good for base charts
Canvas
Free

38. Highcharts
Licensed
Amazing Docs
SVG
IE6
Super fast
to get up and
running

39. Raphael
Layer on top of SVG
Works in IE6
gRaphael

40. D3
Built by Michale Bostock
Amazing drawing tool
( if not the best out there
for SVG )
No ie7
Free

41. threeJS
its 3d!
experimental
chrome
webGL

42. Best practices in large scale
JS apps
Deliver fast no matter what
Allows for a product to exist, get used, evolve as
business evolves
Start Small
Proof of concepts can and will get you far
Always quantify the solution, then go into the technical
side

43. Best practices in large scale
JS apps
Decoupled back and front end (web services, client side
templates)
JS is your glue
Allows for both back and front to evolve
independently
Open source is good as long as the team can fix it
Get through your window of opportunity no matter what

44. Measuring success in
corporate web apps

45. Take-aways
Corporations are starting to catch up
Use tools/libraries that bring structure to your code
Data visualizations that are easy to create
Push your self and your company forward

46. It can always be better.

47. FIN