Skip to content

RatPack.js is a web framework built on Sammy and LAB.js

License

Notifications You must be signed in to change notification settings

auser/ratpack.js

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

14 Commits
 
 
 
 
 
 
 
 

Repository files navigation

RatPack.js

What is RatPack.js?

RatPack is a Rails-like MVC framework built on top of Sammy.js and LAB.js.

If you want to build a fast client-side javascript app that lets you easily separate functionality across files, RatPack is for you.

Quickstart

git clone git://github.com/dguttman/ratpack.js.git
cd ratpack.js/lib
python -m SimpleHTTPServer

Now that RatPack is up and running make it fit your needs.

  • By default your root path ("#/") will redirect to the "index" action of the "main" controller ("#/main"). Change this in "/js/controllers/application_controller.js". This is also where you change your default selector:

      //
      // "/js/controllers/application_controller.js"
      //
    
      var application_controller = function(app) {
        
        // change your default selector here:
        this.element_selector = '#main';    
    
        this.get("#/", function(context) {
          // this defines your root action, 
          // by default we will just redirect
          this.redirect("#/main");
        });
    
      };
    
  • You can edit the logic in "/js/controllers/main_controller.js" and the template in "/js/views/main/index.haml".

  • Add more actions to the "main" controller by editing "/js/controllers/main_controller.js" and adding corresponding template files to "/js/views/main/"

      //
      // "/js/controllers/main_controller.js"
      //
    
      var main_controller = function(app) {
    
        this.get("#/main", function(context) {
          // index logic here...
        });
    
        // Define a new action like so...
        this.get("#/main/my_new_awesome_action", function(context) {
          this.variable_for_action = "awesome_string";
        });
      };
    

      //
      // "/js/views/main/my_new_awesome_action.haml"
      //
    
      %h1
        This is a really awesome new action
    
      %p
        And this is the haml template for it...
        
      %p
        Let's link back to 
        = link_to("the index", "#/main")
    
  • Or, add more controllers by creating new controller files in "/js/controllers/" and listing them in "/js/app.js"

      //
      // "/js/controllers/new_awesome_controller.js"
      //
      
      var new_awesome_controller = function(app) {
        
        this.get("#/new_awesome_controller", function(context) {
          // this is logic for the index action...
        });
        
        this.get("#/new_awesome_controller/another_action", function(context) {
          // another action here...
        });
        
      };
    

      //
      // "/js/app.js"
      //
      
      (function($) {
    
        $(function() {
          var opts = {
            plugins: ["Haml", "JSON"],
            
            // now we add the new controller...
            controllers: ["application", "main", "new_awesome_controller"]
          };
          
          RatPack(opts).run();
        });
    
      })(jQuery);
    

Credits

Sammy.js - Aaron Quint and the Sammy.js team

Lab.js - Kyle Simpson

Special Thanks

Ari Lerner and Beehive - the birthplace of RatPack

About

RatPack.js is a web framework built on Sammy and LAB.js

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published