Marionettejs.com as page of text from a book

marionettejs.txt

   Marionette (BUTTON) Toggle menu
     * Docs·
     * Annotated Source·
     * Support·
     * Blog·
     * GitHub @marionettejs

   Marionette logo
   Marionette.js

The Backbone Framework

   Marionette simplifies your Backbone application code with robust views and architecture solutions.
   Download v2.3.2View Docs

Layouts

   Organize your app in terms of small Views. Marionette makes it easy to compose rich layouts out of small components

Lists

   Show a sorted filtered list without breaking a sweat. Have a massive collection? Want to add or remove an item? No worries!

Utilities

   Learn to love the details. We've added tons of features from templateHelpers, to a declarative UI hash, that will keep you from ever
   wanting to go back.

Behaviors

   Share complex UI interactions across views. Behaviors are like mixins, without all of the pain associated with property collision.

Radio

   Decoupled communication between your application components with a powerful messaging system

Objects

   Write classes with the same API as your views. Marionette Objects support features like extend, events, initialize, and more.

Approachable

   Confused about how something works? Read the annotated source code. Think of Marionette as the code you would have written if you had
   the time and a thousand sets of eyes.

Community

   Marionette community is home to the most welcoming and vibrant discussions in the Backbone ecosystem.

Iterative

   Have a large unruly code base that you can not simply rewrite? Marionette can be added in pieces.

Flexible

   Stop spending more time thinking about your framework than your app. Marionette will never get in the way of you and your code.

Marionette Inspector - Chrome Extension

     * Marionette Inspector
       A world-class inspector for exploring your application's views, models, events and more. You won't know how you got by without
       it.
       Install NowWatch Video

Code Samples

Define view classes

var SingleLink = Marionette.ItemView.extend({
  tagName: "li",
  template: _.template("<a href='<%-path%>'><%-path%></a>")
});

var ListView = Marionette.CollectionView.extend({
  tagName: 'ul',
  childView: SingleLink
});

Pass in data

var list = new Backbone.Collection([
  {path: 'http://google.com'},
  {path: 'http://mojotech.com'},
]);

(new ListView({
  collection: list,
  el: '.link-area'
})).render();

Results

     * http://google.com
     * http://mojotech.com

Videos

   Marionette - The Backbone Framework

   Marionette 101

   Nesting Your Views in Marionette

   Marionette Behaviors

   Backbone.Wreqr

   Backbone Under the Magnifying Glass (Marionette Inspector)

   Using DevTools for Marionette Debugging

   Brian Mann talks about building applications with Marionette

   Unsuck Your Backbone

   From jQuery to Backbone/Marionette

Screencasts

     * Marionette Fundamentals by Pluralsight
       This paid course provides an in-depth look at Marionette with four hours of quality content. It is one of the more recently
       released screencasts.
     * BackboneRails
       Brian Mann has produced a comprehensive set of screencasts that cover just about everything you need to know to build large-scale
       Backbone applications on top of Ruby on Rails using CoffeeScript. Even if you are not using Ruby on Rails or CoffeeScript, the
       concepts are still helpful.Some syntax might be outdated, so be sure to check against the docs.
     * Tuts+ Introduction to Marionette
       Tuts+ Premium has a good paid series on “Advanced Backbone Patterns and Techniques“ with a free 10-minute episode that introduces
       Marionette. This episode focuses on bringing the most value to your Backbone app, quickly, by looking at the various views that
       Marionette provides along with regions to display the views in the DOM. It'll give you an idea of what Marionette can do for your
       app without getting too in-depth.Some syntax might be outdated, so be sure to check against the docs.

Books

     *

Better Backbone Applications with MarionetteJS
       Backbone.js is a growing, popular library for building JavaScript-based web applications in a well-structured, organized and
       maintainable way, using patterns similar to MVC. If you already have a working knowledge of Backbone, it's now time to take your
       applications to the next level with MarionetteJS. The Backbone extension builds on top of Backbone's event-driven architecture
       and adds a myriad of tools for building larger, more complex applications.
       Better Backbone Applications with MarionetteJS
     *

Backbone.Marionette.js: A Gentle Introduction
       Be more productive with Backbone.js: Marionette handles the boilerplate code, letting you focus on your application's specifics.
       Develop a complete Marionette.js app with this book, and you'll be comfortable with the library (whether you're new to web apps,
       or looking to quickly master yet another framework).
       Backbone.Marionette.js: A Gentle Introduction
     *

Structuring Backbone Code with RequireJS and Marionette Modules
       Learn to use javascript AMD in your apps the easy way
       Structuring Backbone Code with RequireJS and Marionette Modules
     *

Backbone.Marionette.js: A Serious Progression
       Bring your applications to the next level, using these handy solutions to common application development challenges.
       Backbone.Marionette.js: A Serious Progression
     *

Getting Started with Backbone Marionette
       If you know JavaScript and a little Backbone.js, this book is just what you need to move your speed and efficiency up a gear.
       It's a complete and practical guide to the composite application library Backbone Marionette.
       Getting Started with Backbone Marionette
     *

Marionette Exposé
       Learn to write modular Javascript applicatons using Backbone Marionette and RequireJS/AMD. Create a responsive browser based
       application. Decouple modules with advanced design patterns to create a fast, responsive user experience. Featuring Backbone,
       Marionette, RequireJS and CoffeeScript.
       Marionette Exposé
     *

Building Backbone Plugins
       Eliminate The Boilerplate In Backbone.js Apps. From the creator of MarionetteJS - the premiere application framework for
       Backbone.js - comes a book that will show you how to Eliminate the boilerplate code that plagues your Backbone apps by building
       the add-ons and abstractions that your app needs.
       Building Backbone Plugins

     * Chat with us
     * Follow us
     * 5700 stargazers

Contribute

   Marionette greatly appreciates the community! We welcome your support and contributions. Please visit the GitHub repo to report bugs,
   suggest your ideas, help other users out, and even contribute code.
   GitHub Issues

   Marionette sticker Marionette sticker on a MacBook laptop

Stickers!

   Everyone on the Marionette team works for free. Show your support by getting some stickers. Not only will your laptop look cool, your
   contributions will help further the development of this open source project!
   Show Support

Companies Using Marionette

     * about.me
     * Bleacher Report
     * Bocoup
     * CloudFlare
     * Disqus
     * Etsy
     * Eventbrite
     * Fast Company
     * Gawker Media Group
     * Moz
     * StubHub
     * Weebly

   more

     * Advanseez
     * Airbrake
     * Ajency.in
     * AppSaloon
     * Betterment
     * CANDDi
     * Carrot
     * Crashlytics
     * Crowdtwist
     * cynergy
     * D·Labs
     * EDpuzzle
     * Fortune
     * Found
     * GoMoob
     * Growth Republic
     * Hail
     * Help Scout
     * Hook & Loop
     * Hudl
     * Inside
     * Inspectall
     * LearnVest
     * MadGlory
     * Merchbro
     * MiMedia
     * MojoTech
     * MrBooker
     * myEdu
     * Pebble
     * Pendo Rent
     * Pixlee
     * Plex
     * popcorntime
     * Railslove
     * Raven HQt
     * RayGun
     * Red Bull Music Academy Radio
     * Revvy
     * Roastlog
     * Rollout
     * BeSnappy
     * Soomla
     * TipTap
     * Xing
     * zweitag

   Made with ♥ by all of us

   Insights by Hotjar
   Top