D3.js Is Way More Than Just Another Visualization Framework If you're an experienced web developer, you probably (a) are intimately familiar with the DOM, and (b) still find data-driven JavaScript apps a little unusual. You may know about how Backbone.js has brought MVC architecture to the web -- and if you like data-driven programming, but aren't already using Backbone, you really need to check it out. (And if you're thinking about Backbone but can't quite dive fully into its particular brand of JavaScript MVC: DZone is hoping to publish a Backbone Refcard some time soon, so stay tuned!) But even if you already develop web apps that handle lots of data, you may still think of complex visualization as a thin skin on top of the DOM. Well, not so thin with Mike Bostock's D3.js in town. ('D3' = 'Data-Driven Documents'.) In the abstract, D3's idea is simple: D3 allows you to bind arbitrary data to a Document Object Model (DOM), and then apply data-driven transformations to the document. Tons of fun, and potentially extremely useful tool.
Backbone.js Underscore.js Adventures in Mockjax | Ja.mesBrown JavaScript and Web Development If you are developing web applications that utilize Ajax (and most do today) and are using jQuery and/or Backbone.js, you should be building with mock Ajax JSON responses. You can view the code on Github: or the examples: Servers are slow / Rapid Iteration When developing against a local server, the ajax response will typically 100-300 milliseconds, but could even be longer. Endpoints Unavailable or Developing on an Airplane There are a number of reasons that an API endpoint could be unavailable and inevitably, it will be when you want to work on your application. Undeveloped Endpoints If you are working in a team, or even on your own project, and the server-side code isn’t completed yet, Ajax mocking would allow you to complete the front-end code before the back-end is complete. Unit Testing After rapid iteration, unit testing is probably the number one reason for mocking. Slow or Unavailable Server Simulation
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. 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. The Sample Application To give this combination a try, I put together a new sample application that uses Backbone.js to organize the code, and Twitter Bootstrap to organize the UI. You can run the application here. Backbone Directory is a single page application: index.html is essentially empty. Twitter Bootstrap highlights Backbone.js highlights One-to-Many association. Source Code
JavaScript Architecture: Backbone.js Routers Updated Aug 11, 2012 to reflect current library versions. In JavaScript Architecture: Backbone.js Views we discussed how to build dynamic apps that change views on the fly using JavaScript. Because view-switching is done without reloading the page or transferring control to a separate page, these are called single-page applications. Single-page applications pose a few issues we need to address: When users hit their browser’s back button, they will be taken away from the app completely rather than back to a previous view within the app itself.Users are only able to link to or bookmark the app itself–not a specific view within the app.Deep views within the app may not be crawlable by search engines. We want a great experience for our users. Like the topics we’ve addressed before, these issues aren’t specific to Backbone. Examples This concept is most easily taught by example so let’s assume we’re building an app that sells shirts. This time we set up our route with three parameter parts.
shawnbot/aight Zombies! RUN! (Managing Page Transitions In Backbone Apps) One of the common issues or questions I see for Backbone.js goes something like this: “Whenever I hit the same route more than once, I end up getting seeing this call being made multiple times. It seems to accumulate another call every time I hit the route. What’s going on?” or “I’ve noticed that my views are still handling events after I remove them from the screen. “How do I make sure I clean things up when moving to a new page in my app?” At the heart of all of these questions is a problem that most backbone developers will run into at some point: zombies. The Plague: Event Binding The majority of the problems that people are referring to in these questions and issues are caused by the events that we bind to in our apps. We bind events to our DOM elements using the declarative `events` configuration in our views: We bind events from our models and collections so that our views can respond to changes and re-render themselves: Events are everywhere, and with good reason. Rule #2: Double Tap
db4o: Simple POJO Persistence We Recommend These Resources Ranging from mobile to web applications, and from plain old Java to Scala or Groovy dialects, a modern Java developer always needs an ace in the hole when it comes to dealing with data persistence. Ideally, you're looking for a solution that gives you enough power to handle your domain complexity while being simple enough to boost your productivity by avoiding painful configurations or steep learning curves. On one side of this scenario you have relational databases with ORM tools which force you to go through several steps like the creation of an object mapping file, a database configuration file, a helper class to initialize a session factory and class association mappings (i.e. precious time spent on downloading, installing, configuring, and then writing a lot of XML). So, what if you could have the power of an ACID database with the simplicity of use of object serialization? Using db4o in the Griffon framework 1.class Person { 2. int id 3. 4. 02. def model 1.
addyosmani/backbone-fundamentals Buildpacks: Heroku for Everything Last summer, Heroku became a polyglot platform, with official support for Ruby, Node.js, Clojure, Java, Python, and Scala. Building a platform that works equally well for such a wide variety of programming languages was a unique technical design challenge. We knew from the outset that maintaining siloed, language-specific products – a Heroku for Ruby, a Heroku for Node.js, a Heroku for Clojure, and so on – wouldn't be scalable over the long-term. Instead, we created Cedar: a single, general-purpose stack with no native support for any language. An Example: Ruby on Rails If you've deployed any app to the Cedar stack, then you've already used at least one buildpack, since the buildpack is what executes during git push heroku master. $ git push heroku master Counting objects: 67, done. Everything that happens between Heroku receiving push and Compiled slug size is 9.6MB is part of the buildpack. Using a Custom Buildpack Arbitrary Language Support Customizing the Build Process Conclusion
Backbone Fundamentals – A Free Work-In-Progress Book For Developers Of All Levels About a week ago, I began working on a new article about Backbone.js. It was due to cover some concepts and insights intermediate or advanced users might appreciate, but I found myself wanting to reference topics beginners might need to know if they wanted to get the most out it. Quite a few of them. In the end, I decided it might make more sense to just write a book on Backbone instead. If you'd like to check it out, you can find the work-in-progress book on GitHub :) Why write a book? Now, there's a plethora of (great) posts about Backbone out there I could have just linked to – many of which are well written and respected, but I began to think about my own journey of learning how to use the framework. Beginners articles about Backbone typically don't mention intermediate or advanced concepts by their very nature. Backbone Fundamentals Backbone Fundamentals hopes to change that. Interested in helping out? Contributing Please tell me if I'm wrong about something. What's next? Thanks!.