プログラミング言語 - JavaScriptの記事一覧
Copenhagen - 高機能なWeb埋め込み型プログラミングエディタ
Web上でユーザにコードを書いてもらう機能を用意するとします。その際、ただのテキストエリアを配置するのは良くありません。ハイライトもありませんし、Tabキーを押すと別なコントロールにフォーカスが移動したとしたら、使う気も失せてしまいます。Webページに埋め込める高機能なエディタが欲しければ、Copenhagenの利用を...
Prismarine Web Client - ブラウザで動くマインクラフトクライアント
マインクラフトは面白いゲームですが、専用クライアントソフトウェアをインストールしないといけないのが面倒です。最初の一歩はインストール不要で軽く体験できると手軽になるでしょう。そこで使ってみたいのがPrismarine Web Clientです。マインクラフトをWebブラウザだけで遊べるようになります。## Prisma...
Sorted CSS Colors - 関連する色合いを提案
デザインで色を選択する際、関連し合う色を選ぶことで全体のバランスを崩さずに済みます。しかし一つ一つの色を選んでいると時間がかかってしまうでしょう。ある程度自動的に選択してくれると便利です。今回はそんな関連した色を選択するのに便利なSorted CSS Colorsを紹介します。## Sorted CSS Colorsの...
MyDrive - Google DriveクローンなWebファイル管理
Google Driveを使っている人は多いです。ファイルが見やすく、検索しやすいので使い勝手が良いでしょう。それに対して独自でストレージサービスを作る場合、使い勝手の悪いUIになりがちです。そんな時に使ってみたいのがMyDriveです。Google Driveクローンとして開発されているオンラインストレージです。##...
Appo Music - Apple Music for Webクローン
Webブラウザで何でも実行できるようになると、PC側の負担は小さくなります。ストレージも不要になりますし、負荷の高い計算処理はサーバサイドに任せれば良いでしょう。今回紹介するAppo MusicはApple Music for WebのUIを再現したソフトウェアになります。## Appo Musicの使い方トップページ...
いま世界で寝ているのは何%？ - 世界中で最も寝ている人が多いのは何時でしょう
地球は自転しており、各地域には時差があります。今自分たちが昼であっても、夜の地域があったり、起床したばかりという人もいます。コロナ禍にあってオンラインミーティングが当たり前になると、特に時差を意識することになります。そんな世界にあって、今世界で寝ている人たちがどれくらいいるのか、それを計算してくれるのがいま世界で寝てい...
floccus bookmarks sync - 異なるWebブラウザ間でブックマークを同期
Webブラウザにはブックマーク機能があります。それは大抵ローカル上に保存されますが、Google Chromeのようにマシン間で同期できるものもあります。しかし、これらは個々のブラウザ特有のもので、異なるブラウザ間では共有できません。そこで使ってみたいのがfloccus bookmarks syncです。Webブラウザ...
RegEx Crossword - 正規表現を駆使するクロスワードパズル
クロスワードパズルは世界中で楽しまれているパズルです。縦の列、横の列に対してヒントが提示されており、矛盾しないように文字を埋めていけば完成です。誰でも楽しめるパズルです。今回紹介するRegEx Crosswordはひと味違います。これを楽しめるのは開発者に限定されることでしょう。## RegEx Crosswordの使...
Local PDF - クライアントサイドでPDFをマージ
Webアプリケーションは便利ですが、サーバサイドで動く際には常にセキュリティに注意が必要です。一旦サーバに送られたデータは消されているかは分からず、容易にアップロードはできません。しかしローカルでのみ動作するWebアプリケーションなら安心して利用できます。今回紹介するLocal PDFはローカルでのみ動作するWebアプ...
CSS Windows 10 - Windows 10風のUIをCSSで再現
WebはもはやOSといっても過言ではありません。多くのアプリケーションが動作し、情報が保存されています。しかしOSとは雰囲気が異なるので、使い方も大きく違います。垣根を越えるためにはOS風のUIが必要です。そんな可能性が感じさせてくれるのがCSS Windows 10です。Windows 10風のUIをCSS/HTML...
8x8DotJPFont - Arduboy用の日本語表示ライブラリ
IoTの盛り上がりによって、多種多様なマイコンが開発されました。その一つがArduboyです。ゲームボーイ風の見た目ですが、大きさはクレジットカードくらいです。自作のゲームを開発して、Arduboyでロードできます。そんなゲームの中で日本語を使いたいと思ったら8x8DotJPFontを利用しましょう。## 8x8Dot...
Taro - 軽量なWeb 3Dゲームエンジン
3Dゲームを一から作るのはとても大変です。何らかのフレームワークを利用するのが良いでしょう。スマートフォンアプリなどであればUnityやUnreal Engineといった選択肢があります。Web用の3DライブラリとしてはThree.jsが知られていますが、それをゲームエンジンとして活用しているのがTaroです。## T...
ZerangYab - 相互フォローしていない人を確認できるブラウザ機能拡張
Twitterで相互に繋がっていると思ったら、いつの間にかフォローを切られていることがあります。そのままでも良いのですが、何となくもやっとします。一方的に慕っているならともかく、そうでないなら相互フォローしてこそ意味があるというものでしょう。今回紹介するZerangYabはTwitterのフォロー状態をチェックして、片...
Web-minecraft - Webブラウザ用のMinecraftクライアント
Minecraftを遊ぶ場合、デスクトップアプリケーションやスマートフォン、タブレットアプリをインストールします。しかしインストールするのが手間だったり、業務用PCで自由にインストールできない環境という人もいるでしょう。そんな方に使ってみて欲しいのがWeb-minecraftです。Webブラウザで動作するMinecra...
Counter - プライバシーを重視したWebアクセス解析
Webアクセスの解析と言えばGoogleアナリティクスが有名です。しかし最近ではプライバシーを懸念する声もあり、自分の情報をトラッキングされることを嫌がる人も多くなっています。ただシンプルにWebサイトの利用状態を知りたい、そんな時にはCounterを使ってみるのはいかがでしょう。## Counterの使い方ダッシュボ...
Lowdefy - YAMLでWebアプリケーションを作るローコードプラットフォーム
最近はノーコードやローコードといったツールが人気です。いわゆるシチズンデベロッパーと呼ばれる、コーディングを生業としていない人であってもソフトウェアを開発できます。今回紹介するLowdefyはそんなローコードツールの一つです。YAMLファイルを記述することでアプリケーションを開発できます。## Lowdefyの使い方お...
Browser Image Compression - Webブラウザで画像サイズを軽減
Webサービスでユーザに画像をアップロードしてもらう機能を付けることは良くあります。最近ではスマートフォンカメラの解像度が上がり、ファイルサイズも大きくなっています。プロフィールアイコンのために数MBのアップロードをしてもらうのはサービス、ユーザ双方にとって負担です。そこで使ってみたいのがBrowser Image C...
Telestrator - プレゼンに。数秒で消えるスクリーンドローイング
プレゼンテーションをしていたり、オンライン配信を行っている時に画面上に説明を加えたいと思うことがあります。ボタンを目立たせたり、見て欲しい部分を囲んだりといった具合です。そんな時に使えるのがTelestratorです。画面上で自由にドローできます。## Telestratorの使い方画面左側にツールバーが出ます。普段は...
Isepic Chess UI - チェスの棋譜プレイヤー
チェスは海外で人気のあるゲームです。AIが発展してなお、人同士が競う楽しさは色褪せません。自分でプレイするだけでなく、有名な人たちの棋譜を見てワクワクしたり、新しい知見を得たりするのも楽しさの一つです。今回紹介するIsepic Chess UIはisepic-chess.jsに対応した棋譜を表示するUIです。## Is...
v86 - Webブラウザでx86をシミュレーション
Webブラウザで各種OSを実行するような試みが多数あります。それっぽいUIにしているだけというものもあれば、一つのOSについて忠実に再現しようとしているものもあります。古いOSであれば、現状のWebブラウザでも十分に使い物になる速度で動作していたりします。今回紹介するv86のアプローチはもっと広く、x86をWebブラウ...