I'm setting out to develop a JavaScript web application for visualization, featuring bookmarking of various graphs with annotations etc.
A typical example would be: Given a url state, show two SVG graphs and a time slider for manipulation together with some informative annotations placed out here and there.
Traditionally (and not having written JS for some time), I'd try some sort of modular JS approach:
src
data
chart
chartType1
chartType2
chartType3
layoutManager
stateManager
utils
lib
d3?
backbone?
jquery?
... breaking out the data handling, some utility functions, state & layout manager etc.
But with a plethora of libraries out there, perhaps I should hold my horses and try a new approach?
Code organization?
- Like above or more MVC like?
- Any specific patterns that would be helpful?
(pseudocode is much appreciated)
State handling/Models?
- Backbone.js
- JavaScriptMVC
Views?
- Are there any good examples of JS vis applications using SVG libraries (D3, Raphaël etc.) together with an mvc framework?
Compiler/minifier?
- Google Closure Compiler
- Jammit
IDE?
- Aptana Studio 3
- Netbeans
- Other?
Desktop version? (criteria: data storage, updatable etc.)
- AIR
- Chromium Embedded
- XULrunner
- Titanium appcelerator
- other options?
I'm sorry that the scope of this question is rather wide, but I shall consider it answered if insight into any of these domains is gained. So please help me choose ...
Backbone. js is a model view controller (MVC) Web application framework that provides structure to JavaScript-heavy applications. This is done by supplying models with custom events and key-value binding, views using declarative event handling and collections with a rich application programming interface (API).
Backend Synchronization BackboneJS is use with the front-end and back-end systems, allows the synchronization with the backend to provide support to RESTful APIs.
BackboneJS allows developing of applications and the frontend in a much easier way by using JavaScript functions. BackboneJS provides various building blocks such as models, views, events, routers and collections for assembling the client side web applications.
If you already know MVC really well, you could do great with Backbone. There were just so many unknowns with how to organize frontend javascript, we went with JavascriptMVC, which makes a lot of the decisions for you.
Not sure why I would use an IDE.. TextMate & console work great for me. NetBeans looked good when I was playing with it. JetBrains RubyMine is the highest quality and by far the best IDE, but it is commercial.
EDIT Yes, JMVC is not worth the trouble for what it provides. Backbone is elegant and simple. The only issue is if you are fairly new to code structuring, since you must define the structure of your code. If you are using rails, just copy the organization of your rails app: routers/ views/ templates/ models/
And a separate file for each class, of course. Then use something to require everything, Sprockets if you're on Rails 3.1 or really like it, or Jammit if you're on 3.0.x.
If you use coffeescript, just realize that your code is probably wrapped in a top-level closure, so if you'll either have to add your classes into a top-level hash, or declare them as window.Classname.
(Actually, "this" is "window" at the top level, so you can declare it as: class @Classname )
Good luck!
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With