node.jsとGoogle Chromeによるローカルアプリケーション開発·node-chrome MOONGIFT
node-chromeはnode.jsをバックエンドに、フロントエンドをChromeを使ってローカルアプリケーションを開発します。 node.jsを使っていると何でもJavaScriptで完結したい気分になってきます。そこでターゲットになるのがローカルアプリケーションです。Gtkなどを使うことなく、何とChromeを使ってしまうソフトウェアがnode-chromeです。 デモアプリを立ち上げたところ。 デモのコードです。 node-chromeではGoogle Chromeのパスを指定し、普段使っているプロセスとは別でWebブラウザを立ち上げます。後はnode.jsのサーバとして動くのみです。ローカルでWebアプリケーションを立ち上げて利用するという新しいスタイルが実現しそうです。 node-chromeはnode.js製のソフトウェア（ソースコードは公開されていますがライセンスは明記され
Twitter製。大型Webアプリケーション開発にぜひ·Flight MOONGIFT
FlightはTwitter社の開発した軽量なコンポーネントベースのJavaScriptフレームワークです。 BootstrapのリリースでWebサービス開発のデザインに革命的なインパクトを与えたTwitterから次いで登場したのがFlightです。コンポーネントベースのJavaScriptフレームワークです。 デモのメーラー風アプリケーションです。 メニューが出たりメールの選択ができます。 新しいメッセージの作成ウィンドウ。フローティングです。 こんな感じのファイル構成になっています。 Flightではコンポーネントから別なコンポーネントを参照できるようになっていません。他のコンポーネントをサブスクライブし、アクションが起こった時に伝えてもらう仕組みになっています。一つのコンポーネントの一つのアクションから複数の別なコンポーネント呼び出しなども簡単に実現できるようになっています。 Fli
ブラウザキャッシュではなくローカルストレージを使ったキャッシュシステム·basket.js MOONGIFT
basket.jsはローカルストレージにJavaScriptをキャッシュして高速化をはかるソフトウェアです。 Webの高速化を語る上でキャッシュの存在は欠かせません。そこで使ってみたいのがbasket.jsです。何とHTML5のローカルストレージを使ってキャッシュする仕組みを提供します。 最初の実行。underscore.jsなどが読み込まれています。2回目以降は消えます。 でもちゃんとjQueryオブジェクトは存在します。 basket.requireメソッドを使って対象ファイルを読み込みます。有効期限を設定することも可能です。読み込み失敗をハンドリングすることもできます。普段はそのまま利用でき、remove()やclear()でファイルを解除できます。 basket.jsはJavaScript製、MIT Licenseのオープンソース・ソフトウェアです。 MOONGIFTはこう見る ロ
かゆいところに手が届くMac OSX用コマンドユーティリティ·tools-osx MOONGIFT
tools-osxはMac OSX用の便利なコマンド群です。 Mac OSXはUnixベースなので多様なコマンドが用意されていますが、さらに小粒ながらも便利なコマンドを追加してくれるのがtools-osxです。 インストールします。 qlコマンドはQuickLookを立ち上げます。 trashコマンドはrmとは異なりファイルをゴミ箱に入れます。 tools-osxではclipcat（クリップボードの出力）、dict（辞書検索）、eject（ボリュームの取り出し）、ql（QuickLookでの表示）、swuser（ユーザスイッチ）、trash（ゴミ箱に移動）、with（アプリケーションで開く）が用意されています。どれも便利なコマンドになるでしょう。 tools-osxはMac OSX用、MIT Licenseのオープンソース・ソフトウェアです。 MOONGIFTはこう見る ターミナル上で入力
Google Chromeを使ったWebシステム開発がもっと簡単になる·Tincr MOONGIFT
TincrはGoogle Chromeデベロッパーツール上の修正をローカルファイルに反映できるソフトウェアです。 Webシステムを開発している際にGoogle Chromeのデベロッパーツールはおおいに役立ちます。Web上での修正をそのままローカルに反映できるTincrを使うとさらに便利になるでしょう。 インストールします。Google Chrome機能拡張として提供されています。 開発中のサイトで使います。 静的なWebサイトの他、Google Chrome機能拡張やRailsのassetsにも対応しています。 デモ動画です。 Tincrはローカルファイルの修正の他、ローカルファイルを修正した際の自動リロードにも対応しています。ログをコンソールに出力することもできるので、動かない場合の原因調査も容易になりそうです。 TincrはGoogle Chrome用のオープンソース・ソフトウェア（
SWFファイルからiPhoneで使えるアニメーション部品を生成·Super Animation Converter MOONGIFT
Super Animation ConverterはSWFファイルを解析し、iPhoneでのアニメーション作成を容易にするソフトウェアです。 iPhone向けのゲームを開発する際に、キャラクターが動き回るアニメーションが必要になることはよくあるでしょう。そこでアニメーションの作成には使い慣れたFlashを使い、そのSWFファイルを解析して部品化するSuper Animation Converterを使ってみましょう。 メイン画面です。 SWFファイルを読み込みました。 エクスポートすると一気に部品ごとに分かれます。 サンプル。 Super Animation Converterでは部品を使ってCocos2D-Xのプロジェクトテンプレートに沿って開発を行います。Cocos2Dではフレーム単位のアニメーションになり、サイズが大きくなったりスムーズなアニメーションを作るのが難しいとのことですが、
デベロッパーツール上での修正をローカルファイルにも反映·Chrome DevTools Autosave MOONGIFT
Chrome DevTools AutosaveはGoogle Chromeのデベロッパーツール上での変更でローカルファイルも更新するソフトウェアです。 Google ChromeやSafariのデベロッパーツールやFirefoxのFirebugは便利な開発ツールですが、その場で修正しても再読み込みするとまた元に戻ってしまいます。それを防ぎ、修正を自動保存してくれるのがChrome DevTools Autosaveです。 サーバを起動しました。node.jsで作られています。 Google Chrome機能拡張をインストールします。 URLと保存するファイルのパスを紐づけます。 スタイルシートを変更すると、ローカルのファイルも更新されました。 更新処理部分のログ。 Chrome DevTools Autosaveはnode.jsで作られたサーバを使い、指定したURLのファイルをデベロッパ
どんなイベントが設定されているか一目で分かる·Visual Event MOONGIFT
Visual Eventはイベントが設定されているDOMをビジュアル化するライブラリです。 最近のWebサイト開発においてJavaScriptを使わないということは殆どなくなりました。jQueryなどを使って様々なイベントを設定しているサイトも多いでしょう。そこで使ってみたいのがVisual Eventです。 実行しました。色がついた部分がイベントを設定しているところです。 フローティングでアクションの内容が分かります。 Yahoo! Japanで実行しました。意外と色々なアクションが設定されています。 表示の切り替え系が多いようです。 Visual Eventを使うとjQueryで設定したり、onClickで指定したりしたアクションが一目で分かるようになります。jQueryで開発中に設定したイベントが正しく実装されているかどうか確認するのにも使えそうです。 Visual EventはJa
ログの閲覧にWebブラウザを使える·Pupergrep MOONGIFT
PupergrepはWebブラウザ上でリアルタイムにログデータを閲覧したりGrepで検索できるソフトウェアです。 開発を行っている際にログファイルをtailして眺めているといった人は多いかと思います。しかし複数のファイルを同時に監視したり、その中から必要なものだけを抽出したり…というのは面倒です。そこでPupergrepを使ってみましょう。 Webブラウザ上でtail風にリアルタイムにログが確認できます。 ハイライト指定もできます。 機能としてはGrepによるマッチした行だけの表示、ログファイルの表示切り替え、テキスト/HTMLのサポート、ANSIカラー対応、コードを変更してのカスタマイズとなっています。Pupergrep単体で動く訳ではなく別途server.jsを記述（といってもサンプルコードあり）するので自由にカスタマイズできるのが魅力と言えそうです。 Pupergrepはnode.j
取り扱い注意！JavaScriptを使ってMD5ハッシュをクラック·MD5-Password-Cracker.js MOONGIFT
MD5-Password-Cracker.jsはJavaScriptを使ってMD5のハッシュ値から元テキストを検索するソフトウェアです。 パスワードをハッシュ化して保存しておくのは基本と思われますが、その際によく使われるのがMD5ではないでしょうか。SHA-1/SHA-2のが良いと思うのですが、それをまざまざと知らしめてくれるのがMD5-Password-Cracker.jsです。 パスワードクラック開始！Web Workersが8つ使われています。 パスワードはheyaでした。1ワーカーあたり1秒間に約7万の解析が行われています。4文字のパスワードに対して23秒で解析されました。 網羅的に文字列を試しているので時間は要しますが、4文字程度のパスワードであればあっという間に解析されてしまうというのが分かるかと思います。パスワードの取り扱いについてはくれぐれもご注意を。 MD5-Passwo
正規表現を書く際に使ってみたいハイライトライブラリ·Regex Colorizer MOONGIFT
Regex ColorizerはWeb上で動作する正規表現ハイライターです。 正規表現が正しくかけているかどうか、それが分からなくてやきもきする時は多いと思います。そこで使ってみたいのがRegex Colorizerです。 正規表現に格好いいカラーリングがされています。エラーの場合は赤文字が出ています。 ちょっと違うカラーリングも。 こんな感じの激しいカラーリングもあります。 Regex Colorizerを使って正規表現がハイライト表示されれば、自分が意図している正規表現を書けているかどうかチェックが容易になります。またエラーチェックも兼ねているのでミスしていてもすぐに分かるでしょう。 Regex ColorizerはJavaScript製、MIT Licenseのオープンソース・ソフトウェアです。 MOONGIFTはこう見る 正規表現には各言語ごとの方言があるので注意が必要です。例えば
Web APIの開発に使えるモックサーバ·EasyMock Server MOONGIFT
EasyMock Serverはnode.jsで作られたWeb APIのテスト用サーバです。 最近はWeb APIを使うシステム開発が増えています。しかし常にサーバにアクセスするのは面倒なのでモックサーバを立ててみましょう。そのために使えるのがEasyMock Serverです。 立ち上げました。3000番でポートが立ち上がります。 /user/1というURLにアクセスしました。結果も返ってきます。 APIドキュメントも生成されます。 実際の裏側。指定されたURL以下にあるJSONファイルを読み込んでいます。 EasyMock Serverは予め設定ファイルを使ってルーティングの設定をします。そしてリクエストされたURLに従ってJSONファイルを受け取って、リクエストされた内容を反映しながら返却するという仕組みです。GET/POSTなどもテストでき、ドキュメントも整備されるので便利そうです
気になった画像、音楽、動画があったら右クリックでGoogle Driveへ保存·Save2Drive MOONGIFT
Save2DriveはGoogle Chromeから画像、音楽、動画ファイルをGoogle Driveへ保存する機能拡張です。 Webブラウジングをしていて気になった画像や音楽、動画があったらSave2Driveを使ってGoogle Driveに保存してしまいましょう。 コンテクストメニューにSave to Driveが追加されます。 保存処理実行中です。 Save2Driveは2パターンの動作があり、表示されているデータを保存するのとリンク先を保存するのが可能です。画像をたくさん紹介しているサイトや、MP3ファイル、MPEG4など様々なデータをクラウドストレージに保存できるのが便利そうです。 Save2DriveはGoogle Chrome用、MIT Licenseのオープンソース・ソフトウェアです。 MOONGIFTはこう見る Google DriveであればDropboxライクにロー
オンラインの画像をクラウドサービスに転送·Cloud Save MOONGIFT
Cloud Saveはコンテクストメニューから各種クラウドサービスにオンラインのファイルを保存するGoogle機能拡張です。 画像のたくさんあるサイトなどで役立つのが右クリックしてローカルに保存する系統の機能拡張ですが、今どきはちょっと違います。Cloud Saveは各種あるクラウドストレージサービスを選択するだけでファイルの保存ができます。 インストールします。 コンテクストメニューから保存先を選択できます。 ウィンドウが表示されて保存している旨のメッセージが出ます。 オプション画面です。ここからアップロードもできます。 対応しているサービスは数多く、SkyDrive、Dropbox、Box、Google Drive、Amazon Cloud、Sugarsyncなどがあります。さらにFacebook、Flickr、TwitPic、WebDAVへの転送も可能です。 Cloud SaveはG
Google Chrome機能拡張を開発するならベースにどうぞ！·ChromeSkel MOONGIFT
ChromeSkelはGoogle Chrome機能拡張を作るためのベースになるソフトウェアです。 Google Chromeは今や世界一のシェアを誇るWebブラウザになっています。そんなGoogle Chromeをさらに魅力的にするのが機能拡張です。Google Chrome機能拡張を作ってみたいと思う方はChromeSkelをベースにすると良いでしょう。 ファイル構成 インストールしました。 オプション画面があります。 アクションも設定されています。 別ページの設定画面。 ChromeSkelは手早くGoogle Chrome機能拡張を開発するためのテンプレートになります。サンプルのアイコンやManifest.json、jQueryを同梱、オプションページ、background.html、popup.htmlなど開発に必要な道具がたくさん揃っています。 ChromeSkelはGoogl
Mozilla製。JavaScriptでFlashファイルを実行·Shumway MOONGIFT
ShumwayはJavaScript製のFlash VMおよび実行エンジンです。ActionScript2/3に対応しています。 HTML5のシェアが高まるほど注目を集めるのが従来のコンテンツの扱いをどうするかです。特にFlashは悩みが多いのではないでしょうか。そこでMozillaの考えた答えがShumwayです。 レーシングゲームのデモです。ちゃんと遊べます。 SVGを描くデモ。 パックマン。ActionScript2と3が用意されています。 Box2Dのデモ。ActionScript3です。 ShumwayはJavaScriptで作られたFlashのVMであり実行エンジンです。ActionScript2と3に対応しています。単体の動作とともに、Firefoxアドオンとしての開発も行われています。 ShumwayはJavaScript製のオープンソース・ソフトウェア（MIT Licen
サーバ管理を一元化。ステータス管理もできる·とりぐらふ MOONGIFT
とりぐらふは複数のサーバ情報を一元的に管理し、その運用状態もモニタリングできるソフトウェアです。 Webサービスが大きくなっていくのに従って、サーバの台数も増えていきます。そうしたサーバ群の管理については企業独自の取り組みがいろいろ行われていますが、オープンソースとして公開されたのがとりぐらふです。 トップページです。GitHubのアカウント認証でログインできます。 アクティビティです。ログも確認できます。 提供しているサービスの一覧。 編集できます。MuninのURLを設定するようになっています。 ロールの設定です。 ホストの一覧です。 ホストの詳細画面です。 とりぐらふは複数のサーバのステータス、提供しているサービスを一つの画面で管理できるソフトウェアです。デプロイ対象のホスト管理も行い、Capistranoなどと連携します。一定数以上のサーバ管理を行うようになったら立ち上げたいソフト
コンピュータの操作が音楽を紡ぎだす·Auto oneliner music MOONGIFT
Auto oneliner musicはマウスやキーボードの入力から音楽を生み出していくソフトウェアです。 音楽は一つ一つの音符に意味を持たしてじっくり作っていくのも良いですが、何となく即興で奏でてみるのも面白いものです。Auto oneliner musicはマウスの動きやキーボードの入力に合わせて音楽が作られるソフトウェアです。 マウスを動かしたりすると音が流れます。 表示はリアルタイムで更新されます。 ブログを書いたり、ドキュメントを作っているのに合わせてリアルタイムに次々とJavaScriptの式が作られていきます。その結果を評価して音楽が奏でられる仕組みです。良い曲ができるかどうかは、その時の気分次第かも知れません。 Auto oneliner musicはnode.js/Ruby製のソフトウェア（ソースコードは公開されていますがライセンスは明記されていません）です。 MOONG
JSONを使った開発のお供にどうぞ·jq MOONGIFT
jqはターミナル上で使えるJSONパーサーです。 JavaScriptの台頭に伴ってJSONを共通のファイルフォーマットに使うことが増えてきました。システムから取得したJSONファイルの内容を調べる時に使いたいコマンドがjqです。 元のJSONです。 resultsの1つ目だけを出力。 2つ目だけ。 一つ目、さらに項目を指定して出力。 全ての結果、ただし項目を指定して出力。 さらに情報を追加して出力もできます。 jqはMac OSXやLinux向けのコマンドであり、標準出力されたJSONファイルを読み込み、加工した上で出力できます。かつインデントを含めて成形してくれるのでデータの見やすさが格段にあがるはずです。プログラミング言語のライブラリから扱うよりも手軽ではないでしょうか。 jqはC製、MIT Licenseのオープンソース・ソフトウェアです。 MOONGIFTはこう見る Web AP
Lytroファイルを解析してJPEGへ·Lytro Viewer MOONGIFT
Lytro ViewerはLytroファイルを解析してJPEGファイルを出力するソフトウェアです。 一年くらい前から話題に上がってくるガジェットにLytroがあります。撮影した後にフォーカスを変えられるカメラであり、専用のファイルフォーマットで出力されます。Flash製のビューワーしかないのを悲観し、作られたのがLytro Viewerです。 解析完了。 一枚目。右上にフォーカスあり。 二枚目。ちょっと左下に移動。 三枚目。さらに左下へ。 四枚目。一番上に比べるとずいぶんフォーカスがずれているのが分かるでしょう。 Lytro Viewerはコマンドであり、Lytroのファイルを渡すとフォーカスするポイントを変えつつ4つのJPEGファイルを生成します。この仕組みがあれば後はJPEG画像のクリックしたポイントを送信してファイルを動的に生成すれば良いだけです。とても面白いソフトウェアです。 Ly
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
