Installing swank.js - Carpe diem (Felix's blog)
People say that emacs is the most extendable editor in the world; however, I didn’t really understand how powerful it is until one of it extension Swank.js blowed my mind. Take a look at this awesome screen cast produced by emacs rocks. Awesome, is it? However, installing swank.js is really nontrivial. As a result, I want to share my note on setting up swank.js on my machine. System information Ma
Chardin.js
Chardin.js - Simple and beautiful overlay instructions for your apps.
体感！JavaScriptで超速アプリケーション開発 －Meteor完全解説 記事一覧 | gihyo.jp
運営元のロゴ Copyright © 2007-2025 All Rights Reserved by Gijutsu-Hyoron Co., Ltd. ページ内容の全部あるいは一部を無断で利用することを禁止します。個別にライセンスが設定されている記事等はそのライセンスに従います。
第12回 ［最終回］Meteorが指し示すWebアプリ開発の未来 | gihyo.jp
さて、これまで10回以上に渡って続けさせていただいたこの「Meteor完全解説」ですが、今回が最終回となります。「完全解説」を銘打っておきながら、説明できていない機能を残していることが大変心苦しいのですが、どうかご容赦ください。 ただ前回までの連載により、Meteorのエッセンスとも言える部分についてはほとんど説明を終えたといっても良いかと思います。これまでの記事を振り返ってみても、やはりMeteorは非常に先進的なフレームワークです。Webアプリ開発にかつてないような生産性をもたらすだけでなく、「リアルタイムWeb」の時代をぐっと手元に引き寄せるような手応えを感じます。 今回は最終回ということで、Meteorのさまざまな機能を振り返りつつ、Meteorという先進的なフレームワークが指し示す、Webアプリケーションの未来を探ってみたいと思います。 Nodeを利用した「フルスタックフレー
マウスで握って並べ替える。 - ザリガニが見ていた...。
リストの順番を自由に並べ替えたい。こんな時、Railsにはヘルパメソッドsortable_elementがある。このメソッドを1行追加するだけで、マウス操作でドラッグして並べ替えが可能になる。但しいくつか注意することがある。それを知らないために、思うように動かず遠回りしてしまったので、忘れないように自分用のメモ。まずは以下のように使ってみた。 利用環境 MacBook Rails 1.1.6 scriptaculous-js-1.7.0 必要最小限の基本動作を確認 <%# view %> <%= javascript_include_tag :defaults %> <ul id='sort'> <li id='item_1'>item_1</li> <li id='item_2'>item_2</li> <li id='item_3'>item_3</li> </ul> <%= sort
[JS]自分仕様のかなりかっこいいローディング用アニメーションを生成できる -Sonic Creator
かっこいいデザインのローディング用アニメーションのCanvas版、アニメーションGIF版、CSSスプライトPNG版を同時に作成できるオンラインサービスを紹介します。 Sonic Creatorの前に、まずはSonicのデモから。 Sonic Sonicは、HTML5 Canvasを使ってローディング用のアニメーションを作成する超軽量（約3K）のスクリプトで、実装方法などは下記をご覧ください。 かなりかっこいいデザインのローディング用アニメーションを生成するスクリプト -Sonic 今回紹介するのは、このSonicをコードベースでオンラインで簡単に設計でき、それをアニメーションGIFやCSSスプライト用のPNG画像を生成するオンラインツールです。
Intro.js - Step-by-step guide and feature introduction for your website
No dependencies, fast and small 10KB JavaScript and 2.5KB CSS, that's all (minified, gzipped). User-friendly Navigate using keyboard or mouse. Easily change the themes for your website. Browser compatibility Works on Google Chrome, Mozilla Firefox, Opera, Safari and even Internet Explorer. Why using Intro.js? When new users visit your website or product you should demonstrate your product features
Web上でのプログラミングがさらに便利に。JavaScriptを使った開発補助·Tern MOONGIFT
Ternは入力補完や関数の引数表示と言った機能がついたJavaScript用プログラミング補助ライブラリです。 そろそろWebブラウザ上でコーディングを行える環境が整ってきたのではないでしょうか。プログラミングするためのエディタ環境として必要なのはハイライターなどの他にもたくさんあります。その幾つかを提供してくれるのがTernです。 入力補完。 文字を打つと絞り込まれていきます。 変数、クラスの定義を探します。 オブジェクトの種類を下に表示できます。 変数名を変更します。 名前空間に対応しているので余計なところは変更しません。 関数の引数を表示します。 デモ動画です。 Ternでは入力補完、変数やオブジェクトの定義元検索、関数の引数表示、変数名の一括変更と言った機能がサポートされています。いずれもローカルアプリケーションのプログラミングエディタには備わっている機能と言えるでしょう。しかしそ
Cerebris :: Beginning Ember.js on Rails: Part 1
git clone https://github.com/dgeb/ember_rest_example cd ember_rest_example bundle install bundle exec rake db:migrate rails s Point your browser to localhost:3000 to give this CRUD-dy app a try. Dependencies This example has just a few dependencies beyond the basic Rails 3.1 stack. The straightforward ember-rails gem pre-compiles handlebars templates in the asset pipeline. It also simplifies inclu
これからはじめるフロントエンドJavaScript
これからはじめるフロントエンドJavaScript：はじめまして。JavaScript（1）（1/2 ページ） はじめに 一昔前、リッチなWebサイト、Webサービス のUI構築は、Flashを代表格とするプラグインを利用したUIの構築が一般的でしたが、近年、Flashなどのプラグインを搭載しないモバイル端末の登場により、その情勢が変わってきました。 もともと、2000年代前半からJavaScriptによるリッチなUI構築に関しては注目されてきましたが、ブラウザが搭載するJavaScript実行エンジンのパフォーマンスや、体系的に構築するためのフレームワークがそろっていないこともあり、まだまだ普及するレベルではありませんでした。 2000年代後半から、prototype.jsを皮切りに、JavaScriptを実行する際に頭を悩ませてきたブラウザ間の仕様の違いを吸収してくれるようなライブラリ
ASCIIcasts - “Episode 263 - クライアント側での検証”
263: クライアント側での検証 (view original Railscast) Other translations: Other formats: Written by Naomi Fujimoto ウェブサイトの長い入力フォームを埋めて送信した後に検証エラーがいくつも返されてくるのはイライラするものです。フィールドに対するエラーをそのフィールドへの入力が終わる都度表示できれば、ずっと優れたユーザ体験を提供できるでしょう。しかしそのためには、JavaScriptでチェック用コードを大量に書く必要があります。 今回のエピソードでは、クライアント側の検証を自動的に設定してくれるgemを紹介します。たとえば、入力フィールドが4つある、次のような新規ユーザ用の登録フォームを持つアプリケーションがあるとしましょう。 Userモデルにはいくつかの検証機能があります。その内の一つが必須入力フ
Rails 4のturbolinksについて最低でも知っておきたい事
Rails 4のturbolinksについて最低でも知っておきたい事 （追記）turbolinksに関するセキュリティ上の懸念について turbolinksとは、ページ遷移をAjaxに置き換え、JavaScriptやCSSのパースを省略することで高速化するgemで、Rails 4からはデフォルトで使用されるようになります。 高速化は大歓迎なのですが、JavaScriptのイベントの起き方が変わるため、Rails 3までの書き方をしているとまず間違いなく問題が起きます。しかも、Rails 4ではデフォルトの機能ですので、最新版を使いたいなら必ず知っておかなければいけません。 本エントリではturbolinksを使うために絶対に知らなければいけないことを分かりやすく紹介したいと思います。 動作 turbolinksの動作は、すごく大雑把に言うと以下の通りです。 リンクのclickイベントをフッ
DOMを高速に操作するための skin.js というライブラリを作った - mizchi log
(タイトル修正 DOMを高速に操作 => DOMの値を高速に更新 at Sat Mar 09 2013 15:30:09 GMT+0900 (JST)) (Skin#inject実装したのでタイトル元に戻した at Mar 09 2013 18:10:04 GMT+0900 (JST)) 若手の会で、JavaScript Hell on Earth というテーマで話してきました。 js_hell_on_earth http://www.rvl.io/mizchi/js_hell_on_earth というわけでDOM抽象ラッパーつくりました。 mizchi/skin.js · GitHub https://github.com/mizchi/skin.js 目的 クライアントサイドJSでは一回書いたら終わり、ではありません。ゲームなどのリッチなユーザー体験を提供する際、高頻度でDOMを書き換
爆速でわかるjQuery.Deferred超入門
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog Yahoo!デベロッパーネットワークの中野(@Hiraku)です。これまで、JavaScriptで非同期処理を書く上での問題として、コールバック地獄やエラー処理に例外が使えないことなどを解説してきました。 これらの問題に対処するライブラリの1つであるjQuery.Deferredに関して、もう少し丁寧に解説いたします。なお、jQueryのバージョンは記事執筆時点の最新である、1.9.1を想定しています。 jQuery.Deferredとは jQuery.DeferredとはjQueryのバージョン1.5から導入された、非同期処理をうまく扱うための標準モジュールです。使いこなすことで、以下のような効果が見込めます。 非同期処理を連結
Backbone.jsにおけるModel-View-Presenterアーキテクチャパターン | DevelopersIO
クライアントサイドJavaScriptのフレームワークとして人気のBackbone.jsが採用している Model–View–Presenter (MVP) というアーキテクチャパターン(以下MPVパターン)について考察してみます。 Model-View-Controllerなら聞いたことあるけど？ 僕もそうでした。初めて知ったのはRuby on Railsを触った時です。 Modelはデータと手続きを担当し、ViewはUIを、Controllerは入力イベントを受付けてModelとView操作する…とまぁざっくり言うとこんな感じですよね。 MVPパターンも凄く似ていて、どうもMVCパターンから派生したものみたいです。以下が各パターンの図です。 Model-View-Controller Model-View-Presenter PresenterがModelとViewを操作しているところ
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
Rails3.1でAjaxを使う - ひげろぐ
よく理解できていなかったのでチュートリアル的に整理した。 まずはチュートリアル用のアプリを新規作成して、コントローラーを一つ作る。 rails new ajax_tutorial cd ajax_tutorial rails g controller sandbox index update_time Ajaxなフォームやリンクを作成する form_forやlink_toといったヘルパーのオプションに:remote => trueを加えるとボタンを押した時やリンクをクリックした時のリクエストが非同期リクエストになる。 app/views/sandbox/index.html.erb <h1>Sandbox#index</h1> <%= link_to('update time', {:action => 'update_time'}, :id => 'update-time-link',
New JavaScript UI Library
I have been using it quite substantially for a number of different projects now and must say that I absolutely love the way it works. - Soteri Panagou I've been using your grid on a couple of small projects and I've got to say it's an awesome piece of work. It's very easy to configure and offers a lot of features while staying really responsive. As a programmer it inspires me to write better code.
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
長文日記
JSLinux