Tutorials/Guides/Articles/Etc | backbone.js

Facebook Twitter

Gaslight Software Blog, Backbone.js Views Done the Right Way. As soon as you build an interesting application in backbone, one of the challenges you are likely to encounter is wanting to have composite views, or views that are contained within a larger view.

Gaslight Software Blog, Backbone.js Views Done the Right Way

I’ve solved this problem several ways in different projects and I thought it would be fun to walk through the progression and how I’ve arrived at what I currently see as a preferred solution. Let’s start by talking about what might seem to be the most obvious solution and why it doesn’t actually work. 004 JSJ Backbone.js with Jeremy Ashkenas. Podcast: Play in new window | Download (Duration: 54:33 — 74.9MB) Panel Discussion IRC log of Jeremy and Yehuda’s chatIce libraryDocument CloudBackbone.jsCoffeeScriptDropshareclient-side MVCserver persistingjQueryIs backbone really MVC?

004 JSJ Backbone.js with Jeremy Ashkenas

Backbone CollectionsEmberConvention over ConfigurationHandlebarsjQuery is an opinionated libraryMustacheDOM only approachTemplates in other languagesBenefits of templates on the serverConsistency/bindingCore patternsjQuery deferredsWhen to add features to your libraryBackbone.ModelBindingBackbone.MarionetteRESTAdding onto BackboneAdding hooks. Sample App with Backbone.js and Twitter Bootstrap. Backbone.js is a lightweight JavaScript framework that provides the basic infrastructure (Model, Collection, View, and Router classes) to bring structure to your Web applications.

Sample App with Backbone.js and Twitter Bootstrap

Twitter Bootstrap is a UI toolkit that provides simple and flexible HTML, CSS, and Javascript to implement popular user interface components and interactions. In other words, Backbone.js and Twitter Bootstrap focus on different areas of your application: core architecture and user interface respectively. Because of their well-defined and non-overlapping scope, Backbone.js and Twitter Bootstrap work well together. In general, I find a lightweight architectural framework and a UI toolkit to be a powerful combination, and an interesting alternative to full-stack frameworks: it gives you the flexibility to choose the library you like (if any) in the respective areas of your application.

The Sample Application You can run the application here. Twitter Bootstrap highlights. Sample App with Backbone.js and Twitter Bootstrap.

Introduction to Backbone.js

Backbone: Dealing with stateful applications. Backbone.js by Example. Developing Backbone.js Applications - By Addy Osmani (@addyosmani) Available free for open-source reading below or for purchase via the O'Reilly store.

Developing Backbone.js Applications -

Pull requests and comments always welcome. Prelude Not so long ago, “data-rich web application” was an oxymoron. Today, these applications are everywhere and you need to know how to build them. Traditionally, web applications left the heavy-lifting of data to servers that pushed HTML to the browser in complete page loads. Think of the Ajax shopping cart which doesn’t require a refresh on the page when adding an item to your basket. The rise of arbitrary code on the client-side which can talk to the server however it sees fit has meant an increase in client-side complexity.

Thankfully, there are a growing number of JavaScript libraries that can help improve the structure and maintainability of your code, making it easier to build ambitious interfaces without a great deal of effort. Target Audience Acknowledgements Credits Target Version Reading What Is MVC? Testing Backbone.js Best Practices. Yes, LinkedIn is a very different social network with very different users and a very different purpose than the likes of Facebook, Twitter and Pinterest.

Testing Backbone.js Best Practices

But, that doesn’t mean it’s not a platform that’s always experimenting, evolving and changing like the others. In the past few months alone, LinkedIn has made alterations that you, especially if you’re B2B, must be aware of in case they affect current strategy or serve as inspiration for new LinkedIn tactics for your brand. Congratulations! You’re a Publisher! Did you ever see a post from one of those LinkedIn Influencers and think to yourself, “Hey, that should be me”? But just to give you an idea of how impressed people need to be with your content, the average Influencer post gets over 31,000 views, over 250 likes and around 80 comments. Hmm, That Didn’t Work, Part 1. BackboneFU, Resources for the Backbone.js developerBackboneFU, Resources for the Backbone.js developer. Before using backbone when working with a list of html nodes I always made it my duty to append them only in one big chunk of text.

BackboneFU, Resources for the Backbone.js developerBackboneFU, Resources for the Backbone.js developer

Manipulating the dom is slow, it triggers a reflow of the page, this is costly even on small lists, specially on mobile. So being not sure what to do with backbone I decided to append each view directly in my container like this. Of course this solution made me grind my teets, I did not want to append each view individually. document.createDocumentFragment() Fortunately, there is another solution than parsing the views as a string and then merging them together.

Backbone.js Training - A Multi-Day, Hands-On, Training Class. Notice Of Course Discontinuation Please note that as of January 2013 I am no longer offering my Backbone training class on a regular basis.

Backbone.js Training - A Multi-Day, Hands-On, Training Class

I have exited the consulting world in favor of a full time position working with Kendo UI as a Developer Advocate. While I will continue to be a part of the Backbone community with my new position, offering a private, on-site training class is not something I will be able to do right now. I may bring this back out at some point in the future, but I don't know when (if at all). Organizing Your Backbonejs Application With Modules. Backbone.js Tutorials. Thomasdavis/backbonetutorials - GitHub. Addyosmani/backbone-fundamentals - GitHub.