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

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

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

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

もっと見る

List

  • 2018/02/17

BootLeaf - Bootstrap/Leafletを使った地図テンプレート

地図とWebは相性が良いです。移動中に地図を見たいと思うことは多いですし、旅行や出張前に計画を立てる上でも地図が必要です。それもあり、Googleマップをマッシュアップする地図サービスは無数に存在します。今回紹介するBootLeafはそんな地図マッシュアップのベースになるようなソフトウェアです。様々な情報を地図に載せや...

List

  • 2018/02/16

GitHub Pull Request Tree - GitHubのPRを確認しやすく

GitHubのPull Request(以下PR)はオープンソースとして外部の方に開発へ参加してもらうのに良い仕組みです。企業においてはチーム開発を支える大切な技術です。しかし大きなソフトウェアになると、PRがどのファイルを指しているのか分かりづらくなります。特にフォルダで区別してファイル名は同じものが並んでいる時など...

List

  • 2018/02/15

SQLECTRON - MySQL/PostgreSQLに対応したターミナル用データベースクライアント

WebであればphpMyAdminやphpPgAdminといったデータベース管理が使われることが多いですが、ターミナルの場合はどうでしょう。それぞれ別なクライアントソフトウェアを使って、独自のコマンドも覚えないといけません。そこで使ってみたいのがSQLECTRONです。MySQL/PostgreSQLに対応したシンプル...

List

  • 2018/02/14

WildDuck - Gmailのデザインを模したWebメーラー

Webブラウザが多機能になるにつれて、多くのアプリケーションがWeb化しています。その先進とも言えるのがWebメーラーではないかと思います。元々Webブラウザ向けにメール機能を提供するサービスは多かったですが、Gmailによって爆発的に広がっています。そんなWebメーラーの最新版がWildDuckです。Gmailのデザ...

List

  • 2018/02/13

DepthKit.js - 奥行きをもった動画を再生

従来のコンピュータでは平面の情報を取り扱うだけでしたが、最近では奥行きを数値化するのがトレンドです。それによってARやVR、MRといった分野に活かされたり、3Dがより本格的に楽しめるようになります。そんな奥行きを計測するデモを紹介します。Three.jsと組み合わせたDepthKit.jsです。## DepthKit....

List

  • 2018/02/10

Kuker - React/Angular/Vue開発用デバッガー

最近のフロントエンド界隈でのトレンドはVirtualDOMです。これまで苦労してきたDOMのステータス変更を気にすることなく、サーバサイドのようにレンダリングできるようになる技術です。しかし、その結果として通常のJavaScriptよりもデバッグしづらくなっています。そこで使ってみて欲しいのがKukerです。各種Vir...

List

  • 2018/02/10

Analog Film Emulator - フィルムで撮影したような写真に加工

西洋の風景画が廃れた原因の一つにカメラがあります。ただ目の前の情景をそのまま写し取るのであれば、カメラの方が正確です。さらにそんなカメラでもフィルム式は廃られており、枚数がほぼ無制限なデジタルに移り変わっています。とは言え、今なおフィルムの味のある撮れ方が好きという方はたくさんいます。そうした方に触れてみて欲しいのがA...

List

  • 2018/02/09

mono-wasm - C#から WebAssemblyを作る

WebAssemblyを記述できるのはC/C++/Rustだけだと思っていないでしょうか。実はLLVMにさえなれば、他の言語でも記述できます。そのため、やろうと思えばSwiftから作ることもできるそうです。そこで注目したいのがmono-wasmです。Monoを使ってC#で記述された内容を WebAssembly にする...

List

  • 2018/02/03

jspaint - 懐かしのペイントをWebアプリケーション化

昔のソフトウェアであっても、別な言語や別な環境で実行できると新しい魅力に出会うことがあります。最近であれば、ローカルOSで動いていたソフトウェアをWebアプリケーション化するだけでも面白いです。今回はWindowsではお馴染みのペイントをWebアプリケーション化したjspaintを紹介します。## jspaintの使い...

None

  • 2018/02/03

detect-es - ESnextのコード有無をチェック

旧来のJavaScriptは変数のスコープに問題があったり、クラスをサポートしていないなど大きなWebアプリケーションを作るには不向きな言語でした。しかし現在はPromiseやクラス、Proxyなど多彩な機能が追加されています。これらはESnextと呼ばれる仕様で、すべてのWebブラウザで間違いなく使える訳ではありませ...

List

  • 2018/02/01

mind - node/JavaScript製のニューラルネットワークライブラリ

ディープラーニングはここ数年人気の高い技術ですが、技術の基礎は理解しつつもそれをコードレベルで表現するのはとても難しいでしょう。そして、そのためのライブラリは多数出てきています。もしWebブラウザ上で手軽に試したいのであればmindを使ってみてください。## mindの使い方こちらはデモです。映画を10本、レーティング...

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