ITエンジニア/デザイナ向けにオープンソースを毎日紹介

プログラミング言語 - JavaScriptの記事一覧

プレミアムユーザー限定記事

MOONGIFTプレミアムは、月額500円の有料サービスです。詳細はこちらから

もっと見る

List

  • 2019/09/09

speak.js - eSpeakからポーティングしたテキストtoスピーチ

テキストをコンピュータに喋らせる試みはずっと行われてきました。かつてはまさにコンピュータっぽい音声でしたが、今はSiriやAlexaなど、滑らかで人が喋っているような音声で読み上げできるようになっています。今回紹介するspeak.jsはどちらかと言えばコンピュータ音声です。特徴として、JavaScriptだけで実現して...

List

  • 2019/09/08

pokemonsay - ポケモン版cowsay

世の中には変なコマンドがたくさんありますが、その一つがcowsayではないでしょうか。適当な文字を牛のAAに喋らせることができる、ジョークコマンドです。なかなか使い道が思いつかないですが、人によっては活用していることでしょう。そんな中、より多くの人が使えるかも知れないコマンドがpokemonsayです。## pokem...

List

  • 2019/09/07

Unicopedia Plus - ユニコードや絵文字を調べる開発者用ツール

絵文字の登場によってユニコードが幅広く使われるようになりました。合字によって、肌の色を変えたり、年々絵文字の種類が増えています。また、アジア圏の文字では似ていても微妙に違う文字もあります。そんなユニコードの文字をチェックしたり、調べられるのがUnicopedia Plusです。## Unicopedia Plusの使い...

List

  • 2019/09/07

Back2stackoverflow - stackoverflow翻訳サイトから自動リダイレクトしてくれるユーザスクリプト

stackoverflowに助けられているという開発者は多いと思います。そしてプログラミングの困ったことで検索した時に、Stack Overflowの機械翻訳サイトが表示された経験を持つ方も多いのではないでしょうか。そんな方にお勧めなのがBack2stackoverflowです。stackoverflowの翻訳サイトか...

List

  • 2019/09/05

mc.js - Webブラウザで遊べるMinecraftクローン

Minecraftにハマっている人は大勢います。冒険するのはもちろん、クリエイティブモードで造形を楽しむのも面白いです。デスクトップ、タブレット、スマートフォンと様々なデバイスで遊べるのも魅力的です。今回紹介するmc.jsはWebブラウザ上で遊べるMinecraftクローンです。## mc.jsの使い方まずはユーザ登録...

List

  • 2019/08/31

svg2pdf.js - Webブラウザ上でSVGをPDF化

Webブラウザで表示している内容をPDFにしたいというニーズはよくあります。サーバ側でレンダリングして出力するのも良いですが、何かと面倒です。文字だけであればまだしも、画像をドローイングされた内容をPDF化するのはさらに大変です。そこで使ってみたいのがsvg2pdf.jsです。WebブラウザだけでSVGをPDF化します...

List

  • 2019/08/30

kthoom - Webベースのコミックビューワー

オンライン上にはたくさんのコンテンツがあります。しかし、それらを閲覧するためには専用のビューワーが必要です。ローカルアプリケーション型の場合、コンテンツをいちいちダウンロードするのが面倒です。そこで必要なのがWebベースのリーダーです。今回はコミックビューワーのkthoomを紹介します。## kthoomの使い方メイン...

List

  • 2019/08/30

Regex Colorizer - JavaScriptの正規表現をハイライト

正規表現はプログラマにとっても面倒なもので、間違えることがしばしばあります。プログラミングがエラーになるならまだしも、不具合につながったりすると目も当てられません。そこで使ってみたいのがRegex Colorizerです。正規表現をハイライト表示し、分かりやすく可視化してくれます。## Regex Colorizerの...

List

  • 2019/08/29

ga-cookie-opt-in-js - Google Analyticsのトラッキングを事前同意するサンプル

ヨーロッパでは個人情報に対する規律が厳しく、ちょっとした情報であっても事前同意が必要になります。そのため、ダイアログがしつこく出て面倒というイメージもありますが、それもユーザのプライバシーを守るためには必要な措置でしょう。Google Analyticsによるトラッキングもその一つです。事前同意を取る際に役立つサンプル...

List

  • 2019/08/27

CJSS - CSSベースのWebビューフレームワーク

最近はReact、Vue.jsなど仮想DOMを使ったビューライブラリが人気です。しかし、JavaScript内にHTML情報を埋め込むのでデザイナーの方にとってはちょっと辛いところがありそうです。そこで使ってみたいのがCJSSです。上記ライブラリとは逆で、CSSにHTMLなどの情報を埋め込んでしまうという、すごいライブ...

