Webサイトの任意のテキストをその場で変更できるブックマークレット・「Quick Edit Bookmarklet」
Quick Edit Bookmarklet Quick Edit BookmarkletはWebサイトの任意のテキストをその場で変更できるブックマークレットです。 Devtoolsを開かずとも、起動すれば即エディターモードにな...
Resource - JavaScript
高速なMagento製ECストアをReactで構築するためのオープンソースのフレームワーク・「GraphCommerce」
GraphCommerce GraphCommerceは高速で優れたUXのMagento製ECストアをReactで構築するためのオープンソースのフレームワークです。ハイエンドなEコマースPWAのスタイリングや設計に集中できるよう、必要...
EPGベースのタイムラインコンテンツを実装する為のReactコンポーネント・「Planby」
Planby PlanbyはEPGベースのタイムラインコンテンツを実装する為のReactコンポーネントです。OSSとしてソースコードが公開されています。 EPGとはTVやPCなどに、いわゆるTV番組表を表示するシステムでElec...
手軽にモダンなスクロールエクスペリエンスを構築できる軽量Reactライブラリ・「scrollex」
scrollex scrollexは手軽にモダンなスクロールエクスペリエンスを構築できる軽量Reactライブラリです。スクロールに応じてコンテンツをスマートに表示したり画像等を切り替えたりといった演出を手軽に実装する事が出来ます。 ...
先進的且つ多機能で安定したYoutube用JavaScriptライブラリ・「YouTube.js」
YouTube.js YouTube.jsは先進的且つ多機能で安定したYoutube用JavaScriptライブラリです。Innertube APIのフル機能ラッパーでYoutubeをシンプルで効率的に扱う方法を提供する為に作られてい...
class属性を利用するCSSライクなデザインエンジン・「Master Styles」
Master Styles Master Stylesはclass属性を利用するCSSライクなデザインエンジンです。本サイトでは拡張された構文を持った仮想CSS言語と説明しています。 実際に見た方がどういう事か把握できると思うの...
直感的な操作で使えるTypeScriptベースのオープンソースなPDF生成ライブラリ・「pdfme」
pdfme pdfmeは直感的な操作で使えるTypeScriptベースのオープンソースなPDF生成ライブラリです。ユーザーの使用にあたり、特別なスキルや訓練等も不要でオンラインでPDFを生成する事が出来ます。 テンプレート式にな...
CSSライクに書けるオープンソースのデータバインディングJavaScriptライブラリ・「Corset」
Corset See the Pen Counter example by kachibito (@kachibito) on CodePen. CorsetはCSSライクに書けるオープンソースのデータバインデ...
テキスト/アイコンベースのシンプルなアバターを生成するReactライブラリ・「Avvvatars」
Avvvatars Avvvatarsはテキスト/アイコンベースのシンプルなアバターを生成するReactライブラリです。任意の画像等を選択しないユーザーの為のもの、という感じ。 40の色と60のアイコン、入力されたテキスト（ユー...
リアルタイムで2Dまたは3DCGのシェーダーを作成するためのオープンソースJavaScriptフレームワーク・「Shader Park」
Shader Park Shader Parkはリアルタイムで2Dまたは3DCGのシェーダーを作成するためのオープンソースJavaScriptフレームワークです。 数行のコードで複雑なシェーダを作成できる、というもの。javas...
サポートが終了したパッケージや危険なパッケージが除外されたJavaScriptライブラリ検索ツール・「Code awesome」
Code awesome Code awesomeはサポートが終了したパッケージや危険なパッケージが除外されたJavaScriptライブラリ検索ツールです。 更にVanilla、React、Vueに分けられており、それぞれ更に細...
Markdownライクな記法で手軽にタイムラインを作成出来るOSS・「Cascade.page」
Cascade.page Cascade.pageはMarkdownライクな記法で手軽にタイムラインを作成出来るOSSです。ガントチャートも作れそうです。Vueで書かれています。 作成する為の記述は以下の様に。まずは各アイテムを...
非依存で軽量、使いやすいオープンソースのリッチテキストエディター・「Stylo」
Stylo Styloは非依存で軽量、使いやすいJavaScript製のインタラクティブなWYSIWYGリッチテキストエディターです。TSで書かれており、OSSとしてソースコードが公開されています。 Mediumのエディターのよ...
ネイティブな動作を維持しつつ、イベントやショートカット等も使える軽量スクロールバー実装ライブラリ・「letmescroll.js」
letmescroll.js See the Pen Untitled by kachibito (@kachibito) on CodePen. letmescroll.jsはスクロールのネイティブな動作を維...
シンプルで軽量、高速なWebコンポーネントの為のフレームワーク・「Minze」
Minze Minzeはシンプルで軽量、高速なWebコンポーネントの為のフレームワークです。誰もが利用しやすく使いやすいように、カスタムWebコンポーネントの作成プロセスから複雑さを取り除くよう配慮されています。 一度定義すれば...
DropboxやGoogle drive、OneDriveなどをユーザーが選択可能なReact製ファイルアップローダー・「React File Upload」
React File Upload React File UploadはDropboxやGoogle drive、OneDriveなどをユーザーが選択可能なReact製ファイルアップローダーです。 他にもBoxやSharePoi...
three.jsを使った3Dなアニメーション背景を簡単に作成、設置できるライブラリ・「Vanta.js」
Vanta.js Vanta.jsはthree.jsを使った3DなWebGLアニメーションの背景を簡単に作成、設置できるライブラリです。 同ライブラリのプロジェクトサイト内で簡単な編集を、プレビューを確認しながらツールバーの調整...
高速かつシンプルで使いやすいJavaScriptアニメーションライブラリ・「luge」
luge lugeは高速かつシンプルで使いやすいJavaScriptアニメーションライブラリです。プラグインを追加して拡張する事も可能です。 読み込むだけでhtmlタグに自動でデバイスやブラウザのclassも付与されるので異なる...
パララックス効果を簡単に付与できるスクリプト・「simpleParallax.js」
simpleParallax.js simpleParallax.jsはパララックス効果を簡単に付与できるスクリプトです。非依存型のシンプルで軽量なスクリプトで、任意の画像にパララックスアニメーションを簡単に付与する事が出来ます。 ...
非依存型で軽量な使いやすい通知用JavaScriptライブラリ・「Notyf」
Notyf Notyfは非依存型で軽量な使いやすい通知用JavaScriptライブラリです。レスポンシブで、アクセシビリティにも配慮、カスタマイズ性に優れ、非依存なのでReact、Angular、Aurelia、Vue、Svelteな...
ブックマークレットも用意されている、引用文を綺麗に見やすくスタイリングするライブラリ・「Quotebacks」
Quotebacks Quotebacksはブックマークレットやブラウザ拡張も用意されている、引用文を綺麗に見やすく整形するライブラリです。OSSとしてソースコードも公開されています。 以下のように引用と引用元へのリンクとファビ...
ツールチップやポップオーバー、ドロップダウンなどのフローティングエレメントを完全制御する為のJavaScriptライブラリ・「Floating UI」
Floating UI Floating UIはツールチップやポップオーバー、ドロップダウンなどのフローティングエレメントを完全制御する為のJavaScriptライブラリです。 表示位置の調整やスクロールした際の位置調整など、ユ...