Is There a JavaScript MVC (Micro-)Framework

Using MVC to implement a framework in JavaScript

Google lists numerous examples.

1. Official Website of Javascript MVC
   
   
   • Demo Video
2. A List Apart - Jonathan Snook on Javascript MVC
3. CodeCube.net - MVC Pattern with Javascript
4. StackOverflow - Is there a Javascript MVC (micro-)framework?

Advice on creating a micro-framework in JavaScript

For an MVC framework, the basic concepts go something like this (forgive the simplicity):

var view = 'I say, "{{first}} {{second}}".';
var model = {
    first: 'hello',
    second: function(){
        return 'world';
    }   
};

for(item in model){     
    var regex = new RegExp('{{' + item + '}}', 'gi');
    if(typeof(item) == 'function')
        view = view.replace(regex, model[item]());
    else
        view = view.replace(regex, model[item]);
}
console.log(view);

Start as simple as possible and add small enhancements:

• Store views/templates as files. This gives you a chance to play with node.js's async file I/O.
• Add support for more complex models - repeating items/arrays, objects containing objects
• Add support for templates inside templates
• Fetch your models from an external datasource. CouchDB might be fun.
• Add proper controllers - these objects should know which models go with which views and how to stitch them together
• Map your Http request urls to controllers and actions - /person/55 might fetch a person with id 55 from your data repository, /person/add might bring up a UI to add a person - both use a person controller with views displayed for the appropriate action.

Take a look at mustache.js for a small template engine. Note their terminology differs from mine in examples and code. What I call a view, they call a template and what I call a model, they call a view. It's a small thing but potentially confusing.

Additional resources:

• A giant list of node modules. Includes templates, database, routing, and full frameworks.
• MVC with Node.js - Which modules?
• Root.js : A Skeletal MVC Framework for Node.js

What would you suggest for a Javascript MVC framework?

A lot depends on what you are building and your skill sets. I'm a JavaScriptMVC contributor, so I'm pretty biased, but I will try to give as far of an answer as possible.

SproutCore is what I consider more of a 'top-down' framework. They've built a lot of the chrome / UI widgets for you. So, your time is spent customizing the widgets to meet your needs. If your needs can be readily met by sproutcore's widgets, I'd suggest using sproutcore.

JavaScriptMVC is a very different type of JavaScript framework. It has no UI widgets. Instead it focuses on the lower-level tools needed to organize and build JavaScript applications. It's basically a layer above jQuery, and packages things like:

• Compression / building
• Testing
• Documentation
• Error reporting
• Client side views (templates)
• Special events
• 'Missing' DOM functionality (like compare)
• Dependency management

It supports what we call "Middle-Out" development. It's controller is especially powerful at organizing a jQuery-like plugin. It will take care of event binding for you with a pretty awesome syntax while making the plugin extendable.

So, if you are building a lot of custom controls, and know jQuery, take JavaScriptMVC for a spin.

JavaScriptMVC actually came from Junction, but Junction isn't really under active development.

jQuery, Web Application Framework?

One of the (not so) many options is JavascriptMVC, which is pretty cool and I've used it for one midium-size project.

It's website is pretty discouraging, but give it a chance and watch the video. One possitive aspect is that it's creator always answers really fast in JMVC's google group.

But, actually, if I had to remake the project I mentioned, I would not use it, as jQuery provides (almost) all JMVC's functionality, you just have to get used to it. For an example in how to handle big apps with jQuery, I would recommend you to watch this video between others of Alex Sexton and other members of the yayQuery podcast.

Backbone.js - Other frameworks that provide Collections

Your question deserve a 4 pages answer....

to make it short:

1. have a look here for a plethora of others frameworks
   review. Also here is a good place to have a look
2. please
   specify some more of your rquirements (ok for handling of
   collections). For instance, backbone.js is great when used with
   restful DBs like couchdb (really, a 5 minutes work, I use it--)
3. some months ago, when I had to decide which framework to choose for
   my app, I was in your same situation. I had to choose among
   angularjs, knockout, and backbone.js The choice falled on
   backbone.js and I never regretted it.

hope this helps.
bye.

---

Related Topics