利用されているWebフォント名と、そのフォントの表示テストを行えるブックマークレット・「Type Sample」
Type Sample Type SampleはWebサイトの各エレメントで設定されているWebフォントの名前と、そのフォントを任意のテキストで表示テスト出来るブックマークレットです。任意のWebサイトで起動すると、各要素にカーソルを...
Resource - JavaScript
デスクトップ/モバイル向けのHTML5製ゲームフレームワーク・「Phaser」
Phaser Phaserはモバイル/デスクトップ向けのHTML5製の2Dゲームフレームワークです。pixi.jsを使うことでCanvasやWebGLのレンダリングもサポート可能との事。大量の動作サンプルが用意されていますのでご興味の...
複数のチャートを連動させる多次元チャートライブラリ・「dc.js」
dc.js dc.jsは複数のチャートを連動させる多次元チャートライブラリです。例えば円グラフの任意の場所をクリックすると、他のグラフがその箇所に応じたデータに変化します。デモをご確認頂いたほうが早いかもしれません。複雑なデータの可視...
多数のコンポーネントが備わったCSSフレームワーク・「Maxmertkit」
Maxmertkit Maxmertkitはタイポグラフィやテーブル、ボタンやタブなどなどWebサイトに必要なコンポーネントを大量に備えたCSSデザインフレームワークです。RWDにも対応しています。Bootstrapのような使い方が出...
難読化されたJavaScriptコードを見やすく整形する・「JS NICE」
JS NICE JS NICEは難読化されたコードを読みやすく整形するツールです。ただ整形するだけでなく、ローカル変数の名前を変更する事も可能みたい。沢山のOSSから規則性を学習したプログラム解析技術を利用しており、適切な変数名を提案...
大量のデータもフィルタリング可能なデータテーブルを実装するjQueryプラグイン・「jQuery DataTables」
jQuery DataTables jQuery DataTablesは大量のデータも高速でフィルタリングしてくれるデータテーブルを実装するスクリプトです。jQueryに依存しています。動作デモでは、10万以上あるデータから瞬時にフィ...
モバイル/デスクトップWebアプリ向けのリッチなUIを構築できるJavaScriptフレームワーク・「Webix」
Webix WebixはJavaScript、CSS、HTML5を使用した、インタラクティブなWebアプリケーションを構築するためのUIフレームワークです。クロスブラウザ、クロスデバイスとの事ですが、どれくらい対応しているかはちょっと...
クリッカブルな日本地図を実装するjQueryプラグイン・「Japan Map」
Japan Map Japan Mapは日本のクリッカブルマップを実装できるスクリプトです。都道府県だけでなく、地域でグループ化も出来るみたい。これは覚えておくと良さそうです。ライセンスはMITとの事。 Japan Map
個人向けデータ管理システムを構築できるオープンソースのソフトウェア・「TagSpaces」
TagSpaces TagSpacesはOSSのデータ管理システムです。個人向けのシステムとして作っているみたいですね。デモが見当たりませんが、SSを見る限りでは結構便利かも。制作業に限らず応用できそうです。暇を見て触って見たい。ライ...
Bootstrap向けのレスポンシブなメガメニューを実装する・「Responsive Bootstrap MegaMenu」
Responsive Bootstrap MegaMenu Responsive Bootstrap MegaMenuはBootstrap向けのRWDに対応対応したメガメニューです。ドロップダウンメニューの中には動画やGoogleマッ...
スマフォ向けWebアプリの為のシンプルなコンポーネント集・「Ratchet」
Ratchet Ratchetはスマフォ向けWebアプリの為のシンプルなコンポーネント集です。Bootstrapと同じ開発元で公開されていました。スマフォ専用のBootstrapなのかもしれないですね。基本的なものは一通り揃っています...
jsfiddleライクにブラウザ上でJavaScriptの動作テストができるオープンソースのソフトウェア・「Codemagic」
Codemagic Codemagicはブラウザ上でJavaScriptの開発・動作テストを行えるツールです。jsfiddleと同じようなものですが、こちらはOSSとしてGithubにてソースが公開されています。ライセンスはMITとの...
OSSとして公開されている、正規表現の動作テストをブラウザ上で行えるツール・「RegExr」
RegExr RegExrはブラウザ上で正規表現のテストができるツールです。GithubにてOSSとしてもソースが公開されています。refiddleとほぼ同じ性能になりますが、RegExrの方が個人的には若干使いやすい印象でした。ライ...
単一ページで作るHTML5製Webアプリ向けのフレームワーク・「BladeRunnerJS」
BladeRunnerJS BladeRunnerJSは単一ページで構築するHTML5製のWebアプリ向けに作られたOSSの開発フレームワークです。大規模で複雑なWebアプリに対応できるのが強みみたいですね。ライセンスはGPLとな...
WebベースのiOS7アプリ向けHTMLフレームワーク・「Framework7」
Framework7 Framework7はWebベースのiOS7アプリ向けに開発されたHTMLフレームワークです。iOS7のようなフラットなデザインで各UIコンポーネントもiOS7を意識した作りとなっています。ライセンスはMITとの...
AngularJS対応のHTML5製モバイルWebアプリ向けのフレームワーク・「Ionic」
Ionic IonicはOSSとして公開されているAngularJS対応のHTML5なモバイルWebアプリ用フレームワークです。Sassベースで構築されています。jQueryに依存しないのは個人的に有りがたいです。ライセンスはMITと...
アイソメトリックを利用したピクセルアートをcanvasで描く為のライブラリ・「Obelisk.js」
Obelisk.js Obelisk.jsはアイソメトリック（等角投影法）を利用したピクセルアートをHTML5 canvasで描くためのライブラリです。上記のようにGifアニメーションの作成も可能です。アイデア次第では面白いコンテンツ...
jsFiddleのようにブラウザでJavaScriptを書いて動作を確認出来るOSS・「tmpltr」
tmpltr tmpltrはOSSで公開されているjsFiddleライクな開発ツールです。ブラウザ上でJavaScriptを開発、実行テストができます。完全なクローンではありませんが、JavaScriptとHTMLで作られている為、軽...
placeholderのテキストをアニメーション付きで表示/非表示にするスクリプト・「Placeholdem」
Placeholdem Placeholdemはplaceholder属性で設定したテキストを、フォーカス時にアニメーション付きで表示/非表示にするスクリプトです。非依存型で、単体で動作しますので使いやすそう。必ずしも必要なエフェクト...
Bootstrapでスプレッドシートを実装するスクリプト・「editableTableWidget」
editableTableWidget editableTableWidgetはBootstrapでスプレッドシートを実装する為のjQueryプラグインです。テーブルを編集可能にし、合計値を算出してくれます。覚えておいて損はなさそう。...
jQueryのカスタムビルドを作成出来るツール・「jQuery Builder」
jQuery Builder jQuery Builderはコアのカスタムビルドを作成する為のツールです。バージョンや圧縮の可否、追加するモジュールを選ぶ事が可能で、ファイルサイズも表示してくれます。また、本ツールはMITライセンスの...
JavaScriptやHTMLのコード整形と差分チェックが出来る・「Pretty Diff」
Pretty Diff Pretty Diffはコード整形や差分チェックが可能なWebツールです。コードはJavaScript、CSS、HTMLなどに対応しています。また、本ツールはGithubでもソースが公開されていますが、ライセン...