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

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

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

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

もっと見る

List

  • 2018/02/01

Eel - PythonによるElectron代替

Electron代替になるソフトウェアが幾つも出てきています。Goであればgo-astilectron

List

  • 2018/01/31

兎亜 - 小さなウィンドウで使いやすい音楽プレイヤー

スマートフォンで音楽を聴くようになって、デスクトップではあまり聴かなくなっています。しかもiTunesの重たいUIで聴くのは面倒ですし、音楽ファイルの登録もしていません。もっと軽くて手軽に使えるMP3プレイヤーが必要です。そこで使ってみたいのが兎亜です。MP3の入ったフォルダを指定するだけで簡単に使えます。## 兎亜の...

None

  • 2018/01/30

clasp - ローカルでGoogle Apps Scriptを開発

Google Apps Scriptを使えばGoogleスプレッドシートであったり、スライドなどを自動操作できる仕組みが作れます。さらにWeb APIもあり、外部からデータをウケたり、送信することも可能です。そんなGoogle Apps Scriptをローカルで作成できるのがclaspです。## claspの使い方`c...

List

  • 2018/01/28

sorting.js - 各種ソートアルゴリズムを可視化

プログラミングでよく使うソートですが、アルゴリズムは多種多様に存在します。どれがベストという訳ではなく、データの種類やばらつきによって異なるようです。しかし実際にどういった動きをしているのかは外からでは分かりづらいでしょう。そこで使ってみたいのがsorting.jsです。各種ソートアルゴリズムをビジュアル化してくれるソ...

List

  • 2018/01/27

Turndown - HTMLをMarkdown記法に変換

Markdownで作られたコンテンツが増えていくと、すでに作成したコンテンツについてもMarkdownにしたくなるものです。また、自分で使っていた記法が廃れてしまうこともあるでしょう。その結果、Markdownへの乗り換えを余儀なくされます。そうした時に使いたいのがTurndownです。HTMLをMarkdownに変換...

List

  • 2018/01/25

canvas-area - Canvasの表示内容をマウスで操作

CanvasはHTML5においてWebの表現力を飛躍的に高めてくれるAPIですが、その使い方に慣れるまでが意外と面倒なものに感じます。通常のDOMのようにスタイル設定ですぐに表示を変化できるのではなく、描画した内容をリフレッシュしながら使わなければなりません。そんなCanvasに柔軟性を持たせてくれそうなライブラリがc...

List

  • 2018/01/24

STYLE2PAINTS - AIによるイラストの自動彩色

ディープラーニングや人工知能によって、これまでのアルゴリズムベースの機械処理から、学習効果を活かした処理ができるようになっています。その結果、人が判断することなく、機械がベストと思われる判断によって処理できるようになります。今回紹介するSTYLE2PAINTSは線画の色づけをAIによって自動化する、そんなすごいソフトウ...

List

  • 2018/01/24

Lite Editor - とてもシンプルなWYSIWYGエディタ

Web上でユーザにコンテンツを作ってもらう場合に便利なのがWYSIWYGエディタですが、あまり多機能なものはユーザを混乱させてしまうだけです。本当に必要なものだけに絞り込むのがいいでしょう。今回紹介するLite Editorは、本当にごく簡単な機能だけに絞り込んだWYSIWYGエディタになります。## Lite Edi...

List

  • 2018/01/23

BuckleScript - OCamlをJavaScriptに変換

Webブラウザ向けには現状、JavaScriptでプログラミングを行う必要があります。しかし多くの言語において、JavaScriptに変換できる実装が存在します。RubyであればOpal

List

  • 2018/01/23

Yogurt - React製のドキュメント作成システム

Web上でコンテンツを作る際のUIについて悩むことはないでしょうか。一ページずつ作る仕組みにするのがシンプルですが、ユーザにとって使いやすい仕組みとは言いづらいです。そこで参考にしたいのがYogurtです。Reactを使い、ユーザビリティの高いドキュメント作成が可能です。## Yogurtの使い方編集画面です。カテゴリ...

List

  • 2018/01/22

TOAST UI Editor - WYSIWYGとMarkdown両方をサポートしたWebエディタ