List

  • 2019/08/26

Responsive-Kifu - レスポンシブ対応の将棋棋譜再生ビューワー

将棋はとても人気のあるゲームです。そして、その記録である棋譜を見ることで試合の流れを研究したり、感動を覚えたりします。そのために作られるのが棋譜プレイヤー、ビューワーです。今回紹介するResponsive-Kifuもそんな棋譜ビューワーですが、Webブラウザ上でレスポンシブに動作するのが特徴です。## Responsi...

List

  • 2019/08/23

pure JS WiFi QR Code Generator - 無線LAN情報を記載したQRコード生成

勉強会などでWiFi情報を載せたり、コワーキングスペースなどでWiFi情報を提示することがあります。あまり複雑なものにすると入力をミスしたり覚えるのが大変なため、安易なものを設定してしまいがちです。そこで使ってみたいのがpure JS WiFi QR Code Generatorです。QRコードから簡単にWiFi情報を...

List

  • 2019/08/21

Github Markdown Reader - GitHubのREADMEビューワー

GitHubでリポジトリを公開する際にはREADMEを書くのが基本です。開発者の多くはMarkdownで書いていることでしょう。GitHub上でもHTMLに整形されたREADMEが読めますが、最適化されているとは言いがたいかも知れません。そこで使ってみたいのがGithub Markdown Readerです。よりREA...

List

  • 2019/08/21

The Pomodoro Dash Timer - ポモドーロのダッシュ法を実践できるタイマーアプリ

ポモドーロテクニックはMOONGIFTで何度も取り上げていますが、25分間の集中と5分間の休憩を繰り返す仕事術になります。トマト(ポモドーロ)のキッチンタイマーを使うところから、その名が付けられています。The Pomodoro Dash Timerはポモドーロテクニックの発展版、ポモドーロのダッシュ法に対応したタイマ...

List

  • 2019/08/20

Udeler - Udemyの動画ダウンローダー

オンラインで学べるコンテンツが多彩に用意されているUdemy。Udemyを使って学んでいるという人も多いのではないでしょうか。コースは購入しますが、学習はオフラインでじっくり行いたいと言う人もいるのではないでしょうか。そんな方にお勧めなのがUdelerです。Udemy専用のダウンロードソフトウェアです。## Udele...

List

  • 2019/08/19

Celody - 音楽をフォーク、マージするマッシュアッププラットフォーム

Web APIを組み合わせて新しい作品を作る、マッシュアップという言葉は元々は音楽用語です。つまりクラブなどでかかる音楽のようなアレンジ、マッシュアップは音楽業界が本流でさえあります。今回紹介するCelodyは音楽をWebブラウザ上でフォークし、カスタマイズできるサービスです。## Celodyの使い方様々な楽曲を再生...

List

  • 2019/08/18

Diablo 1 for web browsers! - あの名作Diablo 1をWebブラウザで遊ぶ

今なお傑作として知られるゲーム、Diablo。その影響を受けて作られたゲームは枚挙に暇がないでしょう。97年に作られ、2008には3が販売されています。ゲームがどんどん発展していく中にあってなお、Diablo 1が好きな人は多いはずです。そんなDiablo 1をWebブラウザの中で遊べるのがDiablo 1 for w...

List

  • 2019/08/17

console.chat - 開発者ツール上のチャット

開発者ツールは開発者以外の方には用のないツールでしょう。逆に開発者はデバッグ以外の目的でも利用しており、APIについて調べたり、予定なDOMを消したり、ユーザスクリプト的に使っていたりします。そんな開発者ツールを使った密かな遊びとしてconsole.chatを紹介します。名前の通り、開発者ツール上でチャットをします。#...

List

  • 2019/08/16

Outline - チームで活用するWiki&ナレッジベース

Wikiは年々進化しています。新しいニーズを取り込み、さらに既存のソフトウェアの中にWiki風の機能が追加されて生き残っています。特にオンラインでノートを取ったりするのが当たり前になっている現在、Wikiも自然と使われるようになっています。今回はそんな最新のWikiエンジンとしてOutlineを紹介します。UIがイケて...

List

  • 2019/08/16

OverVue - Vue開発で役立つプロトタイピングツール

Vueの人気が高まっています。HTMLとJavaScriptが分かれるので、分業しやすいのも利点でしょう。しかし、それでもプログラマーでないと最適な構造で画面を作っていくのは簡単ではありません。そこで使ってみたいのがOverVueです。画像を元にして画面を設計できるソフトウェアです。## OverVueの使い方立ち上げ...