Javascript
-
ScrollyVideo.js - ブラウザのスクロールと動画ファイルを簡単に同期できるライブラリ
ScrollyVideo.js は、ブラウザの画面効果のためのライブラリで、mp4 で置いた動画ファイルをページのスクロールと連動してくれます。 と、言葉で書いても伝わってる気がしません。ScrollyVideo.js のサイトで見るのが一番わかりやすいと思います。 このデモでは、サンフランシスコのゴールデン・ゲート橋をドローンで空撮した mp4 ファイルが使われています。ページを下にスクロールし …
-
Facitars! - アバターアイコン生成ライブラリ
Facitars! は、一定のトーンに沿った形で与えたシードからランダムなアバターアイコンを生成してくれるライブラリです。 Facitars! のサンプルコードで生成したランダムなアバター群 アカウント名やメールアドレスをシードにすることで、他のユーザーと形や色が同じにならないユニークなアイコンをユーザーごとに自動で作れるため、会員登録制のwebサービスのデフォルトアイコンなどに使えそうです。 …
-
Google表計算でWordle
本日のWordleクローンは、Google Spreadsheets で動く Wordle。 入力こそ左外側のセルですが(下段のキーボードは入力済のキーを示す役割のみ)、5文字の単語を入れるとsubmitボタンが現れ、ボタンを押すと数秒で正解判定が返ってきます。 正答を得てもSNS共有用のダイアログは出ません。そこは本家と違うところですが。 ゲーム画面の"PLAY"とは別のシー …
-
地図表示ライブラリ Leaflet がウクライナ支援を呼びかけ
OpenStreetMap を使ってウェブサイトに地図を表示できる JavaScript ライブラリ Leaflet のトップページがいつもと違う掲示になっています。 通常のドキュメントやダウンロード、プラグイン情報などはこちらに退避され、トップページ全面にてウクライナ支援に関する作者/メンテナー一同の意見表示が行われています。 Leaflet の作者はウクライナ・キエフ市民のウラジミル・アガフォ …
-
Game of Codes - プログラミングツールやライブラリの勢力を表した架空の世界地図
Game of Codes は、プログラミング技術の人気度を基に勢力争いを架空の地図に表すというプロジェクトです。 フロントエンドJavaScriptライブラリ2021の勢力地図(クリックでオリジナルを表示)がこれ。 React が帝国であるのに対し、Angular, Vue, jQuery が王国、Svelte が公国なのは「規模感」だそうなので、国名はデータからプログラムが決めているわけではな …
-
Checkboxland - HTMLのチェックボックスですべてを作れるライブラリ
Checkboxland は、HTML のチェックボックス要素を活用してしまくるための JavaScriptライブラリです。 HTML のチェックボックス要素と言えばこれ↓ ですが、 このチェックボックスを使って様々な表現を実行できます。 デモでは、文字が横に流れるマーキー、デジタル時計、アニメーション、QRコード表示、ライフゲーム、動画再生(!)、など様々な表現が、すべてチェックボックスだけで実 …
-
'-' という名前の、中身が無いのに70万回ダウンロードされてる謎のnpmパッケージ
- という名前の JavaScript/TypeScript パッケージについて警告を発している記事が話題となっています。 このパッケージ、中身はほとんど空で、Readme と、dev で TypeScript を動かせるようにするライブラリ群を呼ぶ箇所だけのもの。 しかし、この “-” を使っている他の npm パッケージが 50個以上あり、約一年前の公開時からのトータル …
