コーディング不要でWebサイトのテンプレートを作成する為のオープンソースソフトウェア・「GrapesJS」 GrapesJS GrapesJSはコーディングせずに直感でWebサイトのテンプレートを作成出来るエディタです。OSSとしてソースコードが公開されています。JS製でjQueryにのみ依存しています。必要なコンテナやテキスト、画像等をマ...2016.02.08 | 10時29分33秒
ブラウザで動くスプレッドシートの為のスクリプト・「jQuery.sheet」 jQuery.sheet jQuery.sheetはブラウザで動くスプレッドーシートの為のスクリプトです。jQueryに依存しており、OSSとして公開されています。HTML、JSON、XMLもサポートされています。他にもこの手のものは...2016.02.06 | 9時25分24秒
Webページにドローツールを埋め込むためのスクリプト・「Drawingboard.js」 Drawingboard.js Drawingboard.jsはWebページにおえかきツールを埋め込むためのスクリプトです。Canvasベースで出来ており、コントロールに必要な機能も一通り揃っている印象です。ある程度他のライブラリにも...2016.02.05 | 10時39分41秒
レスポンシブWebデザイン対応のシンプルなイベントカレンダーを実装出来るスクリプト・「monthly.js」 monthly.js monthly.jsはシンプルなイベントカレンダー実装の為のスクリプトです。jQueryに依存しています。レスポンシブWebデザインにも対応しており、デイトピッカーとして利用する事も可能となっています。少し触って...2016.02.03 | 9時36分58秒
サウンドインタラクションを追加する為のシンプルなJavaScriptライブラリ・「Loud links」 Loud links Loud linksはWebコンテンツにサウンドインタラクションを追加する為のシンプルなJSライブラリです。audio属性を使うみたい。非依存型で軽量なのは良いですね。音源を用意して特定のclassとカスタムデー...2016.01.26 | 10時29分05秒
シンプルなスプレッドシート実装の為のスクリプト・「ipgrid」 ipgrid ipgridはシンプルなスプレッドシート実装の為のスクリプトです。jQueryに依存しています。Googleスプレッドシートのように扱えるそうですが、まだ関数はいくつかしかテストしていませんのでクローンと言えるかどうかは...2016.01.20 | 10時46分31秒
Codepenで2015年に話題になった投稿TOP100をまとめた・「MOST The HEARTED 2015」 MOST The HEARTED 2015 MOST The HEARTED 2015はCodepenで話題になった投稿TOP100をランキング化したWebページです。最もグッと来た投稿、コードを紹介しています。心に来たコード=実際に...2016.01.19 | 10時17分20秒
ブラウザのサポート状況をチェックする1KBの軽量スクリプト・「Feature.js」 Feature.js Feature.jsはブラウザのサポート状況をチェックしてくれる高速且つシンプル、軽量なブラウザの特徴検出スクリプト。他ライブラリへの依存も無く、わずか1KB程度で動作してくれます。Modernizrライクに利用...2016.01.12 | 9時48分48秒
モダンブラウザ向けのjQuery代替な軽量スクリプト・「cash」 cash cashはモダンブラウザ向けのjQuery代替スクリプトです。と言っても100%代替を目指すつもりは無いようで、あくまで軽量さを保ちつつ、ある程度jQueryで出来ることをカバーしていく、というもののようですね。cashのコ...2016.01.10 | 10時25分55秒
CSSのフィルターを手軽に扱えるようにするスクリプト・「Philter」 Philter PhilterはCSSのfilterを手軽にコントロールできるようにする為のスクリプトです。jQuery版とvanilla.JS版があります。CSSを書かずとも、例えばdata-philter-grayscale="1...2016.01.08 | 10時33分09秒
Githubで公開されているjQueryのプラグインと詳細をまとめている・「jQuery Cards」 jQuery Cards jQuery CardsはGithubで公開されているjQueryのプラグインと詳細をまとめているWebサイトです。詳細はREADME.md等を引っ張ってきてるみたいです。また、全てではありませんが、動作デモ...2016.01.06 | 10時26分21秒
シングルページのWebアプリケーションエンジン・「Senna.js」 Senna.js Senna.jsはオープンソースのシングルページなWebアプリケーションエンジンです。軽量で他ライブラリに依存しないフレームワークとなっており、高速ブラウジング可能なWebアプリ構築をサポートしてくれるとの事。ライセ...2016.01.05 | 11時28分54秒
gistやYoutube、Vine、TwitterやGoogle Mapなど、様々なサービスをembed出来る・「embed.js」 embed.js embed.jsは様々なサービスの埋め込みを容易に行えるようにする為のスクリプトです。テキストから自動で文字列を解析し、embedしてくれる、というもの。例えばGistやYoutubeなら、URLを貼るだけで勝手に埋...2015.12.27 | 10時08分37秒
ブラウザ上で数式を高速且つ手軽に表示する為のJSライブラリ・「KaTeX」 KaTeX KaTeXはWeb上で数式を高速簡単に表示する為のスクリプトです。上図のような、Web上で表示するのが難しい数式を手軽に書けるようにしよう、みたいなやつ。既存のMathJaxよりも高速との事で、比較画像も用意されています。...2015.12.25 | 10時44分52秒
ブラウザでPDFを作成するスクリプト・「pdfmake」 pdfmake pdfmakeはブラウザ上でPDFを作成する為の非依存型スクリプトです。JSONライクな記法で作成出来るみたいです。が、例によってこのままだと日本語は読み取ってくれませんので対応が必要になります。コードテストできるので...2015.12.24 | 11時01分53秒
ページのスクロール時にviewport内に入った要素をアニメーション表示させる非依存型で軽量なスクリプト・「ScrollReveal」 ScrollReveal ScrollRevealはページのスクロール時に、viewport内に入った要素をアニメーションエフェクト付きで表示するためのスクリプトです。他ライブラリへの依存は無く、単体で動作してくれます。圧縮版で2.7...2015.12.20 | 10時31分24秒
JavaScriptで作られたSVG背景パターン作成ツール・「Dynamic SVG Background Pattern Maker」 Dynamic SVG Background Pattern Maker See the Pen Dynamic SVG Background Pattern Maker by Dudley Storey (@dudleystorey) ...2015.12.18 | 10時22分51秒
Webページ内の任意のテキストをハイライト、タグ付け、共有出来るようにするスクリプト・「Annotator」 Annotator AnnotatorはWebページ内の任意のテキストをハイライト、タグ付け、メモと共有可能にするスクリプトです。動作にはjQueryを、オプションとして自動補完にawesomplete.jsを必要としています。テキス...2015.12.16 | 10時46分38秒
非依存型のシンプルな通知ライブラリ・「notie.js」 notie.js notie.jsは他ライブラリに依存しないシンプルでクリーンな通知ライブラリです。WarningやError、Confirm等の通知を、他ライブラリに依存する事無く実装出来ます。セッティングも簡単でなかなか使いやすそ...2015.12.15 | 9時25分38秒
モバイル対応なWebプロジェクトの為のフロントエンドフレームワーク・「SCHEMA」 SCHEMA SCHEMAはモバイル対応なWebプロジェクトの為のフロントエンドフレームワークです。Bootstrap、Less、Angular.js等が使われているようです。Web標準を放棄することの無いセマンティクス且つ迅速な設計...2015.12.12 | 10時39分28秒
任意の画像からよさ気な部分を自動で切り取るスクリプト・「smartcrop.js」 smartcrop.js smartcrop.jsは任意の画像からよさ気な部分を自動で切り取るスクリプト。訳わからんですね。まともな説明が思いつきませんでしたすみません。指定されたサイズの範疇で、画像からさも良さそうに見える構図で自動...2015.12.11 | 10時33分47秒
任意のライブラリを読み込んでデベロッパーツールのコンソールからテストできる・「JS Envy」 JS Envy JS Envyは任意のライブラリをロードしてDevToolのコンソールからAPIテストを行えるツールです。上図はjqueryを読み込んだ瞬間のSSです。右側にライブラリが挿入されているのが確認出来るかと思います(わかり...2015.12.09 | 10時58分18秒