開発者にとってMarkdownは便利な記法ですが、それ以外の人たちにとってはルールを覚えなければならず、面倒に感じられてしまいます。かといってWYSIWYGなツールバーを設けると開発者が邪魔に感じてしまうでしょう。そこで使ってみたいのがTOAST UI Editorです。MarkdownとWYSIWYGを切り替えられる...

List

  • 2018/01/21

Dwitter - 140文字以下で作るデジタルアート

昔はハードウェアリソースが足らず、何とか小さなサイズに納めようとコードを短縮するようなことがありました。今はリソースが潤沢であり、そんな心配は不要になっているのですが、それでもコードの短さにこだわる人たちがいます。今回紹介するDwitterはTwitterに書き込める、140文字の長さでグラフィカルなプログラミングを行...

List

  • 2018/01/19

Caprine - エレガントなFacebookメッセンジャー用デスクトップアプリ

LINE、Facebook、WhatsAppなど各社がメッセンジャーアプリをリリースしています。コミュニケーションの基盤となる分、クライアントアプリの使いやすさにはこだわる必要があるでしょう。今回は非公式のFacebookメッセンジャーアプリ、Caprineを紹介します。## Caprineの使い方メイン画面です。類似...

List

  • 2018/01/19

WebGL Scroll Spiral - WebGLとスクロールを組み合わせたデジタル作品

WebGLは普段使っているJavaScriptではなく、OpenGLに近いものになります。そのため、自分のやりたいことを実現するために覚えるべきことがたくさんあります。しかしゲームなどでも使える技術なので覚える価値があるでしょう。そんなWebGLとWebブラウザのスクロールを組み合わせた作品がWebGL Scroll ...

List

  • 2018/01/18

Chrome Registry Jumper - Google Chromeからレジストリへ一発ジャンプ

Windowsをカスタマイズする上で欠かせないのがレジストリです。レジストリ変更を行ってくれるユーティリティもありますが、細かい設定は自分で行う必要があります。そうした情報はオンライン上にたくさんあるでしょう。しかしレジストリのパスが書いてあったとして、それをいちいちレジストリエディタで階層を辿らないといけないのは不便...

List

  • 2018/01/16

Via.js - Web WorkerでもDOMを利用可能に

JavaScriptはシングルスレッドなので、重たい処理を実行するとWebブラウザが固まってしまいます。それを防ぐため、Web Workerというバックグラウンドで処理を実行するAPIがあります。しかしWeb WorkerではDOM操作ができないという欠点があります。それを解決してくれるのがVia.jsです。## Vi...

List

  • 2018/01/15

backgammon.js - Web上でバックギャモンを遊ぼう

バックギャモンというゲームはやったことはないのですが、ルールとしては相手の陣地に自軍の駒をすべてゴールへ移動させたら勝ちと言ったものです。サイコロを使うので運の要素も強いですが、戦略性も持っています。そんなバックギャモンをWeb上で遊べるようにするライブラリがbackgammon.jsです。## backgammon....

List

  • 2018/01/14

Colored Eraser - 色毎に消せるペイントアプリ

ペイントアプリでよくある問題として、書くのは簡単でも消すのが難しいということです。特に一部について消したいと思っても、消しゴム機能で余計な部分まで手を付けてしまいます。そこでよく使うのがレイヤー機能ですが、これは開発者でない方にとっては扱うのが難しいものです。そこで参考にしたいのがColored Eraserです。特定...

List

  • 2018/01/13

caretposition.js - テキストエリアの文字入力位置を取得

最近、テキストエリアを拡張するようなライブラリが増えています。その一つに入力補完機能が挙げられます。IDEではよく見られる機能ですが、入力箇所(キャレット)を正しく取得しないと、逆に文字入力を妨げることになるでしょう。そこで使ってみたいのがcaretposition.jsです。テキストエリアにおけるキャレットの位置をX...

None

  • 2018/01/12

domain-cli - ドメイン調査用コマンド

新しいサービスを立ち上げるときにはドメイン名を調べますよね。多くのドメインは取られてしまっているので、色々なキーワードを使って調べることになると思います。domain-cliはそんなドメインを調べる作業を簡素化できるCLIコマンドです。## domain-cliの使い方domain-cliは引数ではなく、対話的にドメイ...