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

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

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

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

もっと見る

List

  • 2017/02/25

LHTML - Zip圧縮するだけ。Web技術で作るローカルアプリケーション

Webアプリケーションでできることは増えていますが、それでもローカルのファイルシステムに触れたりすることはできません。Web技術でそういった問題を解決するものとしてElectronが知られていますが、できあがるバイナリサイズが大きかったりするのが難点です。そこで使ってみたいのがLHTMLです。ごく簡単にローカルで動くW...

List

  • 2017/02/25

Path Graph - レイトレーシングをビジュアル化

レイトレーシングは波の線(伝播経路)を追跡することで、ある点において観測される画像・音像などをシミュレートする計算手法になります(via レイトレーシング - Wikipedia

List

  • 2017/02/23

DownGit - GitHubのダウンロードリンクを生成

GitHubではmasterブランチなどをZipファイルでダウンロードできます。しかしそのためにはClone or downloadをクリックしてDownload Zipをクリックするといった具合に操作が面倒だったりします。そこで使ってみたいのがDownGitです。Zipダウンロードするためのリンクを生成してくれます。...

List

  • 2017/02/22

I-Miss-You - 非アクティブになるとタイトル、お気に入りアイコンを変更

タブをたくさん開くのが当たり前になると、URLを開いたものの全然見ていないタブも出てくるかも知れません。サービス提供側としてみれば、なるだけWebサイトを見て欲しいと思うわけで、どうにかユーザにアピールしたいでしょう。そこで使ってみたいのがI-Miss-Youです。ユーザが見ていない時にこそ使われるjQueryプラグイ...

List

  • 2017/02/21

Citii - 各都市で生活するにはどれくらいお金がかかるのか、が分かるアプリケーション

海外で暮らしてみたいというのは島国の日本ならではの夢かも知れません。海外には海外の良さがありますが、もちろん悪いところもあります。まず現状と同等の生活を送れるのかをチェックしなければなりません。そこで使えるのがCitiiです。各国の生活コストがどれくらいなのか分かるソフトウェアです。## Citiiの使い方例えば東京で...

List

  • 2017/02/20

Playlister - YouTube動画でプレイリストを作成&共有

YouTube上にはたくさんの音楽動画が揃っています。殆どのアーティストがMVをYouTube上にアップし、新譜も期間限定でアップロードします。音楽だけよりは若干使い勝手が悪いですが、高速なインターネットがある環境であれば十分でしょう。そんなYouTube上の音楽をプレイリスト化し、みんなでシェアできるのがPlayli...

List

  • 2017/02/20

Turbo Download Manager - マルチスレッドでダウンロードを高速化

オンライン上で扱うファイルの容量はどんどん増えています。一つのファイルで数GBなんてこともざらにあります。ダウンロードを高速化するためにTorrentのような仕組みもありますが、企業内では使えないことが多いでしょう。そこで使ってみたいのがTurbo Download Managerです。マルチスレッドでダウンロードを高...

List

  • 2017/02/19

AirSlide - Webでスライド操作を共有

プロジェクターが暗かったり、そもそもなかったりすると小さなラップトップの画面を全員で共有することになります。これでは見る方に集中しなければならず、良い会議になりません。資料は各自で見られる方が便利です。そこで使ってみたいのがAirSlideです。Webブラウザでスライドを共有し、さらに操作もオーナー側でできるソフトウェ...

List

  • 2017/02/18

Codebox - デスクトップとクラウドで動作するIDE

開発を効率的に進める上でIDEの存在は欠かせません。スクリプト言語の多くはプログラミングエディタで作成しますが、それでも自動補完やエラーチェックなどの機能があると開発がスムーズになるでしょう。今回紹介するCodeboxはデスクトップまたはクラウドで動作する想定のIDEになります。## Codeboxの使い方ディレクトリ...

List

  • 2017/02/17

mediacenterjs - Webベースのメディアセンター

使ってみると意外と便利なのがメディアセンターです。ローカルやネットワーク内にある動画、音楽ファイルなどを一箇所で管理でき、スマートフォンなどから操作して音楽や映画を楽しめるようになります。そんなメディアセンターをWebベースで提供するのがmediacenterjsです。## mediacenterjsの使い方セットアッ...

List

  • 2017/02/16

Spectacle Editor - HTMLスライドをグラフィカルに作成

HTMLで作るプレゼンテーション用のスライドが流行っていますが、作成するのが意外と面倒だったりします。多くはMarkdownファイルをベースにしたものですが、エフェクトを定義できなかったりとスライドとしてのインパクトに欠けるものもあります。そこで使ってみたいのがSpectacle Editorです。HTMLをベースにし...

List

  • 2017/02/15

QArt.js - 好きな画像と組み合わせたQRコード生成

QRコードというと小さな四角が並んだ白黒の模様で、一般の人からするとよく分からないものに見えます。見た目の違いも分かりづらく、目を引きづらいため最近ではカラーにしたり、他の絵柄を混ぜると言った手法も開発されています。今回紹介するQArt.jsもその一つで、好きな画像をベースにQRコードを生成してくれます。## QArt...

List

  • 2017/02/14

multi.js - 複数選択のドロップダウンをリッチに変身

WebのフォームはHTML5でリッチになっていますが、それでもまだまだ標準では使い勝手がよくありません。とは言え、それを改善するためのライブラリも出てきていますので、積極的に取り入れていきましょう。今回紹介するのはmulti.js、複数選択できるselectタグを格好良くしてくれるライブラリです。## multi.js...

List

  • 2017/02/13

photo-screen-saver - Electronで作るWindows用スクリーンセーバー

今時スクリーンセーバーは不要という考えがあります。確かに液晶ディスプレイでは焼き付けはほぼ起こりません。しかしプラズマTVでは起こりえます(もちろん対処されているでしょうが)。また、なんとなくスクリーンセーバーは見ていて面白いものです。そんなスクリーンセーバーをHTML標準の技術で作れるのがphoto-screen-s...

List

  • 2017/02/12

svg2png - SVGファイルをPNGに変換

最近、画像の代わりにSVGを使っているサイトが増えてきました。それは良いことなのですが、まだまだ対応していないソフトウェアも多く、使い回す際に若干の不便があります。そんな時はWebブラウザでSVGを表示して、それのスクリーンショットを取るなんて面倒なことをしたりします。今回紹介するオープンソース・ソフトウェアはsvg2...

List

  • 2017/02/11

mo · js - Web上でモーションアニメーションを実現

Webの表現力は上がったと言われていますが、そのためのテクニックは必要です。SVGやCanvasを使いこなすのは相当難しく、専用のライブラリを使う方が手軽にアニメーションなどが実現できます。今回紹介するmo · jsもその一つで、モーションアニメーションが実装できるライブラリです。## mo · jsの使い方実装例です...

List

  • 2017/02/10

pen - React製のシンプルなMarkdownプレビューワー

Markdownはプログラマー界隈では広く普及した記法となっています。そのための専用エディタも多数存在します。しかしエディタはプログラマにとって大事なものであり、手に馴染むかどうかに大きな隔たりがあります。専用エディタは馴染まず、でもMarkdownのプレビューはしたいという方はpenを使ってみましょう。## penの...

List

  • 2017/02/09

参加者の名は。 - Connpassから参加者用ネームカードを生成

勉強会などで全く知らない人たちといきなり会話をするのは気後れしてしまいますが、実はTwitter上でつながっていたなんてことはよくあります。また、顔は知らなくともオンライン上の名前は知っているなんてことも多々あります。そうした良い出会いの助けになりそうなのが参加者の名は。です。Connpassの参加者一覧からネームカー...

List

  • 2017/02/08

Q Accelerator - Qiitaをよりアグレッシブに使いこなすためのChrome機能拡張

よく使っているサービスこそ、ちょっとした工夫でさらに便利にできることがあります。時々しか使わないものを改善するのに比べて圧倒的に分かりやすく、かつドッグフーティングで改善策がどんどん出てくるはずです。もしあなたがQiitaをよく使っているのであれば、Q Acceleratorをインストールするとより便利になることでしょ...

List

  • 2017/02/08

tlapse - 指定したURLに定期的にアクセスしてスクリーンショットを保存

Webサイトの作成はゼロから形になるものを作っていく、作品としての一面を持っています。いきなり完成品ができあがる訳ではなく、色々試行錯誤しながら、再読込を繰り返しつつできあがっていきます。そんなWebサイトのできあがっていく様を残し続けてくれるのがtlapseです。## tlapseの使い方tlapseは以下のように利...