プログラミング言語 - JavaScriptの記事一覧
Party Bingo! - Webブラウザでビンゴを楽しもう
ビンゴ大会などで、数字をランダムに表示したいと思うことはないでしょうか。ビンゴに限らず、参加者の中から当選者を決めたいという時もあるでしょう。それを画面上に大きく表示すれば、会場は盛り上がるはずです。今回紹介するParty Bingo!は名前の通り、ビンゴを実現するためのWebアプリケーションになります。## Part...
Spacekit - 太陽系の動きを3Dで表現
宇宙に憧れる人は大勢います。宇宙を知れば知るほど、自分の存在が小さなものだと思い知ります。また、地球以外には移住もできず、まだ月にしか足を踏み入れていない現状が未来を感じさせます。そんな宇宙の様子を3Dで表現するのがSpacekitです。## Spacekitの使い方各惑星は線の上を動きます。!
Responsive Viewer - レスポンシブWebデザインをまとめて確認
レスポンシブなWebデザインが当たり前になっており、その表示確認が大変になっています。Webブラウザの幅を変えたり、スマートフォンやタブレットでの表示を確認したりしている方は多いでしょう。そうした手間を減らせそうなのがResponsive Viewerです。一気に複数デバイスでの表示を確認できます。## Respons...
Slack Disable WYSIWYG Bookmarklet - Slackの入力フォームを以前のものに戻す
Slackでは最近、入力フォームにWYSIWYGなツールバーが追加されました。ITに詳しくない人であれば便利だと思いますが、逆にITリテラシーが高い人にすれば、以前のように記法を使う方が簡単だったでしょう。そんな方に使ってみて欲しいのがSlack Disable WYSIWYG Bookmarkletです。WYSIWY...
YouTransfer.io - シンプルで簡単なファイルアップローダー
ファイルを相手に送る際にどんな手段を使っていますか。チャット、メール、AirDropなど多彩な方法がありますが、アップローダー経由というのがよくあるものになるでしょう。今回紹介するYouTransfer.ioは自分で立てられるシンプルなアップローダーです。## YouTransfer.ioの使い方メイン画面です。ここに...
Kung Fu Chess - ターン制を止めたチェス
すでに慣れたゲームも、本の少しルールを変えるだけで遊び方が大幅に変わる可能性があります。協力プレイで遊ぶはずのゲームで、お互いに邪魔しあった方が盛り上がるのはその典型といえるでしょう。今回紹介するKung Fu Chessはチェスゲームですが、ターン制という部分を破壊したゲームとなっています。## Kung Fu Ch...
Painterro - Webブラウザで簡易画像編集
画像のちょっとした加工でPhotoshopを立ち上げたり、専門のソフトウェアを購入したりするのは嫌だと思っている方は多いはず。最近では些細な修正であればWebベースでも行えるようになっています。今回紹介するPainterroはWebベースの画像編集ソフトウェアです。スクリーンショットにちょっとした注記を入れる程度であれ...
drawthe.net - Visioに頼らず綺麗なネットワーク構成図を手に入れる
開発者であれなネットワーク構成図を書く機会があるかと思います。そんな時、ドローツールを使うとメンテナンスが面倒だったり、変更時の差分確認もできず、徐々に運用が煩雑になっていきます。そこで使ってみたいのがdrawthe.netです。テキストから詳細なネットワーク構成を生成してくれるドローツールです。## drawthe....
Openki - 学ぼう、教えよう
開発者では昔から教え、教えられる文化があります。一つの技術を深く探求することも、新しい技術を学ぶこともできます。その文化によってオープンソースやコミュニティ文化が成り立っているといえるでしょう。今回紹介するOpenkiはそんな教え、教えられる人たちのためのサービスです。## Openkiの使い方基本は学びたいことを探す...
ReadTweetDeck - TweetDeckの新着ツイートを音声読み上げ
TweetDeckを使えば多くのツイートが一気に見られます。一日中見ていても飽きないかも知れませんが、それでは仕事になりません。しかし新しいツイートが来たら知りたい、そんなツイ廃な人もいるでしょう。そんな方にお勧めなGoogle Chrome機能拡張がReadTweetDeckです。## ReadTweetDeckの使...
Quiet.js - 音を使ってデータを送受信
コンピュータから別なコンピュータに情報を伝える際には何か使うでしょうか。物理（USBメモリなど）とネットワークでいえば、最近はネットワーク利用が多いでしょう。そのネットワークにはインターネット、LAN、Bluetoothなど多彩な選択肢があります。今回紹介するQuiet.jsは物理でもネットワークもありません。なんと音...
lite-youtube - YouTube動画の軽量埋め込み表示
YouTubeの動画埋め込み表示機能は便利で使っている人も多いかと思います。しかし、あの埋め込み表示は動作が重たく、あまり大量に埋め込むとWebブラウザの負荷が高くなります。そこで使いたいのがlite-youtubeです。標準のツールに比べて圧倒的に軽快に動作します。## lite-youtubeの使い方lite-yo...
Mark Text - シンプル、エレガントなMarkdownエディタ
Markdownエディタは多数あります。多くはエディタとプレビューが左右に表示されます。しかしMarkdownに慣れていないと、書いている記法が結果としてどう表示されるのか推測が難しいでしょう。そこで使ってみたいのがMark Textです。インラインで記法が反映されるMarkdownエディタです。## Mark Tex...
Paged.js - Webページを電子書籍風に表示するCSS Paged MediaのPolyfill
Webページでテキストコンテンツを書籍のように楽しめるようにする、そのための仕様がCSS Paged Mediaです。まだ仕様が固まっていませんが、標準化されればコンテンツの楽しみ方がまた変わってくるでしょう。いち早くCSS Paged Mediaを体験したい方はPaged.jsを使ってみましょう。## Paged.j...
Fake Operating System - OS風機能を提供するWebコンポーネント
Webコンポーネントを使うことで、限られた機能をHTMLのタグ一つで使えるようになります。いわばプラグイン的な使い方であったり、UIコンポーネントとしてまとまった機能を手軽に利用できます。多くのWebコンポーネントはごく小さな機能なのですが、今回のFake Operating SystemはWebコンポーネントながら、...
Fractal Fantasy - WebGLを使った芸術的表現
Webブラウザの表現力は年々増しています。特にCanvasやWebGLによって、表現できる幅が大きく広がりました。使いこなすのは簡単ではありませんが、これまでのWebとは一線を画す表現が可能になります。今回紹介するFractal FantasyはそんなWebGLを使った多彩な表現を集めたソフトウェアです。極めればここま...
Google Calendar event link generator - Googleカレンダーに予定を登録するリンクを生成
Googleカレンダーを自分のスケジュール管理に使っている人は多いかと思います。そして、Webサービス提供側としても日程情報が決まったら、それをGoogleカレンダーに登録するリンクを表示したいと思うことでしょう。今回紹介するGoogle Calendar event link generatorはまさにその目的にぴっ...
MEGAMOJI - Slack用のアニメーションする絵文字を作成
Slackでは絵文字をリアクションやメッセージに含めることができます。そして、それらの絵文字はカスタマイズが可能で、自作した絵文字をアップロードしている人も多いでしょう。今回紹介するMEGAMOJIはSlack用の絵文字を簡単に自作できるWebアプリケーションです。## MEGAMOJIの使い方テキスト、または画像をベ...
aimAndShoot - 学習するタンクゲーム
AIや機械学習によって、様々なゲームがコンピュータの手に落ちています。最近では麻雀でさえ強力なプレイヤーが登場してきました。人の思考という揺らぎさえも凌駕するAIの存在は怖いものがあります。そんな中注目したいのがaimAndShootです。タンクゲームのようになっていますが、ニューロベースの進化をする仕組みが組み込まれ...
Listly - あなたのリストを一カ所に
普段の生活の多くはリストで管理されます。Todoはもちろん、プロジェクトにおけるタスク管理、買い物メモなどリストで管理して、それを消し込んでいく作業がなんと多いことでしょう。そこで紹介したいのがListlyです。何でもリストとして登録できるWebアプリケーションです。## Listlyの使い方最初の画面です。まだ何もあ...