Marionette: Building your first app

Building your first web app in Marionette

Transcript

1. Marionette Building your first app
2. Building your first app Cover core Marionette concepts Routing Layouts Event handling Rendering data
3. Who am I? Lead developer Pebble Income Generation for Schools Python/Django Web apps
4. JavaScript Framework Generate HTML Server integration Respond to user input
5. Why Marionette? Backbone.js No magic … ok maybe a little Active development Helpful, friendly community
6. Microblog Simple list of tweet-like objects Click on an item to view connected comments Won’t look pretty Focus on the HTML we need
7. Marionette - Application Links your page to your app Starts your JavaScript app Initialise your routes and layouts Feed data into your app
8. Marionette - AppRouter Map URL fragments to methods Wire up your controller
9. Marionette - Controller Decide what screens to show Handle top-level data flow
10. Marionette - Views Renders data Event handling User Input Data change
11. Backbone - Models Your data Binds your application to server Fetch Save
12. Backbone - Collections Like models but lists Optional type-checking Helpers
13. Marionette - Event/Trigger Handle user input Propagate view hierarchy React to model changes
14. And more Behaviors - common view behavior Radio - global events Template engines Regions Underscore
15. Helpful Links gitter.im/marionettejs/backbone.marionette backbonejs.org underscorejs.org marionettejs.com/docs/current YouTube - Dancing with Marionette
16. Questions? https://www.mypebble.co.uk scott.walton@mypebble.co.uk @scott_walton github.com/scott-w www.scottwalton.codes