ModernJavascriptTalk.pdf

D12eaf3ef46e4f0fc6b714fd2b7ffe3b?s=47 derek-b
March 18, 2017

 ModernJavascriptTalk.pdf

JavaScript Talk for Midwest PHP.

D12eaf3ef46e4f0fc6b714fd2b7ffe3b?s=128

derek-b

March 18, 2017
Tweet

Transcript

  1. 2.

     Harassment includes offensive verbal comments related to gender, age,

    sexual orientation, disability, physical appearance, body size, race, religion, sexual images in public spaces, deliberate intimidation, stalking, following, harassing photography or recording, sustained disruption of talks or other events, inappropriate physical contact, and unwelcome sexual attention.  Participants asked to stop any harassing behavior are expected to comply immediately.  Sponsors are also subject to the anti-harassment policy. In particular, sponsors should not use sexualised images, activities, or other material. Booth staff (including volunteers) should not use sexualise clothing/uniforms/costumes, or otherwise create a sexualised environment.  If a participant engages in harassing behavior, the conference organisers may take any action they deem appropriate, including warning the offender or expulsion from the conference with no refund.  If you are being harassed, notice that someone else is being harassed, or have any other concerns, please contact a member of conference staff immediately. Conference staff can be identified as they’ll be wearing branded t-shirts.  Conference staff will be happy to help participants contact hotel/venue security or local law enforcement, provide escorts, or otherwise assist those experiencing harassment to feel safe for the duration of the conference. We value your attendance.  We expect participants to follow these rules at conference and workshop venues and conference- related social events. @DerekB_WI
  2. 3.

    ABOUT ME Lead Developer at National Conference of Bar Examiners

    Father of three Home pizza chef @DerekB_WI
  3. 4.

    WHAT WILL WE LEARN Using Javascript for Quick Prototyping Ways

    to Incrementally Add Functionality to Existing Pages Object Oriented Design Testable and Modular Design @DerekB_WI
  4. 5.

     Early on we wanted to add functionality to our

    static pages  But browsers do not agree  Plugins for functionality, Flash, ActiveX  Big libraries start to evolve, Dojo, YUI @DerekB_WI
  5. 6.

     Selectors use same syntax as style sheets.  Allows

    for manipulation of DOM  Bind to events  Add-Ons for UI enhancements AJAX also takes center stage. @DerekB_WI
  6. 8.

     Using the built in capabilities of the browser. 

    Standard core of ECMAScript  Many online references @DerekB_WI
  7. 9.

    ALL ABOUT THE BROWSER  For this talk we are

    only concerned with the browser.  Complementing not replacing PHP  Lots of browser tools for developers  For this talk we are not looking at a single page app or server side JS @DerekB_WI
  8. 10.
  9. 11.

    CHROME DEV TOOLS  Ctrl + Shift + I opens

    browser console. @DerekB_WI
  10. 17.

     By default scope is global, var makes it local

     ECMAScript 6 introduces let for block level scoping.  Console lets you print lines – quick and easy debugging  Prototype based not class based – inheritance differences @DerekB_WI
  11. 25.

    BROWSER STORAGE  LocalStorage persists  SessionStorage tied to browser

    tab  Same origin policy for security, e.g. http://www.example.com @DerekB_WI
  12. 29.

     An alternative to Model View Controller  Well suited

    for browser based development  Model doesn’t interact directly with View @DerekB_WI
  13. 31.

     Examples using Knockout JS  Declarative data binding updates

    html in real time.  Works inside standard html tags  View object gets replaced by html parameters  Vue.js is an alternative @DerekB_WI
  14. 39.

    UNIT TESTING  By following separating concerns your code is

    now unit testable  Many tools out there but beyond the scope of this talk  http://qunitjs.com/ - from Jquery team  https://jasmine.github.io/ - Behavior driven testing @DerekB_WI
  15. 42.

     http://vanilla-js.com/  https://developer.mozilla.org/en-US/docs/Web/JavaScript  https://msdn.microsoft.com/en-us/library/d1et7k7c(v=vs.94).aspx  http://javascriptissexy.com/javascript-objects-in-detail/  http://www.codeproject.com/Articles/278901/MVVM-Pattern-Made-Simple

     https://www.sitepoint.com/javascript-testing-unit-functional-integration/  https://medium.com/javascript-scene/master-the-javascript-interview-what-s-the- difference-between-class-prototypal-inheritance-e4cd0a7562e9#.l5sawwwsh  Derek Binkley - @DerekB_WI – dbinkley@ncbex.org @DerekB_WI