GoogleドキュメントでWebページを作成、公開できるOSS・「ImportDoc」 ImportDoc ImportDocはGoogleドキュメントで書いたコンテンツをそのままWebページとして公開できるようにするライブラリです。OSSとして公開されています。 Googleドキュメントで管理できるので簡易的...2019.07.30 | 10時06分05秒
ABC記譜法を自動で楽譜化、音源化したりダウンロード出来るようにするスクリプト・「abc.js」 abc.js abc.jsはABC記譜法を自動で楽譜化、その場で視聴したりMIDIファイルを生成してダウンロードできるようにするスクリプトです。 ABC記譜法は以下のようにプレーンテキストで楽譜を表現できるようにしたもの。 (...2019.07.19 | 10時08分54秒
オープンソースのシンプルでモダンなepubビューアスクリプト・「Foliate」 Foliate Foliateはオープンソースのシンプルでモダンなepubビューアスクリプトです。epub.jsがベースとなっているそうです。 ナビゲーションやスクロールバー設置、カスタムテーマ、注釈ツールやハイライトなど、ep...2019.07.18 | 9時49分26秒
オープンソースのシンプルなReact.jsコンポーネントライブラリ・「Flawwwless ui」 Flawwwless ui Flawwwless uiはシンプルなReact.jsのコンポーネントライブラリです。シンプルで扱いやすいように設計されている印象でした。 用意されたUIコンポーネントはよく使われるものでモーダルウィ...2019.07.17 | 10時03分13秒
コンパクトでノイズの無いミニマルなオープンソースのカンバンボード・「Nullboard」 Nullboard NullboardはOSSのカンバンボードWebアプリです。コンパクトで無駄のないミニマルなスタイルとなっています。特に可読性にフォーカスして設計したそう。 機能は必要最低限ですが、重要なワークスペー...2019.07.08 | 9時58分56秒
preタグに書いたデータをダイアグラムとしてビジュアル化するスクリプト・「Pinker.js」 Pinker.js Pinker.jsはpreタグに書いたデータをcanvasにダイアグラムとして描いてくれるスクリプトです。 特定のルールに沿った書き方をpreタグにする事で簡易的なダイアグラムを生成できる、というもの。割と複...2019.06.28 | 10時00分26秒
Webサイトマップをビジュアル化して見積もりを計算できる・「Octopus.do」 Octopus.do Octopus.doはWebサイトのサイトマップをビジュアル化して見積もりを計算、シェアできる見積もり計算アプリです。 ページごとに作成する項目を書き、工数を設定すると自動で計算してくれる、というも...2019.06.27 | 10時39分21秒
手軽にダークモードを導入できるシンプルなスクリプト・「Darkmode.Js」 Darkmode.Js Darkmode.Jsは手軽にダークモードをWebサイトに導入できるシンプルなスクリプトです。非依存で非常に軽量ですが、要はmix-blend-modeを使うので汎用性は高くはありません。 dev.toの...2019.06.26 | 10時05分48秒
任意の画像にフィルターを掛けたりリサイズ、切り抜き等の加工を施してダウンロードできるOSSの画像編集ライブラリ・「Filerobot Image Editor」 Filerobot Image Editor Filerobot Image Editorは任意の画像にさまざまなフィルターを掛けたりリサイズ、クロップ、回転などの加工を施したうえでダウンロードできるようにする、画像加工ライブラリです...2019.06.25 | 10時14分32秒
Vue.jsベースのECサイト向けUIコンポーネントライブラリ・「Storefront UI」 Storefront UI Storefront UIはECサイトの為に開発されたVue.jsベースのUIコンポーネントライブラリです。デザイナーや開発者向けに設計されており、カスタマイズのしやすさも考慮されているそうで、デス...2019.06.07 | 10時10分05秒
マウスの動きやスクロールなど、閲覧ユーザーのブラウザのビューポート状態を監視するスクリプト・「Tornis」 Tornis Tornisはマウスの動きやスクロールなど、閲覧ユーザーのブラウザのビューポート状態を監視するスクリプトです。シンプルで軽量、依存関係もなく、使いやすい設計となっています。 パララックスの為のスクリプトというわけで...2019.06.06 | 10時08分37秒
レーダーチャートを作れる非依存のシンプルなスクリプト・「maturity-radar」 maturity-radar See the Pen MdLMKo by kachibito (@kachibito) on CodePen. maturity-radarはレーダーチャートを作成できるスクリプトで...2019.06.04 | 10時06分27秒
href=”mailto:”のリンクをクリックした際に選択式にするスクリプト・「mailgo」 mailgo mailgoは<a href="mailto:***">のようなmailtoリンクを、メーラw-立ち上げずにモーダルウィンドウを開いて選択式にするスクリプトです。少し前にMailtoUIというスクリプトの記事...2019.05.15 | 10時00分43秒
コンテキストメニューからドラッグ中のテキストのフォント情報を調査出来るオープンソースのChrome拡張・「Fontanello」 Fontanello Fontanelloは右クリックで表示されるコンテキストメニューからドラッグしているテキストのフォントの情報を調べられるChromeエクステンションです。従来のエクステンションのようにわざわざ起動したりブックマー...2019.05.14 | 10時12分07秒
d3.js v5をベースにしたチャートライブラリ・「Britecharts」 Britecharts Britechartsはd3.jsのv5をベースにしたチャートライブラリです。チャートとコンポーネントを簡単に直感的に組み合わせる事が出来るのだそうです。リユースブルであり、シンプルなAPIを特徴としているのだ...2019.05.13 | 10時07分39秒
Gmailの元リードデザイナーが作った、GmailをミニマルなデザインにするChrome拡張・「Simplify」 Simplify Simplifyは元Gmailのリードデザイナーが作った、GmailをミニマルなUIに替えるChrome拡張です。Google InboxのシンプルさをGmailにもたらす、というのが目的のよう。2008年~2012...2019.04.29 | 10時30分11秒
mailtoリンクを使いやすいUIに変換するスクリプト・「MailtoUI」 MailtoUI MailtoUIはmailtoリンクを使いやすいUIに変換してくれるスクリプトです。href="mailto:tony.stark@example.com"といったコードでもOutlook等のメーラーを立ち上げず...2019.04.27 | 10時05分54秒
URLを指定すると自動でアクセシビリティチェックを行い、レポートを生成するオープンソースのデスクトップアプリ・「Koa11y」 Koa11y Koa11yはURLを指定すると、そのWebページのアクセシビリティチェックを行い、HTMLやCSV、MarkdownやJSON、XMLなどの形式でレポートを吐き出すオープンソースのデスクトップアプリです。基本的にはチェ...2019.04.26 | 9時51分18秒
タッチデバイスにも対応可能な、リストのアイテムを並べ替えたりスワイプで削除できるようにするライブラリ・「Slip.js」 Slip.js See the Pen ZZRmaP by kachibito (@kachibito) on CodePen. Slip.jsはリストのアイテムの並べ替えやスワイプによる消去を可能とする非依存のシ...2019.04.22 | 10時01分13秒
SVGベースのモダンなカラーピッカーを実装する非依存の軽量JavaScriptライブラリ・「iro.js」 iro.js See the Pen iro.js demo by James Daniel (@rakujira) on CodePen. iro.jsはSVGで作られたモダンなスタイルのサークルタイプカラーピッ...2019.04.20 | 10時03分53秒
jsfiddleやCodepenのようにブラウザでJavaScriptを実行テストできるオープンソースのWebアプリ・「Editor」 Editor EditorはjsfiddleやCodepenのようにブラウザでHTML/CSS/JSのコードを実行テストできるOSSです。emmetによるコード補完やLint機能、センターバーを動かす事でレスポンシブWebデザインの表...2019.04.17 | 10時29分08秒
無料且つ登録も不要でJavaScriptをコードを書きながら学べる・「CodeGuppy」 CodeGuppy CodeGuppyは無料でユーザー登録も不要のJavaScript学習サービスです。コードを実際に書きながら学ぶことができます。子供から大人まで学べる、をモットーに作られているそうなので頭に入りやすいかもしれません...2019.04.15 | 9時49分10秒