Pages

Introduction To Yahoo Mojito and Its Client and Server Seamlessness [screencast]

Hi There,


Mojito is a model-view-controller (MVC) application framework built on YUI 3 and its open source. Most notable feature of mojito is its capability to give you seamless MVC framework to manage your code on server as well as on client. Applications built on Mojito consists of  small components called Mojits which are independent UI element which can have their own Model,View, Controller and Binders.

Mojito features:
  1. Local Command Line development Tools.
  2. Library for simplifying internationalization & localization.
  3. Integrated unit testing.
  4. Device Specific Presentation.
  5. Single MVC to manage Client and Server code seamlessly.   
Here is screen cast to show you some awesomeness of Yahoo Mojito. Watch the Youtube video.

ScreenCast
How to setup this example
  1. Install Node
  2. Install Mojito

  3. npm install mojito -g

  4. Create App and Mojit

  5. $ mojito create app youtubesearch
    $ cd youtubesearch
    $ mojito create mojit containerMojit
    $ mojito create mojit searchResultMojit
    

  6. Modify application.json
  7. Modify routes.json
  8. Modify mojits MVCs. Get the full code here

  9. Get from github
    git clone https://github.com/markandey/mojito-example-youtube.git
    

HTMLFrameMojit is inbuilt mojit in the Mojito framework which creates basic html layout. In the example we have created a containerMojit, which is a composite mojit. Then In searchResultMojit we have created binder to handle click of search button. We are using mojitProxy to tunnel the request to mojit. We never bothered about the location of searchResultMojit and framework automatically tunnels the request to mojit either it is on server or it is on client. There is a way to lazyLoad a mojit.

I have used YQL to get youtube search result. To Read more about the YQL read here.


Where to Host Mojito Application
You can host mojito on any node.js server, Try Openshift, its free and easy to deploy.
You can also try http://www.nodejitsu.com/

3 comments:

  1. Mojito is a great framework! Cocktail's also great.
    I had a chance to get to know them last month :)
    DN - thinphp.com

    ReplyDelete
  2. Loved the way the change of affinity from server to common is made seamless. Mojito FTW!

    ReplyDelete
  3. II've been a few days playing with Mojito, and .. I'm fascinated by Mojito's way of doing. I've been following Meteor and Derby.js, but in the end Mojito has beend used in production, does have good documentation and there is under it a well known and proven YUI 3 lib that helps in case you adopt it!
    joan

    ReplyDelete

Your comment will inspire me, Please leave your comment