Middle-Scale F2E Application

Ruby Salon in HangZhou

Transcript

1. Middle-Scale F2E Application
2. problems • Loader • NameSpace • Dependency • Component/widgets (HTML & Javascript & CSS) • Unit/Component Test (Fixture) • Build (Strategy) • UX (Speed & LiveReload & ...)
3. Ways to solve each problem •Loader LABjs headjs yepnopejs ( modernizr.load )
4. Ways to solve each problem •NameSpace http://addyosmani.com/blog/essential-js-namespacing/ •Single global variables •Object literal notation •Nested namespacing •Immediately-invoked Function Expressions (IIFE)s •Namespace injection https://github.com/jashkenas/coffee-script/wiki/FAQ#unsupported-features •CoffeeScript
5. •Component Ways to solve each problem component/component
6. •Dependency Ways to solve each problem requirejs (AMD) component/component (CMD)
7. •Unit/Component Test Ways to solve each problem component/component
8. •Build Ways to solve each problem r.js (require.js) builder ( component/component ) sprockets
9. •LiveReload Ways to solve each problem LiveReload 2
10. Crossroad •Chef of Puppet •github or gitlab ? •AMD or CMD or UMD ?
11. Crossroad • It doesn't matter.
12. Diglett • Demo time!
13. Framework based on Component • HTML5 Web Component • AuraJS • Component • Twitter flight • MontageJS • And more...
14. Thanks