Save 37% off PRO during our Black Friday Sale! »

What Zelda Taught Me about Front End Engineering

911466eedb687b909f7e66816223ceb2?s=47 Matt Steele
December 06, 2012

What Zelda Taught Me about Front End Engineering

Writing good JavaScript is hard. You're locked in a neverending battle against browser quirks and copy/pasted spaghetti code.

Know what else is hard? The Legend of Zelda.

The similarities run deeper than you'd think.



Matt Steele

December 06, 2012


  1. Treating JavaScript Like a Real Language Or: What Zelda taught

    me about Front End Engineering
  2. Matt Steele •@mattdsteele •

  3. JavaScript is Fraught With Peril

  4. Anti-Patterns Everywhere

  5. None
  6. The browser is the most hostile software engineering environment imaginable.

    - Douglas Crockford
  7. None
  8. Its famous difficulty demanded so much, not just from my

    hands but from my entire ragged nervous system, even from my temper, my character. It never explained itself and so conjured, via ingenious online components, a community as helpful and treacherous as any group of humans. Tevis Thompson
  9. None
  10. None
  11. None
  12. To win at JavaScript, we have to treat it like

    a real language.
  13. Learn the language Use appropriate tooling Unit test Use build

  14. None
  15. Learn the Language

  16. “JavaScript is the only language that I’m aware of that

    people feel they don’t need to learn before they start using it.” Douglas Crockford
  17. None
  18. None
  19. js-assessment

  20. None
  21. Code Katas

  22. None
  23. Tools

  24. None
  25. As an engineer, there is a short list of tools

    that you must be rabid about. Rabid. Foaming at the mouth crazy. Rands the_foamy_rules_for_rabid_tools.html
  26. Learn your editor

  27. None
  28. Emmet (zen coding)

  29. Arguments over style are pointless. There should be a style

    guide, and you should follow it. Rebecca Murphy
  30. “use strict”;

  31. ;

  32. jsHint Your First Unit Test

  33. None

  35. Watch other people’s workflow

  36. None
  37. Testing

  38. None
  39. ⌘+R

  40. Lincoln

  41. Omaha

  42. Jasmine

  43. None
  44. None
  45. None
  46. Use a Build Tool

  47. •Run tests •Apply linting •Concatenate & Minify •Compile •Remove debugging

    statements •Precompile templates

  49. •CSS linting •Compress images •auto-watching •Create documentation •Download & maintain


  51. Continuous Integration

  52. None
  53. CoffeeScript