[JS]#以降のURLによって処理を振り分けるjQueryベースのフレームワーク「Sammy.js」


20110427 01

Sammy.js」はURLによって処理を振り分ける事ができるJavaScriptの軽量フレームワークです。
#以降のアドレスを利用してURLルーティングを実装されており、
簡潔に記述することを目指したフレームワークとなっています。

IT/WEB業界への転職なら求人サイトGreen

RubyのSinatraというフレームワークにインスパイアされたみたいですね。

わずか16KBしかないのですが、外部ファイルの読み込みやリダイレクト処理などがサポートされており、手軽に使う事ができます。

使い方

jQueryを読み込んだ後に、sammy.jsを読み込みます。

<script src="jquery.js" type="text/javascript"></script>
  <script src="sammy.js" type="text/javascript"></script>

URLに対して実行するアクションを設定します。

JavaScript

(function($) {
//アクションの設定
var app = $.sammy(function() {
//TOPにアクセス
this.get('#/', function() {
$('#main').text('');
});
//TOP以外のアクションを追加していきます。
this.get('#/test', function() {
$('#main').text('Hello World');
});
});
$(function() {
app.run()
});
})(jQuery);

html

Hellow Worldを表示
TOPページ

jQueryがベースになっているので、既存のプラグインを使って処理を実装する事も簡単です。
ちょっとしたWEBアプリケーションを作る際に便利そうです。

※jQueryのバージョンは1.4.1以上が必要です。

Githubにはサンプルコードもアップされていますので、
興味のある方は下のリンクからどうぞ。

 

この記事が気に入ったら
いいね!しよう

最新情報をお届けします

follow us in feedly