Landscape & Language
in the
World of JavaScript
JavaScript
- Written by Brendan Eich in 10 Days
- Mocha
(not to be confused with the Mocha Test Framework) - LiveScript
- VBScript
- JScript
Notes:
- https://en.wikipedia.org/wiki/Brendan_Eich
- https://en.wikipedia.org/wiki/JavaScript#History
ECMAScript
- Standardized by Ecma International
(previously the European Computer Manufacturers Association) - TC39 - The ECMAScript specification committee
- ECMAScript 3
- ECMAScript 4 –– never standardized
- ECMAScript 5 == "Harmony"
- ECMAScript 6 == ES 2015
- ECMAScript 7 == ES 2016 == ECMA-262
Notes:
- https://en.wikipedia.org/wiki/Ecma_International
- https://en.wikipedia.org/wiki/JavaScript
- https://developer.mozilla.org/en-US/docs/Web/JavaScript/New_in_JavaScript/ECMAScript_6_support_in_Mozilla
- https://medium.com/@jayphelps/please-stop-referring-to-proposed-javascript-features-as-es7-cad29f9dcc4b#.93d42og53
Transpilers
Notes:
- https://scotch.io/tutorials/javascript-transpilers-what-they-are-why-we-need-them
- http://thenewstack.io/javascript-transpilers-need-know/
Which Version to Use?
- It depends on many factors,
namely where your JS lives ...
Notes:
Front-End
- aka Client-Side / Browser
- DOM - Document Object Model
- jQuery versus ECMAScript
- ECMAScript versions:
- MDN Documentation's
Specifications & Browser Compatibility (e.g.) - http://kangax.github.io/compat-table/es6/
- MDN Documentation's
Notes:
- https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model
- https://gist.github.com/liamcurry/2597326
- https://plainjs.com/
- http://modernweb.com/2014/05/05/replacing-jquery-with-vanilla-javascript/
- http://vanilla-js.com/
- MDN - Mozilla Developer Network - https://developer.mozilla.org/en-US/
DETOUR: JS Engines
- V8 - Chrome and node
- SpiderMonkey - Firefox
- Chakra - Microsoft IE & Edge
- JavaScriptCore - Safari
- Carakan - Opera
Notes:
DETOUR: Responsive Design
Notes:
Back-End
- Server-Side
- node.js (io.js)
- ECMAScript versions:
- http://node.green/ (compatibility)
Notes:
Synchronicity
- Synchronous == Blocking
-
Asynchronous == non-blocking
- AJAX
- Promises
Notes:
- http://stackoverflow.com/questions/16336367/what-is-the-difference-between-synchronous-and-asynchronous-programming-in-node
- AJAX - Asynchronous JavaScript and XML
Programming Paradigms & Data Mutability
- Programming Paradigms:
- Procedural / Imperative
- Object-oriented
- Functional
- Data Mutability:
- Mutable
- Immutable
Notes:
- http://funkyjavascript.com/procedural-vs-object-oriented-vs-functional-programming/
- https://en.wikipedia.org/wiki/Procedural_programming
Modules & Libraries
- DRY - "Don't Repeat Yourself"
- Sharing code between neighbors
- npm
- How?
- <script> tags
- CommonJS
- AMD (Asynchronous Module Definition) - RequireJS
- ES6 Modules
Notes:
- A module or library is "a chunk of self-contained code that we can use and re-use in our own projects" - https://www.infoq.com/articles/state-of-javascript-2016
- https://medium.freecodecamp.com/javascript-modules-a-beginner-s-guide-783f7d7a5fcc
Testing
- TDD - Test Driven Development
- Test Tools:
- Selenium - webdriver
- Mocha / Jasmine - testing frameworks
- Chai - assertion library
- Karma - test runner
- PhantomJS - scriptable headless webkit
- Nightwatch - end-to-end testing framework
- Travis / Jenkins - continuous integration tools
- Sauce Labs / BrowserStack - cross-browser testing (VM farms)
Notes:
- https://metasean.github.io/blog/2016/04/07/T-D-D-for-J-S-Learners.html
Build Tools
- Automating our work
- Build Tools:
- Related concepts:
- hot reloading
- sourcemaps
Notes:
Frameworks vs Libraries
- Opinionated scaffolding & standardization
- Frameworks:
- Angular 1.x / 2.x
- Ember.js
- Meteor
- Libraries:
- React
- Backbone
- jQuery
- Underscore / Lodash
Notes:
Databases
Notes:
