タグ

ブックマーク / dev.classmethod.jp (5)

  • Karma(元Testacular)を使って簡単にテストを実行しよう | DevelopersIO

    Karmaとは 昨年、Googleがnode.jsベースのJavaScriptテストランナー、「Testacular」をオープンソース化しました。 このツールは元々AngularJSのためのテストフレームワークとして作られたそうで、 クライアントサイドのJavascriptコードのテストを簡単に実行することができます。 このツール自体はテストランナーで、JasmineやMochaなどのテストフレームワークを使用してテストを行います。 先日このプロジェクトの名前が変更され、「Karma」という名前になりました。 今回はKarmaのインストールからテスト実行(+ Gruntでの実行)までをおこなってみます。 環境構築方法 今回使用した動作環境は以下のとおりです。 OS : MacOS X 10.7.4 Node.js : v0.10.0 npm : 1.2.14 Grunt : 0.4 npm

  • 【前編】Backbone.jsでつくるMVPなUIパターン【スクロールスパイ】 | DevelopersIO

    前回の更新からだいぶ間が開いてしまいましたがこのシリーズはまだ終わりません!今回はTwitter BootstrapにjQuery Pluginとして実装されているScrollSpyを真似して作ってみたいと思います。 ちょっと解説が長くなってしまったので前後編に分けてご紹介します。 後半はこちら >> Backbone.jsでつくるMVPなUIパターン【スクロールスパイ】後編 デザイン 4つの文章に対しそれぞれナビゲーションが存在し、文章のエリアをスクロールして閲覧している文章に対応するナビゲーションがアクティブ表示になるというものです。 このUIhtmlは以下のようにコーディングしました <div id="ui-scroll-spy"> <div class="scroll-spy-nav navbar"> <div class="navbar-inner"> <div class="

  • Backbone.jsでつくるMVPなUIパターン【リスト】 | DevelopersIO

    今回はBackbone.jsを使ってフォームから追加し、削除できるリストを作ってみたいと思います。デザインは前回同様Twitter Bootstrapで作成しました。 htmlはこちら! <div id="ui-list"> <div class="list-controls"> <form> <div class="input-append"> <input type="text" placeholder="Please type something" /> <input type="submit" class="btn" value="Add" /> </div> </form> </div> <div class="list-items"> <ul> <li class="list-item" data-cid="c1"> <a href="#" class="close">×</a

  • Twitter製フレームワーク「Flight」を試してみた! | DevelopersIO

    こんにちは。クラスメソッドの稲毛です。 前回のパッケージ管理ツール「Bower」インストールに続いて、いよいよ編となります「Flight」フレームワークです。 通常なら「Flightとは?」から始める所ですが、今回はどんどんサンプルを作っていくことで理解を深めてみました。 Flightのインストール まずはBowerを利用してFlightを構成するスクリプトファイルをインストールする必要がありますので、アプリケーションを作成する場所に下記の内容で「component.json」というファイルを用意します。 component.json { "name": "Flight Sample", "version": "1.0.0", "dependencies": { "flight": "~1.0.0" } } 用意できたらコマンドプロンプトを起動し、component.jsonがあるディレ

  • Sublime Text 2の基本とカスタマイズ【Vim風】

    2012年12月4日:Vim化について指摘と参考になる情報をいただいたので追記しました。 こんにちは、僕はVimユーザーです(ちなみにVimを完璧に使いこなしているわけではありません)。 今更ながら「Sublime Text 2」というナウでヤングなエディタも使いこなせるようになりたいと思い、Sublime Textの基設定からプラグインやスニペットの作り方まで調べた内容をこの記事にまとめることにしました。 細かい情報までまとめることはできなかったので、より詳しい内容を紹介してくださっているブログやサイトへのリンクを設けています。 この情報以外にもSublime Text 2をVimに近づけるプラグインやカスタマイズ方法があればコメントいただけるとうれしいです。 また、間違いがあればコメントいただければすぐに直します。よろしくお願いします! Sublime Text 2は有料($59)の

  • 1