Event4 better javascript

184 views
138 views

Published on

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
184
On SlideShare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
1
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Event4 better javascript

  1. 1. Write Better Javascript Event #4 Aymeric Gaurat Apelli Senior Developer
  2. 2. Who am I? Why a “Who am I?” • Aymeric Gaurat-Apelli • .NET developer/consultant since first beta • Worked in France, Australia (Readify) and Thailand • Web entrepreneur • Facebook games (1M users/day) • http://taskarmy.com • http://weekplan.net (knockout.js SPA) • Principal developer at Jetabroad (Thailand)
  3. 3. “Classes” Yes you can… kind of. Want inheritance? http://ejohn.org/blog/simple-javascript-inheritance/
  4. 4. Coding principles They apply to Javascript too! DRY Don’t repeat yourself KISS Simplicity (and avoiding complexity) should always be a key goal. YAGNI You aren’t going to need it.
  5. 5. Coding principles LAW OF DEMETER Code components should only communicate with their direct relations SRP A component of code (e.g. class or function) should perform a single well defined task. DEPENDENCY INJECTION Depend upon Abstractions. Do not depend upon Concretions.
  6. 6. How would you rewrite this code? Suggestion: http://jsfiddle.net/XejEY/1/
  7. 7. Javascript Frameworks More structure for your code Check out http://todomvc.com/
  8. 8. Templating engines Allow you to reuse snippets of HTML and to bind it to your data http://jsfiddle.net/aPv9H/1/ Choose a template engine Fast templating engine.
  9. 9. Scope There is no block level scope. A bit different from C# http://madebyknight.com/javascript-scope/ http://jsfiddle.net/Ukv2R/1/
  10. 10. Modules The solution to spaghetti code
  11. 11. Sample home grown module
  12. 12. AMD, the standard. Popular AMD module loader: requirejs
  13. 13. Dependencies versus events
  14. 14. Dependencies versus events After refactoring Router.js module
  15. 15. Unit testing http://qunitjs.com/intro/ http://pivotal.github.io/jasmine/
  16. 16. Random tips 1. Link to your javascript code at the end of your HTML document 2. Bundle and minify 3. Work with css classes instead of working with styling/animations Example
  17. 17. Resources to learn http://microjs.com/ Fantastic micro libraries to use and learn from http://dailyjs.com Blog about new stuff in the Javascript world http://terrariumjs.wiselabs.net http://github.com Search for javascript projects
  18. 18. Thank you

×